File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import {type ChangeEvent, useEffect, useRef} from "react";
type CheckBoxProps = {
id: string;
name: string;
checked: boolean;
onChange: (checked: boolean) => void;
value?: string;
label?: string;
disabled?: boolean;
indeterminate?: boolean;
};
export const CheckBox = ({
id,
name,
checked,
onChange,
value,
label,
disabled = false,
indeterminate = false,
}: CheckBoxProps) => {
const inputRef = useRef<HTMLInputElement>(null);
useEffect(() => {
if (!inputRef.current) {
return;
}
inputRef.current.indeterminate = indeterminate;
}, [indeterminate]);
const handleChange = (event: ChangeEvent<HTMLInputElement>) => {
onChange(event.target.checked);
};
return (
<>
<input
ref={inputRef}
type="checkbox"
className="checkbox"
id={id}
name={name}
value={value}
checked={checked}
disabled={disabled}
onChange={handleChange}
/>
<label htmlFor={id}>{label}</label>
</>
);
};