import React from 'react'

import { CheckboxProps } from './Checkbox.types'

import Label from '../Label'

import './Checkbox.css'

const Checkbox = ({
  checked,
  className,
  label,

  onChange,
}: CheckboxProps) => {
  return (
    <div className='w-full'>
      <Label text={label} />
      <span className='relative'>
        <input
          type='checkbox'
          checked={checked}
          onChange={(e) => onChange(e.target.checked)}
          className={className}
        />
      </span>
    </div>
  )
}

export default Checkbox
