From f24de70526d6cb20edfc21bf1ded9c7b405a4f3b Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Wed, 28 Sep 2022 23:05:08 +0800
Subject: feat: Add input component

---
 apps/kit/src/routes/book/inputs/+page.svelte | 48 ++++++++++++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 apps/kit/src/routes/book/inputs/+page.svelte

(limited to 'apps/kit/src/routes/book')

diff --git a/apps/kit/src/routes/book/inputs/+page.svelte b/apps/kit/src/routes/book/inputs/+page.svelte
new file mode 100644
index 0000000..a693f69
--- /dev/null
+++ b/apps/kit/src/routes/book/inputs/+page.svelte
@@ -0,0 +1,48 @@
+<script lang="ts">
+    import Input from "$lib/components/input.svelte";
+    import { DatabaseIcon } from "$lib/components/icons";
+</script>
+
+<section>
+    <h2>Default</h2>
+    <Input label="Input me" placeholder="Hello" />
+</section>
+
+<section>
+    <h2>With icon</h2>
+    <Input label="Input me" placeholder="Hello" icon={DatabaseIcon} />
+</section>
+
+<section>
+    <h2>With corner hint</h2>
+    <Input label="Input me ->" placeholder="Hello" cornerHint="Hint hint" />
+</section>
+
+<section>
+    <h2>Disabled</h2>
+    <Input label="No" placeholder="Sorry" disabled />
+</section>
+
+<section>
+    <h2>Errored</h2>
+    <Input
+        label="No"
+        placeholder="Sorry"
+        errorText="That's not right"
+        icon={DatabaseIcon}
+    />
+</section>
+
+<section>
+    <h2>Help</h2>
+    <Input label="Go ahead" placeholder="Write here" helpText="Write above" />
+</section>
+<section>
+    <h2>Addon</h2>
+    <Input
+        label="Go ahead"
+        placeholder="Write here"
+        helpText="Write above"
+        addon="To the right"
+    />
+</section>
-- 
cgit v1.3