From 7627876968f5073ed0888bf7c1d1155c070e76b8 Mon Sep 17 00:00:00 2001
From: Dan Head <me@danielhead.com>
Date: Mon, 18 Jan 2021 21:39:55 +0000
Subject: [PATCH] feat(input-text): init component

---
 src/components/input-text.js | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)
 create mode 100644 src/components/input-text.js

diff --git a/src/components/input-text.js b/src/components/input-text.js
new file mode 100644
index 0000000..79c3757
--- /dev/null
+++ b/src/components/input-text.js
@@ -0,0 +1,28 @@
+import React from "react";
+import styled from "styled-components";
+
+const Container = styled.div`
+  max-width: 320px;
+`;
+
+const Label = styled.label`
+  display: block;
+  margin-bottom: var(--spacing-y-xs);
+  font-size: var(--font-size-sm);
+`;
+
+const Input = styled.input`
+  width: 100%;
+  margin-bottom: var(--spacing-y-sm);
+  padding: var(--spacing-y-xs) var(--spacing-x-sm);
+  border: 1px solid var(--theme-color-dark);
+`;
+
+export default function InputText({ id, label, required, textArea }) {
+  return (
+    <Container>
+      <Label htmlFor={id}>{label}</Label>
+      <Input type="text" id={id} as={textArea ? "textarea" : "input"} />
+    </Container>
+  );
+}