Accessible Toggle Components For React

Description:

A simple, flexible, and accessible toggle component for React that’s simple and gives you complete control over rendering and state.

Installation:

# NPM
$ npm install react-toggled --save

Basic Usage:

import React from 'react'
import {render} from 'react-dom'
import Toggle from 'react-toggled'
render(
  <Toggle>
    {({on, getTogglerProps}) => (
      <div>
        <button {...getTogglerProps()}>Toggle me</button>
        <div>{on ? 'Toggled On' : 'Toggled Off'}</div>
      </div>
    )}
  </Toggle>,
  document.getElementById('root'),
)

Default props.

defaultOn: false,
onToggle: () => {},

Preview: