import { forwardRef } from 'react';

import CheckboxButton from '../checkboxButton';
import Option from '../common/Option';
import { ReferenceType } from '../common/Option/Option';
import { BaseOptionProps } from '../common/Option/Option';

export type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {
  /**
   * The checked state of the checkbox.
   */
  checked?: boolean;
  /**
   * Function to call when the checkbox option is clicked
   */
  onChange?: (value: boolean) => void;
};

const CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(
  ({ checked, disabled, onChange, ...rest }, reference) => {
    return (
      <Option
        {...rest}
        ref={reference}
        disabled={disabled}
        button={
          <CheckboxButton
            checked={checked}
            disabled={disabled}
            onChange={() => onChange?.(!checked)}
          />
        }
      />
    );
  },
);

export default CheckboxOption;
