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

interface Props {
    onChange: (str: string) => void;
    type: string,
    name: string,
    label: string,
    value: string,
  }

  export const Input: React.FC<Props> = ({type, name, label, onChange, value }) => {
    return(
        <div className={'blocks'}>
            <span className={'input input_filled'}>
                <input className={'input_field input_field_mui'}
                        type={type}
                        name={name}
                        value={value}
                        onChange={(event => onChange({value:event.target.value, }   }/>
                <label className={'input_label input_label_mui'} htmlFor={label}>
                    <span className={classNames('input_label_content', 'input_label_content_mui')}>{label}</span>
                </label>
            </span>
      </div>
    )
}

