git.iko.soy/bridge
on f660f7b help sign in
bridge/src/components/old/CheckboxButton.js
55 lines 1.4 kB history raw
1import React from 'react';
2import PropTypes from 'prop-types';
3import ProtoButton from './ProtoButton';
5const CheckboxButton = props => {
6 const onOff =
7 props.state === true
8 ? 'cb-on br-blue bg-blue outline-blue'
9 : 'bg-transparent br-black outline-blue';
11 const checkmarkState = props.state === true ? 'o-100' : 'o-0';
13 const classes = props.disabled ? 'br-gray-30 bg-gray-10' : onOff;
15 return (
16 <div
17 className={`flex items-center ${props.className}`}
18 style={{ cursor: 'pointer', ...props.style }}
19 onClick={props.onToggle}>
20 <ProtoButton
21 // {...getDomProps(props)}
22 {...props}
23 className={`s-7 p-0 o-blue mr-4 bs-solid bw-2 ${classes}`}>
24 <svg
25 className={checkmarkState}
26 width="24"
27 height="24"
28 viewBox="0 0 24 24"
29 fill="none"
30 xmlns="http://www.w3.org/2000/svg">
31 <path
32 d="M2 3.55661V0H0V5.55661H12.4182V3.55661H2Z"
33 transform="translate(6, 13) rotate(-45)"
34 fill="white"
35 />
36 </svg>
37 </ProtoButton>
39 <div>{props.label}</div>
40 {props.children}
41 </div>
42 );
43};
45CheckboxButton.propTypes = {
46 state: PropTypes.bool,
47 className: PropTypes.string,
48};
50CheckboxButton.defaultProps = {
51 state: false,
52 className: '',
53};
55export default CheckboxButton;