EuiTextArea: converted to Typescript (#2695)

* Converts EuiTextArea to Typescript

* Adds PR number to CHANGELOG line

Author: ffknob

CHANGELOG.md

@@ -1,6 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
 - Converted `EuiHighlight` to Typescript ([#2681](https://github.com/elastic/eui/pull/2681))
+- Converted `EuiTextArea` to Typescript ([#2695](https://github.com/elastic/eui/pull/2695))
 - Converted `EuiPage` and related child components to  TypeScript ([#2669](https://github.com/elastic/eui/pull/2669))
 
 **Bug fixes**

src/components/form/text_area/__snapshots__/text_area.test.js.snap renamed to src/components/form/text_area/__snapshots__/text_area.test.tsx.snap

@@ -1,9 +1,22 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { TextareaHTMLAttributes, Ref, FunctionComponent } from 'react';
+import { CommonProps } from '../../common';
 import classNames from 'classnames';
-
 import { EuiValidatableControl } from '../validatable_control';
 
+export type EuiTextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> &
+  CommonProps & {
+    isInvalid?: boolean;
+    fullWidth?: boolean;
+    compressed?: boolean;
+
+    /**
+     * Which direction, if at all, should the textarea resize
+     */
+    resize?: keyof typeof resizeToClassNameMap;
+
+    inputRef?: Ref<HTMLTextAreaElement>;
+  };
+
 const resizeToClassNameMap = {
   vertical: 'euiTextArea--resizeVertical',
   horizontal: 'euiTextArea--resizeHorizontal',
@@ -13,17 +26,17 @@ const resizeToClassNameMap = {
 
 export const RESIZE = Object.keys(resizeToClassNameMap);
 
-export const EuiTextArea = ({
+export const EuiTextArea: FunctionComponent<EuiTextAreaProps> = ({
   children,
   className,
   compressed,
-  fullWidth,
+  fullWidth = false,
   id,
   inputRef,
   isInvalid,
   name,
   placeholder,
-  resize,
+  resize = 'vertical',
   rows,
   ...rest
 }) => {
@@ -37,7 +50,7 @@ export const EuiTextArea = ({
     className
   );
 
-  let definedRows;
+  let definedRows: number;
 
   if (rows) {
     definedRows = rows;
@@ -62,23 +75,3 @@ export const EuiTextArea = ({
     </EuiValidatableControl>
   );
 };
-
-EuiTextArea.propTypes = {
-  name: PropTypes.string,
-  id: PropTypes.string,
-  placeholder: PropTypes.string,
-  rows: PropTypes.number,
-  isInvalid: PropTypes.bool,
-  fullWidth: PropTypes.bool,
-  compressed: PropTypes.bool,
-
-  /**
-   * Which direction, if at all, should the textarea resize
-   */
-  resize: PropTypes.oneOf(RESIZE),
-};
-
-EuiTextArea.defaultProps = {
-  fullWidth: false,
-  resize: 'vertical',
-};