From 4e258c2eae86ead8b46d0e89371431f2da220a73 Mon Sep 17 00:00:00 2001
From: Zak Burke <zburke@cornell.edu>
Date: Tue, 14 Nov 2017 13:22:19 -0500
Subject: [PATCH] handle custom component

---
 src/MentionWrapper.js | 26 ++++++++++++++++++--------
 1 file changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/MentionWrapper.js b/src/MentionWrapper.js
index 42592a8..c66a939 100644
--- a/src/MentionWrapper.js
+++ b/src/MentionWrapper.js
@@ -165,18 +165,28 @@ class MentionWrapper extends Component {
   };
 
   render() {
-    const { children, component, getRef, ...inputProps } = this.props;
+    const { children, component, getRef, position, onChange, ...inputProps } = this.props;
     const { active, child, left, top, options } = this.state;
     const { item, className, style } = child;
+
+    const componentProps = {
+      ...inputProps,
+      inputRef: this.inputRef,
+      onBlur: this.handleBlur,
+      onInput: this.handleInput,
+      onKeyDown: this.handleKeyDown,
+    };
+
+    let inputElement;
+    if (component) {
+      inputElement =  React.createElement(component, componentProps);
+    } else {
+      inputElement = <textarea {...componentProps} ref={this.inputRef} />;
+    }
+
     return (
       <div>
-        <textarea
-          {...inputProps}
-          ref={this.inputRef}
-          onBlur={this.handleBlur}
-          onInput={this.handleInput}
-          onKeyDown={this.handleKeyDown}
-        />
+        {inputElement}
         {top !== undefined && (
           <MentionMenu
             active={active}