-
Notifications
You must be signed in to change notification settings - Fork 0
/
CheckBoxInput.tsx
40 lines (35 loc) · 1.02 KB
/
CheckBoxInput.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
import { FormEvent } from "react"
type CheckBoxInputProps = {
label: string
checked: boolean
onChange: (checked: boolean, name: string) => void
}
const CheckBoxInput = ({ label, checked, onChange }: CheckBoxInputProps) => {
const text = label.toLowerCase()
const onChangeHandle = (event: FormEvent<HTMLInputElement>) => {
const checked = (event.target as HTMLInputElement).checked
onChange(checked, text)
}
return (
<li className='password__content__fwitem'>
<section className='password__content__fwchecked'>
<input
role='password checkbox'
className='password__content__fwiinput'
type='checkbox'
name={text}
id={text}
defaultChecked={checked}
onChange={onChangeHandle}
/>
<label
role='label'
className='password__content__fwilabel'
htmlFor={text}>
{label}
</label>
</section>
</li>
)
}
export default CheckBoxInput