From c80b6ea5fe4dd9825cf0541b68d124e7adb5e8b7 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Wed, 5 Jul 2017 16:44:54 +0300 Subject: [PATCH 01/45] Should be in dependencies --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 3ad39c0..78bbfde 100755 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "react-native-micro-animated-button", "description": "An animated button component for React Native.", - "version": "0.0.5", + "version": "0.0.6", "main": "button.js", "repository": { "type": "git", "url": "git+https://github.com/sonaye/react-native-micro-animated-button.git" }, - "peerDependencies": { + "dependencies": { "react-native-vector-icons": "^4.1.1" } } From 6eb51ec21c748ade8801e63e833c5da1158a9d93 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Wed, 5 Jul 2017 16:45:55 +0300 Subject: [PATCH 02/45] Add .npmignore --- .npmignore | 1 + 1 file changed, 1 insertion(+) create mode 100644 .npmignore diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..3f56d15 --- /dev/null +++ b/.npmignore @@ -0,0 +1 @@ +demos.gif From 8eba44e08f62a587dc951e080560e7d69c4ee5f8 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Wed, 5 Jul 2017 16:46:34 +0300 Subject: [PATCH 03/45] Fix typo --- .npmignore | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.npmignore b/.npmignore index 3f56d15..c5441d7 100644 --- a/.npmignore +++ b/.npmignore @@ -1 +1 @@ -demos.gif +demo.gif From 2f41daec888ba200c8d6971d508fa20005fcbc16 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Sat, 22 Jul 2017 09:53:28 +0300 Subject: [PATCH 04/45] Fix default borderRadius --- README.md | 2 +- button.js | 34 ++++++++++++++++------------------ package.json | 2 +- 3 files changed, 18 insertions(+), 20 deletions(-) diff --git a/README.md b/README.md index 8591af2..e26d192 100755 --- a/README.md +++ b/README.md @@ -42,7 +42,7 @@ type button = { }; const defaultStyle = { - borderRadius: 25, + borderRadius: 20, borderWidth: 0.5, height: 40, marginBottom: 10, diff --git a/button.js b/button.js index 7d20822..e741aa3 100755 --- a/button.js +++ b/button.js @@ -7,8 +7,7 @@ import { View } from 'react-native'; -import TouchableBounce - from 'react-native/Libraries/Components/Touchable/TouchableBounce'; +import TouchableBounce from 'react-native/Libraries/Components/Touchable/TouchableBounce'; import { FontAwesome } from '@expo/vector-icons'; @@ -113,21 +112,19 @@ export default class Button extends Component { backgroundColor: this.props.disabled ? this.props.disabledBackgroundColor || 'gray' : this.props.noFill - ? this.props.backgroundColor || 'white' - : this.state.error - ? this.errorBbackgroundColor - : this.successBackgroundColor, + ? this.props.backgroundColor || 'white' + : this.state.error + ? this.errorBbackgroundColor + : this.successBackgroundColor, borderColor: this.props.disabled ? this.props.disabledBackgroundColor || 'gray' : this.state.step === 2 - ? this.state.error - ? this.props.errorColor || - this.props.foregroundColor || - 'red' - : this.props.successColor || - this.props.foregroundColor || - 'green' - : this.props.foregroundColor || 'black', + ? this.state.error + ? this.props.errorColor || this.props.foregroundColor || 'red' + : this.props.successColor || + this.props.foregroundColor || + 'green' + : this.props.foregroundColor || 'black', flex: 0, justifyContent: 'center', transform: [ @@ -189,10 +186,11 @@ export default class Button extends Component { ); const props = { - disabled: (this.state.step !== 0 && !this.props.onSecondaryPress) || + disabled: + (this.state.step !== 0 && !this.props.onSecondaryPress) || this.props.disabled, - onPress: (this.state.step !== 0 && this.props.onSecondaryPress) || - this.press, + onPress: + (this.state.step !== 0 && this.props.onSecondaryPress) || this.press, children: button }; @@ -204,7 +202,7 @@ export default class Button extends Component { const styles = { button: { - borderRadius: 25, + borderRadius: 20, borderWidth: 0.5, height: 40, marginBottom: 10, diff --git a/package.json b/package.json index 78bbfde..f222a2b 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "react-native-micro-animated-button", "description": "An animated button component for React Native.", - "version": "0.0.6", + "version": "0.0.7", "main": "button.js", "repository": { "type": "git", From 2bfdf6e14c3524fb7c2c5d74a4726643731640c2 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Wed, 2 Aug 2017 01:21:11 +0300 Subject: [PATCH 05/45] peerDependencies all the way --- README.md | 4 +++- package.json | 4 ++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index e26d192..3c72009 100755 --- a/README.md +++ b/README.md @@ -2,7 +2,9 @@ # Installation -`yarn add react-native-micro-animated-button` +`yarn add react-native-vector-icons react-native-micro-animated-button` + +`react-native-vector-icons` may require native linking, see package [repository](https://github.com/oblador/react-native-vector-icons) for more details. # Definition ```javascript diff --git a/package.json b/package.json index f222a2b..42f6179 100755 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "react-native-micro-animated-button", "description": "An animated button component for React Native.", - "version": "0.0.7", + "version": "0.0.8", "main": "button.js", "repository": { "type": "git", "url": "git+https://github.com/sonaye/react-native-micro-animated-button.git" }, - "dependencies": { + "peerDependencies": { "react-native-vector-icons": "^4.1.1" } } From ac27cfb4140b05f96e399b604916fcfefbff127b Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Sat, 19 Aug 2017 23:29:23 +0300 Subject: [PATCH 06/45] Add button.load() --- README.md | 2 ++ button.js | 8 ++++++++ package.json | 2 +- 3 files changed, 11 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 3c72009..ce11c59 100755 --- a/README.md +++ b/README.md @@ -27,6 +27,7 @@ type button = { minWidth?: number, // default = 40 noFill?: boolean, // default = false onError?: Function, // default = () => null + onLoad?: Function, // default = () => null onPress?: Function, // default = () => null onReset?: Function, // default = () => null onSecondaryPress?: Function, // default = () => null @@ -57,6 +58,7 @@ const defaultLabelStyle = { // Methods button.error(); // Animates button to error state +button.load(); // Animates button to loading state button.reset(); // Animates button to initial/default state button.success(); // Animates button to success state ``` diff --git a/button.js b/button.js index e741aa3..509ffda 100755 --- a/button.js +++ b/button.js @@ -103,6 +103,14 @@ export default class Button extends Component { }); }; + load = () => { + this.setState({ step: 1 }); + + Animated.spring(this.animated, { toValue: 1 }).start(animation => { + if (animation.finished && this.props.onLoad) this.props.onLoad(); + }); + }; + render() { const button = ( Date: Sun, 15 Oct 2017 22:21:39 +0300 Subject: [PATCH 07/45] Support Ionicons --- README.md | 3 ++- button.js | 65 ++++++++++++++++++++++++++++------------------------ package.json | 7 +++--- 3 files changed, 41 insertions(+), 34 deletions(-) diff --git a/README.md b/README.md index ce11c59..9193955 100755 --- a/README.md +++ b/README.md @@ -41,7 +41,8 @@ type button = { style?: Object, // default = defaultStyle successColor?: string, // default = green successIconColor?: string, // default = white - successIconName: string + successIconName: string, + ionicons? boolean, // default = false }; const defaultStyle = { diff --git a/button.js b/button.js index 509ffda..1293986 100755 --- a/button.js +++ b/button.js @@ -9,7 +9,7 @@ import { import TouchableBounce from 'react-native/Libraries/Components/Touchable/TouchableBounce'; -import { FontAwesome } from '@expo/vector-icons'; +import { FontAwesome, Ionicons } from '@expo/vector-icons'; export default class Button extends Component { state = { step: 0, error: false }; @@ -112,6 +112,8 @@ export default class Button extends Component { }; render() { + const Icon = this.props.ionicons ? Ionicons : FontAwesome; + const button = ( - {this.state.step === 0 && + {this.state.step === 0 && ( - {this.props.labelIcon - ? + ) : ( + - : - {this.props.label} - } - } + }, + styles.label, + this.props.labelStyle + ]}> + {this.props.label} + + )} + + )} {this.state.step === 1 && - (this.props.renderIndicator || - )} + (this.props.renderIndicator || ( + + ))} {this.state.step === 2 && - (this.props.renderIcon || - )} + /> + ))} ); diff --git a/package.json b/package.json index 21432a4..baf795f 100755 --- a/package.json +++ b/package.json @@ -1,13 +1,14 @@ { "name": "react-native-micro-animated-button", "description": "An animated button component for React Native.", - "version": "0.0.9", + "version": "0.0.10", "main": "button.js", "repository": { "type": "git", - "url": "git+https://github.com/sonaye/react-native-micro-animated-button.git" + "url": + "git+https://github.com/sonaye/react-native-micro-animated-button.git" }, "peerDependencies": { - "react-native-vector-icons": "^4.1.1" + "react-native-vector-icons": "^5.2.0" } } From 42274d199221c8b69dee8c060fcf2d9dbebc1ca7 Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Fri, 20 Oct 2017 17:38:27 +0300 Subject: [PATCH 08/45] Fix icons dep. --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index baf795f..3ac3da7 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "react-native-micro-animated-button", "description": "An animated button component for React Native.", - "version": "0.0.10", + "version": "0.0.12", "main": "button.js", "repository": { "type": "git", @@ -9,6 +9,6 @@ "git+https://github.com/sonaye/react-native-micro-animated-button.git" }, "peerDependencies": { - "react-native-vector-icons": "^5.2.0" + "react-native-vector-icons": "^4.1.1" } } From 27c7fe2c2fa3f1e66859a68f8274c7f52139780c Mon Sep 17 00:00:00 2001 From: Abdulrahman Date: Sun, 22 Oct 2017 19:30:43 +0300 Subject: [PATCH 09/45] Support all icon sets in vector-icons MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ``` import Ionicons from ‘react-native-vector-icons/Ionicons’;