import React, { useState } from 'react';
import classNames from 'classnames';
import './index.less';
import { useEffect } from 'react';

export default function Checkbox({ prefixCls, className = '', checked, onChange, disabled }) {
  const [active, setActive] = useState(checked);

  useEffect(() => {
    setActive(checked);
  }, [checked]);

  const handleCheck = () => {
    if (disabled) return;
    setActive(!active);
    onChange?.(!active);
  };

  return <div className={classNames(prefixCls, className, { active, disabled })} onClick={handleCheck} />;
}

Checkbox.defaultProps = {
  prefixCls: 'source-checkbox',
  checked: false,
  onChange: undefined,
  disabled: false
};
