Tuesday, 4 December, 2018 UTC


Summary

react-input-switch
Input switch with react.
View Demo Download Source

Installation

npm install react-input-switch --save
yarn add react-input-switch

Theming

<Switch theme={{ primaryColor: 'blue' }} />

Controlled

import Switch from 'react-input-switch';

class extends React.Component {
  constructor(props) {
    super(props);
    this.state = { value: 0 };
  }

  render() {
    return (
      <Switch
        value={this.state.value}
        onChange={value => this.setState({ value })}
      />
    );
  }
}

Custom on/off value

import Switch from 'react-input-switch';

class extends React.Component {
  constructor(props) {
    super(props);
    this.state = { value: 'yes' };
  }

  render() {
    return (
      <>
        <Switch
          value={this.state.value}
          on="yes"
          off="no"
          onChange={value => this.setState({ value })}
        />
        {this.state.value}
      </>
    );
  }
}
GitHub