import React from 'react';
import PropTypes from 'prop-types';

/**
 * A stateless component which represents checkbox
 */
const InputCheckBox = props => {
    let checkboxProps = { ...props };
    delete checkboxProps.parentClassName;
    let classes = ['jp-container-checkbox',
        props.parentClassName ? props.parentClassName : null,
        props.disabled ? 'disabled' : null
    ];
    return (
        <span>
            <span>
        <label className={classes.join(' ')} id={props.id + 'Label'} htmlFor={props.id}>
            <input type="checkbox" {...checkboxProps} />
            <span className="jp-checkmark" />
        </label>
           </span>
            <span className="jp-checkbox-label-text">{props.islinkwithtext === 'true' ? <span>{props.label.map((data, index) => {
                return (
                    <span key={index}>
                        <span role='link' tabIndex='0' onClick={data.functionName} onKeyDown={() => {}} className='jp-back'>{!data.isLink ? data.label : ''}</span>
                        <span>{data.isLink ? data.label : ''}</span>
                    </span>
                );

            })}</span>
                : <span className='jp-cursor'>{props.normallabel}</span>}</span></span>

        
    );

};

export default InputCheckBox;

InputCheckBox.propTypes = {
    /** Unique ID for the field. Required for web accessibility */
    id: PropTypes.string.isRequired,
    /** Set a value for check box */
    isLink: PropTypes.bool,
    /** property to make checkbox disabled for editing  */
    disabled: PropTypes.bool,
    /** function reference which manages checkbox toggling */
    functionName: PropTypes.func,
    /** used to represent default state of checkbox */
    checked: PropTypes.string,
    /** Label for the field */
    normallabel: PropTypes.string,
    /** Class applied to parent container for additional styling  */
    parentClassName: PropTypes.string,
    /** flag to check text is having Link and Text Or only text */
    islinkwithtext: PropTypes.string,
    /** label having Link and Text to display */
    label: PropTypes.array,
};

InputCheckBox.defaultProps = {
    disabled: false,
    parentClassName: '',
    islinkwithtext: 'false'
};