Add inputRef prop to EuiFieldNumber and allow callbacks in select inp…

…utRef (#1434)

* Add inputRef prop to EuiFieldNumber and allow callbacks in select inputRef

* ref updates

* Add changelog

CHANGELOG.md

@@ -1,5 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `inputRef` prop to `EuiFieldNumber` and updated `EuiFieldText`'s to a Ref type ([#1434](https://github.com/elastic/eui/pull/1434))
+
 **Bug fixes**
 
 - Fixed `textProps` and `contentProps` of `EuiButton` and `EuiButtonEmpty` so they don’t override classes ([#1455](https://github.com/elastic/eui/pull/1455))

src/components/form/field_number/field_number.js

@@ -25,6 +25,7 @@ export const EuiFieldNumber = ({
   compressed,
   prepend,
   append,
+  inputRef,
   ...rest
 }) => {
   const classes = classNames('euiFieldNumber', className, {
@@ -54,6 +55,7 @@ export const EuiFieldNumber = ({
           value={value}
           placeholder={placeholder}
           className={classes}
+          ref={inputRef}
           {...rest}
         />
       </EuiValidatableControl>

src/components/form/field_number/index.d.ts

@@ -1,7 +1,7 @@
 import { CommonProps } from '../../common';
-import { IconType } from '../../icon'
+import { IconType } from '../../icon';
 
-import { ReactNode, SFC, InputHTMLAttributes } from 'react';
+import { ReactNode, SFC, InputHTMLAttributes, Ref } from 'react';
 
 declare module '@elastic/eui' {
 
@@ -18,6 +18,7 @@ declare module '@elastic/eui' {
     compressed?: boolean;
     prepend?: ReactNode | ReactNode[];
     append?: ReactNode | ReactNode[];
+    inputRef?: Ref<HTMLInputElement>;
   }
 
   export const EuiFieldNumber: SFC<

src/components/form/field_text/index.d.ts

@@ -1,6 +1,6 @@
 import { CommonProps } from '../../common';
 
-import { SFC, InputHTMLAttributes } from 'react';
+import { SFC, InputHTMLAttributes, Ref } from 'react';
 
 declare module '@elastic/eui' {
 
@@ -12,7 +12,7 @@ declare module '@elastic/eui' {
   export interface EuiFieldTextProps {
     icon?: string;
     isInvalid?: boolean;
-    inputRef?: (ref: HTMLInputElement) => void;
+    inputRef?: Ref<HTMLInputElement>;
     fullWidth?: boolean;
     isLoading?: boolean;
     prepend?: React.ReactNode;