From 95e7c6065ba5ad9e92a1469643bb5bfdfebb57a6 Mon Sep 17 00:00:00 2001 From: Tushar Agarwal Date: Tue, 1 Oct 2019 11:13:35 +0530 Subject: [PATCH 1/3] Add props to customize on/off colors --- README.md | 12 ++++++++++ examples/index.jsx | 53 ++++++++++++++++++++++++++++++++++++++++++++ src/ToggleSwitch.jsx | 5 +++++ 3 files changed, 70 insertions(+) diff --git a/README.md b/README.md index 1c57551..03c93bd 100644 --- a/README.md +++ b/README.md @@ -92,6 +92,18 @@ console.log(this.toggleSwitch.checked); 'lg' + + onColor + string / hex + '#ff0000' + Color when state is ON + + + offColor + string / hex + '#009000' + Color when state is OFF + diff --git a/examples/index.jsx b/examples/index.jsx index 7960367..98d8f64 100644 --- a/examples/index.jsx +++ b/examples/index.jsx @@ -102,6 +102,59 @@ class App extends React.Component { +
+
+
+
+
+ Colored +
+
+
+
+
+
+ + ON Green +
+
+ + ON Green (Disabled) +
+
+
+
+ + OFF Red +
+
+ + ON / OFF (Red / Green) +
+
+
+
+
+
+
); } diff --git a/src/ToggleSwitch.jsx b/src/ToggleSwitch.jsx index 1222483..5e9d842 100644 --- a/src/ToggleSwitch.jsx +++ b/src/ToggleSwitch.jsx @@ -55,12 +55,16 @@ class ToggleSwitch extends PureComponent { className, disabled, size, + onColor, + offColor, ...props } = this.props; delete props.checked; delete props.onChange; + const color = this.state.checked ? onColor : offColor; + return ( ); From dcc08516a06da76c1656331418045d0f33691e9f Mon Sep 17 00:00:00 2001 From: Tushar Agarwal Date: Tue, 1 Oct 2019 11:27:53 +0530 Subject: [PATCH 2/3] Bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 21ad89e..b92c760 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@trendmicro/react-toggle-switch", - "version": "0.5.7", + "version": "0.5.8", "description": "Trend Micro Components: React Toggle Switch", "main": "lib/index.js", "files": [ From b49f80389f7c37e53ca78d218acd9a26fe9426ef Mon Sep 17 00:00:00 2001 From: Tushar Agarwal Date: Tue, 1 Oct 2019 11:32:26 +0530 Subject: [PATCH 3/3] Do not install npm before install --- .travis.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/.travis.yml b/.travis.yml index f7a64e2..7a88d81 100644 --- a/.travis.yml +++ b/.travis.yml @@ -13,7 +13,6 @@ node_js: - '4' before_install: - - npm install -g npm - npm --version after_success: