From 18dcf6010126e64d0f070cfd194780d592c08a0f Mon Sep 17 00:00:00 2001
From: Chris Roberson <chrisronline@gmail.com>
Date: Mon, 21 Aug 2017 16:43:22 -0400
Subject: [PATCH] Port work to fix issue with using refs, original work:
 https://github.com/chrisronline/kibana/commit/8d50f6f0beccab4c62c19e3eb33048a6838e581a
 (#13624)

---
 .../src/components/form/field_text/field_text.js       |  3 +++
 .../form/validatable_control/validatable_control.js    | 10 +++++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/ui_framework/src/components/form/field_text/field_text.js b/ui_framework/src/components/form/field_text/field_text.js
index 2ac8cd8370ac9b..f3dd0b8a224551 100644
--- a/ui_framework/src/components/form/field_text/field_text.js
+++ b/ui_framework/src/components/form/field_text/field_text.js
@@ -19,6 +19,7 @@ export const KuiFieldText = ({
   className,
   icon,
   isInvalid,
+  inputRef,
   ...rest,
 }) => {
   const classes = classNames('kuiFieldText', className, {
@@ -39,6 +40,7 @@ export const KuiFieldText = ({
           placeholder={placeholder}
           className={classes}
           value={value}
+          ref={inputRef}
           {...rest}
         />
       </KuiValidatableControl>
@@ -53,6 +55,7 @@ KuiFieldText.propTypes = {
   value: PropTypes.string,
   icon: PropTypes.string,
   isInvalid: PropTypes.bool,
+  inputRef: PropTypes.func,
 };
 
 KuiFieldText.defaultProps = {
diff --git a/ui_framework/src/components/form/validatable_control/validatable_control.js b/ui_framework/src/components/form/validatable_control/validatable_control.js
index e5ce79110228b5..658ab210ad93fe 100644
--- a/ui_framework/src/components/form/validatable_control/validatable_control.js
+++ b/ui_framework/src/components/form/validatable_control/validatable_control.js
@@ -28,7 +28,15 @@ export class KuiValidatableControl extends Component {
 
   render() {
     return cloneElement(this.props.children, {
-      ref: node => { this.control = node; },
+      ref: node => {
+        this.control = node;
+
+        // Call the original ref, if any
+        const { ref } = this.props.children;
+        if (typeof ref === 'function') {
+          ref(node);
+        }
+      },
     });
   }
 }