From 5984ad047f1eb31757fa55011419b3b5cb3ebd9e Mon Sep 17 00:00:00 2001
From: Vasek Mlejnsky <vasek.mlejnsky@gmail.com>
Date: Wed, 5 Sep 2018 10:57:14 +0200
Subject: [PATCH] Add prop that can add elements on top of input/textarea

---
 src/components/Textarea/index.js     | 13 +++++++++----
 src/components/inputs/Input/index.js |  8 ++++----
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/Textarea/index.js b/src/components/Textarea/index.js
index 314dd400..e33139c1 100644
--- a/src/components/Textarea/index.js
+++ b/src/components/Textarea/index.js
@@ -86,6 +86,11 @@ const TextArea = styled.textarea`
     }
 `;
 
+const TopLabel = styled.span`
+    padding-bottom: 4px;
+    color: ${colors.TEXT_SECONDARY};
+`;
+
 const Textarea = ({
     className,
     placeholder = '',
@@ -96,11 +101,11 @@ const Textarea = ({
     isDisabled,
     onChange,
     isError,
-    label,
+    topLabel,
 }) => (
     <Wrapper>
-        {label && (
-            <Label>{label}</Label>
+        {topLabel && (
+            <TopLabel>{topLabel}</TopLabel>
         )}
         <TextArea
             className={className}
@@ -126,7 +131,7 @@ Textarea.propTypes = {
     placeholder: PropTypes.string,
     value: PropTypes.string,
     isDisabled: PropTypes.bool,
-    label: PropTypes.string,
+    topLabel: PropTypes.node,
 };
 
 export default Textarea;
diff --git a/src/components/inputs/Input/index.js b/src/components/inputs/Input/index.js
index 46b4a6b5..339b73cc 100644
--- a/src/components/inputs/Input/index.js
+++ b/src/components/inputs/Input/index.js
@@ -28,7 +28,7 @@ const InputIconWrapper = styled.div`
     display: inline-block;
 `;
 
-const InputLabel = styled.span`
+const TopLabel = styled.span`
     padding-bottom: 4px;
     color: ${colors.TEXT_SECONDARY};
 `;
@@ -102,8 +102,8 @@ class Input extends Component {
             <Wrapper
                 className={this.props.className}
             >
-                {this.props.inputLabel && (
-                    <InputLabel>{this.props.inputLabel}</InputLabel>
+                {this.props.topLabel && (
+                    <TopLabel>{this.props.topLabel}</TopLabel>
                 )}
                 <InputWrapper>
                     <InputIconWrapper>
@@ -153,7 +153,7 @@ Input.propTypes = {
     onChange: PropTypes.func,
     state: PropTypes.string,
     bottomText: PropTypes.string,
-    inputLabel: PropTypes.string,
+    topLabel: PropTypes.node,
     sideAddons: PropTypes.arrayOf(PropTypes.node),
     isDisabled: PropTypes.bool,
 };