From 2bf1fe77ba197b072dc09976f05bf05161013370 Mon Sep 17 00:00:00 2001
From: Angelos Chalaris <chalarangelo@gmail.com>
Date: Mon, 10 Dec 2018 10:16:24 +0200
Subject: [PATCH] Create Textarea.md

---
 snippets/Textarea.md | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 snippets/Textarea.md

diff --git a/snippets/Textarea.md b/snippets/Textarea.md
new file mode 100644
index 000000000..30978c920
--- /dev/null
+++ b/snippets/Textarea.md
@@ -0,0 +1,32 @@
+### Textarea
+
+Renders a `<textarea>` element that uses a callback function to pass its value to the parent component.
+
+Use object destructuring to set defaults for certain attributes of the `<textarea>` element.
+Render a `<textarea>` element with the appropriate attributes and use the `callback` function in the `onChange` event to pass the value of the textarea to the parent.
+
+```jsx
+function TextArea ({ callback, cols = 20, rows = 2, disabled = false, readOnly = false, placeholder='' }) {
+  return (
+    <textarea 
+      cols={cols}
+      rows={rows}
+      disabled={disabled} 
+      readOnly={readOnly} 
+      placeholder={placeholder}
+      onChange={(event) => callback(event.target.value)} 
+    />
+  );
+}
+```
+
+```jsx
+ReactDOM.render(
+  <TextArea type='text' placeholder='Insert some text here...' callback={(val) => console.log(val)}/>,
+  document.getElementById('root')
+);
+```
+
+<!-- tags: input,functional -->
+
+<!-- expertise: 0 -->