From 3b8b813f41b71653c9fd6b0052f5ddf196a22959 Mon Sep 17 00:00:00 2001
From: Paul Vazquez <pev@live.com.mx>
Date: Mon, 8 Apr 2019 22:18:28 -0500
Subject: [PATCH] Added information about the Accordion to the README of
 components

---
 src/components/README.md | 39 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/src/components/README.md b/src/components/README.md
index 30027ca9..6f4c7ab7 100644
--- a/src/components/README.md
+++ b/src/components/README.md
@@ -24,3 +24,42 @@ function header = (props) => {
     );
 }
 ```
+# Accordion
+
+### Props
+
+
+| Name |Type | Default | Description  |
+| ------------- |:-------------:| --- | ---- |
+| border|`bool`| false |  Border of the Accordion |
+| children | `Reactnode` |  |Children to render inside Accordion|
+| open|`bool`| false | Determines if the accordion is currently open or closed |
+| title |`string`|  | Title of the Accordion  |
+
+```
+      <div className={`accordion ${this.props.border ? 'border' : ''}`}>
+        <div
+          className="header"
+          onClick={() => {
+            this.setState(() => ({ isVisible: !this.state.isVisible }));
+          }}
+          role="button"
+          tabIndex={0}
+        >
+          <a>
+            <span>
+              <img
+                className={`${this.state.isVisible ? 'rotate90' : ''}`}
+                height="12px"
+                src={Arrow}
+                width="12px"
+              />
+            </span>&nbsp;&nbsp;
+            {this.props.title}
+          </a>
+        </div>
+        <div className={`content ${!this.state.isVisible ? 'close' : 'open'}`}>
+          {this.props.children}
+        </div>
+      </div>
+```
\ No newline at end of file