react-multi-switch v1.0.0
#react-multi-switch
A configurable multi-switch UI component for ReactJS application written in TypeScript.
Installation
with JSPM
mydir$ jspm install npm:react-multi-switch --save with NPM
mydir$ npm install react-multi-switch --save-##Properties
1. itemWidth a number representing the individual state width.
2. states an array of states each state is an object literal containing label and key
3. onChange a function to be called when the state changes, it is passed the index of the state that has been clicked, and the state's key.
4. selIndex the currently selected index, the application should change this from the onChange function to reflect the index of the selected state.
5. className an optional parameter to set another class on the MultiSwitch root element.
Usage ES6 and JSPM
Include the stylesheet either
react-multi-switch.min.cssminified orreact-multi-switch.cssunminified.<link rel="stylesheet" href="/path-to-css/react-multi-switch.min.css" />Using JSPM
import {MultiSwitch} from 'react-multi-switch'; const states = [{ label:'Item 1', key:'item1' },{ label:'Item 2', key:'item2' }]; <MultiSwitch itemWidth={100} onChange={(idx,key)=>{}} selIndex={0} states={states} />
##Usage with CommonJS modules
var MultiSwitch = require('react-multi-switch').MultiSwitch;
const states = [{
label:'Item 1',
key:'item1'
},{
label:'Item 2',
key:'item2'
}];
<MultiSwitch itemWidth={100} onChange={(idx,key)=>{}} selIndex={0} states={states} />10 years ago