import {
  CheckboxProps,
  extendVariants,
  Checkbox as HeroUICheckBox
} from '@heroui/react';
interface ICheckBoxProps extends CheckboxProps {}
const HeroCheckBox = extendVariants(HeroUICheckBox, {
  defaultVariants: {
    size: 'lg',
    radius: 'none',
    color: 'primary'
  }
});

const CheckBox: React.FC<ICheckBoxProps> = ({ children, ...rest }) => {
  return (
    <HeroCheckBox
      {...rest}
      ref={(rest.ref as any) || null}
      classNames={{
        label: 'text-sm ',
        icon: 'text-white bg-primary',
        wrapper: `before:!border-[1px] before:border-black dark:before:border-white before:!rounded-[5px] !overflow-hidden
         !rounded-[5px] after:bg-primary
         ${rest.isInvalid && 'before:!border-danger'} ${rest.classNames?.wrapper}`,
        hiddenInput: 'overflow-hidden',
        base: 'flex items-end'
      }}>
      {children}
    </HeroCheckBox>
  );
};

export default CheckBox;
