BetterDiscordApp-rauenzi/renderer/src/ui/customcss/checkbox.jsx

23 lines
939 B
React
Raw Normal View History

2019-06-10 22:37:50 +02:00
import {React} from "modules";
2023-03-07 01:17:28 +01:00
const {useState, useCallback} = React;
2019-06-10 22:37:50 +02:00
2023-03-07 01:17:28 +01:00
2023-03-20 03:23:11 +01:00
export default function Checkbox({checked: initialState, text, onChange: notifyParent}) {
const [checked, setChecked] = useState(initialState);
2023-03-07 01:17:28 +01:00
const onClick = useCallback(() => {
2023-03-20 03:23:11 +01:00
notifyParent?.(!checked);
2023-03-07 01:17:28 +01:00
setChecked(!checked);
2023-03-20 03:23:11 +01:00
}, [notifyParent, checked]);
2023-03-07 01:17:28 +01:00
return <div className="checkbox-item">
2023-03-20 03:23:11 +01:00
<div className="checkbox-label label-JWQiNe da-label">{text}</div>
2023-03-07 01:17:28 +01:00
<div className="checkbox-wrapper checkbox-3kaeSU da-checkbox checkbox-3EVISJ da-checkbox" onClick={onClick}>
2019-06-10 22:37:50 +02:00
<div className="checkbox-inner checkboxInner-3yjcPe da-checkboxInner">
2023-03-07 01:17:28 +01:00
<input className="checkbox checkboxElement-1qV33p da-checkboxElement" checked={checked} type="checkbox" />
2019-06-10 22:37:50 +02:00
<span></span>
</div>
<span></span>
</div>
</div>;
}