28 lines
815 B
JavaScript
28 lines
815 B
JavaScript
import { CheckBoxCheckSvg, CheckBoxUncheckSvg } from './icons/icons';
|
|
|
|
const Checkbox = ({ checked = false, onChange, label, size = '26', disabled = false, className = '', labelClassName = '' }) => {
|
|
const handleClick = () => {
|
|
if (!disabled && onChange) {
|
|
onChange(!checked);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div
|
|
className={`custom-checkbox ${disabled ? 'disabled' : ''} ${className}`}
|
|
onClick={handleClick}
|
|
style={{
|
|
display: 'inline-flex',
|
|
alignItems: 'center',
|
|
gap: '8px',
|
|
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
opacity: disabled ? 0.6 : 1,
|
|
}}>
|
|
<div className='custom-checkbox-icon'>{checked ? <CheckBoxCheckSvg size={size} /> : <CheckBoxUncheckSvg size={size} />}</div>
|
|
{label && <span className={labelClassName}>{label}</span>}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Checkbox;
|