import React from 'react';
import './index.less';

class Checkbox extends React.PureComponent {
  static defaultProps = {
    value: '',
    name: ''
  };

  handleChange = e => {
    const { onChange, index } = this.props;
    if (onChange) {
      onChange(e, index);
    }
  };

  render() {
    const {
      defaultChecked,
      value,
      name,
      index,
      label,
      style,
      disabled
    } = this.props;
    return (
      <label className="wowjoy-checkbox" style={style}>
        <input
          disabled={disabled || false}
          type="checkbox"
          name={name}
          value={value}
          data-index={index}
          defaultChecked={defaultChecked}
          onChange={this.handleChange}
          style={{ display: 'none' }}
        />
        <span className="wowjoy-checkbox__inner"></span>
        <span className="wowjoy-checkbox__text">{label}</span>
      </label>
    );
  }
}

export default Checkbox;