import React from 'react'
import classNames from 'classnames'
import { string, object, array, bool, oneOfType } from 'prop-types'

const Textarea = ({ className, disabled, error, ...props }) => (
  <textarea
    className={classNames(
      'sw-textarea placeholder-bombayGrey transition-colors duration-200 text-pickledBlack text-sm textarea leading-contained border border-porcelain rounded px-4 py-2',
      'hover:border-gauloiseBlue-100 focus:border-gauloiseBlue-100 focus-outline-none',
      {
        'opacity-40 cursor-not-allowed': disabled,
        'border-radicalRed-100 hover:border-radicalRed-100 focus:border-radicalRed-100': error
      },
      className
    )}
    disabled={disabled}
    {...props}
  />
)

Textarea.displayName = 'Textarea'

Textarea.propTypes = {
  /** Allows passing of classes to component */
  className: oneOfType([string, object, array]),
  /** Determines if textarea is disabled */
  disabled: bool,
  /** Indicates an error associated with the element */
  error: bool
}

Textarea.defaultProps = {
  disabled: false,
  error: false
}

export default Textarea