https://github.com/swiftcarrot/react-input-switch

React toggle switch component
https://github.com/swiftcarrot/react-input-switch

react react-component

Last synced: 2 months ago
JSON representation

React toggle switch component

• Host: GitHub
• URL: https://github.com/swiftcarrot/react-input-switch
• Owner: swiftcarrot
• License: mit
• Created: 2015-06-17T07:22:49.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2023-01-03T16:37:42.000Z (over 2 years ago)
• Last Synced: 2025-04-10T12:17:13.259Z (3 months ago)
• Topics: react, react-component
• Language: JavaScript
• Homepage: https://swiftcarrot.dev/react-input-switch/
• Size: 875 KB
• Stars: 13
• Watchers: 3
• Forks: 5
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-input-switch

[![npm](https://img.shields.io/npm/v/react-input-switch.svg)](https://www.npmjs.com/package/react-input-switch)

[![npm](https://img.shields.io/npm/dm/react-input-switch.svg)](https://www.npmjs.com/package/react-input-switch)

[![Build Status](https://travis-ci.org/swiftcarrot/react-input-switch.svg?branch=master)](https://travis-ci.org/swiftcarrot/react-input-switch)

[![codecov](https://codecov.io/gh/swiftcarrot/react-input-switch/branch/master/graph/badge.svg)](https://codecov.io/gh/swiftcarrot/react-input-switch)

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

React toggle switch component

### Installation

```sh

npm install react-input-switch --save

yarn add react-input-switch

```

### Demo

[https://swiftcarrot.dev/react-input-switch/](https://swiftcarrot.dev/react-input-switch/)

### Custom styles

```javascript

```

### Controlled example (with hook)

```javascript

import React, { useState } from 'react';

import Switch from 'react-input-switch';

const App = () => {

  const [value, setValue] = useState(0);

  return ;

};

```

### Custom on/off value

The default on/off value is 1/0 and default value is 1. This component will also render a hidden input (``) with current value and the name prop.

```javascript

import React, { useState } from 'react';

import Switch from 'react-input-switch';

const App = () => {

  const [value, setValue] = useState('yes');

  return ;

};

```

### License

MIT