// @flow
import PropTypes from 'prop-types';
import { translatedContentPropType } from '../../../types';
import type { TranslatedContent } from '../../../types';

export type TextAreaProps<ValueType> = {
  id?: string,
  placeholder?: ValueType,
  value?: ?ValueType,
  disabled?: boolean,
  focusOnMount?: boolean,
  label: TranslatedContent,
  hideLabel?: boolean,
  resize?: boolean,
  className?: string,
  height?: string,
  onChange: (ValueType, SyntheticInputEvent<HTMLInputElement>) => void,
  onFocus?: (SyntheticFocusEvent<HTMLInputElement>) => void,
  onBlur?: (SyntheticFocusEvent<HTMLInputElement>) => void,
};

export const textAreaPropTypes = {
  id: PropTypes.string,
  placeholder: PropTypes.string,
  value: PropTypes.string,
  disabled: PropTypes.bool,
  focusOnMount: PropTypes.bool,
  label: translatedContentPropType.isRequired,
  hideLabel: PropTypes.bool,
  resize: PropTypes.bool,
  className: PropTypes.string,
  height: PropTypes.string,
  onChange: PropTypes.func.isRequired,
  onFocus: PropTypes.func,
  onBlur: PropTypes.func,
};
