import React from "react";
import PropTypes from "prop-types";
import { ITextAreaProps } from "./form.d";
import Form from "./form-tags";

const Texarea = (props: ITextAreaProps) => {
  const {
    className,
    labelClassName,
    name,
    value,
    label,
    error,
    placeholder,
    onChange,
    onBlur,
    help,
    rows,
    required,
    readOnly,
    disabled,
    inline,
    autoFocus,
    escapeHelpContent,
    onKeyUp
  } = props;
  const testId = props["data-testid"] || "honeyui-input";

  return (
    <Form.Group>
      <Form.LabelTag className={labelClassName} name={name} data-testid={`${testId}-label`}>
        {label}
      </Form.LabelTag>
      <Form.TextareaTag
        className={className}
        error={error}
        name={name}
        placeholder={placeholder}
        onChange={onChange}
        onBlur={onBlur}
        data-testid={testId}
        value={value}
        readOnly={readOnly}
        disabled={disabled}
        required={required}
        rows={rows}
        autoFocus={autoFocus}
        onKeyUp={onKeyUp}
      />
      <Form.HelpTag data-testid={`${testId}-help`} name={name} escapeContent={escapeHelpContent}>
        {help}
      </Form.HelpTag>
      <Form.ErrorTag data-testid={`${testId}-error`} name={name}>
        {error}
      </Form.ErrorTag>
    </Form.Group>
  );
};

Texarea.displayName = "Texarea";

Texarea.defaultProps = {
  inline: false,
  readOnly: false,
  disabled: false,
  required: false,
  autoFocus: false
};

Texarea.propTypes = {
  value: PropTypes.string.isRequired,
  label: PropTypes.string,
  name: PropTypes.string.isRequired,
  className: PropTypes.string,
  rows: PropTypes.number,
  labelClassName: PropTypes.string,
  error: PropTypes.string,
  inline: PropTypes.bool,
  placeholder: PropTypes.string,
  readOnly: PropTypes.bool,
  disabled: PropTypes.bool,
  required: PropTypes.bool,
  help: PropTypes.string,
  onChange: PropTypes.func,
  onBlur: PropTypes.func,
  autoFocus: PropTypes.bool,
  escapeHelpContent: PropTypes.bool
};

export default Texarea;