function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import v from '../../config/variables';
const Input = styled.input`
  width: 100%;
  outline: none;
  border: 1px solid ${v.input.borderColor};
  border-radius: 50px;
  background: ${props => (props.disabled || props.readOnly) && v.input.disabled.backgroundColor};
  color: ${v.input.color};
  text-align: ${props => props.textCenter && 'center'};
  font-size: ${props => v.fontSizes[props.size]}px;
  padding: ${props => v.sizeDivisor[props.size] * 3 / 4}px ${props => v.sizeDivisor[props.size] * 3}px;

  ::placeholder {
    color: ${v.input.placeholderColor};
  }
`;

class InputText extends React.Component {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "handleChange", event => {
      const {
        value
      } = event.target;
      this.props.onChange && this.props.onChange(value, this.props.name);
    });
  }

  render() {
    return React.createElement(Input, _extends({}, this.props, {
      value: this.props.value,
      onChange: this.handleChange
    }));
  }

}

_defineProperty(InputText, "propTypes", {
  name: PropTypes.string,
  size: PropTypes.oneOf(['small', 'medium', 'large']),
  textCenter: PropTypes.bool,
  value: PropTypes.string,
  type: PropTypes.oneOf(['password', 'text', 'color', 'date', 'datetime-local', 'email', 'month', 'number', 'range', 'search', 'tel', 'time', 'url', 'week']),
  readOnly: PropTypes.bool,
  disabled: PropTypes.bool,
  placeholder: PropTypes.string,
  onChange: PropTypes.func
});

_defineProperty(InputText, "defaultProps", {
  name: null,
  size: 'medium',
  textCenter: false,
  value: '',
  type: 'text',
  readOnly: false,
  disabled: false,
  placeholder: null,
  onChange: null
  /**
   * @description callback after change input text
   * @param { Object } event
   * @returns { Void }
   */

});

export default InputText;