import React from 'react';
import PropTypes from 'prop-types';
import Textarea from 'react-textarea-autosize';

import FieldControl from '../FieldControl';
import './text-area.scss';

function getInputProps(props) {
  const { input, ...resultProps } = props;
  return { ...resultProps, ...input };
}

const propTypes = {
  textareaClassName: PropTypes.string,
  input: PropTypes.object
};

const defaultProps = {
  textareaClassName: '',
  input: null
};


const TextArea = ({
  textareaClassName,
  ...props
}) => {
  const { value } = props.input || props;
  const length = typeof value === 'string' ? value.length : 0;
  return (
    <FieldControl length={length} {...props}>
      {restProps => (
        <Textarea
          className={textareaClassName}
          styleName="input-control"
          {...getInputProps(restProps)}
        />
      )}
    </FieldControl>
  );
};

TextArea.propTypes = propTypes;
TextArea.defaultProps = defaultProps;
export default TextArea;
