Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 14229 | Rev 14231 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
14229 stevensc 1 
import React from 'react'
2 
import { useEffect } from 'react'
3 
import { useState } from 'react'
4 
 
5 
const ToggleComponent = ({ setValue = function () { } }) => {
6 
 
7 
	const [isActive, setIsActive] = useState(false)
8 
 
9 
	useEffect(() => {
10 
		setValue(isActive)
11 
	}, [isActive])
12 
 
13 
 
14 
	return (
15 
		<div
16 
			className={`toggle btn btn-block btn-primary ${!isActive && 'off'}`}
17 
			data-toggle="toggle"
18 
			role="button"
19 
			style={{ width: '130px' }}
20 
			onClick={() => setIsActive(!isActive)}
21 
		>
22 
			<input
23 
				type="checkbox"
24 
				checked={isActive}
25 
			/>
26 
			<div className="toggle-group">
14230 stevensc 27 
				<label htmlFor="status" className="btn btn-primary toggle-on">Mostrar</label>
28 
				<label htmlFor="status" className="btn btn-light toggle-off">No mostrar</label>
14229 stevensc 29 
				<span className="toggle-handle btn btn-light"></span>
30 
			</div>
31 
		</div>
32 
	)
33 
}
34 
 
35 
export default ToggleComponent