Merge pull request #586 from kiprasmel/feat/toggle-checkbox-on-label-click

feat/toggle-checkbox-on-label-click
This commit is contained in:
Mike Cao 2021-04-08 22:01:52 -07:00 committed by GitHub
commit afb5e17476
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 2 deletions

View File

@ -7,12 +7,14 @@ import styles from './Checkbox.module.css';
function Checkbox({ name, value, label, onChange }) {
const ref = useRef();
const onClick = () => ref.current.click();
return (
<div className={styles.container}>
<div className={styles.checkbox} onClick={() => ref.current.click()}>
<div className={styles.checkbox} onClick={onClick}>
{value && <Icon icon={<Check />} size="small" />}
</div>
<label className={styles.label} htmlFor={name}>
<label className={styles.label} htmlFor={name} onClick={onClick}>
{label}
</label>
<input

View File

@ -17,6 +17,7 @@
.label {
margin-left: 10px;
user-select: none; /* disable text selection when clicking to toggle the checkbox */
}
.input {