From 0206d848943aa70acaf0f1f2e658650c7e6015a7 Mon Sep 17 00:00:00 2001
From: James Tombleson <luther38@gmail.com>
Date: Tue, 9 Jul 2024 08:32:24 -0700
Subject: [PATCH] Created some components for bulma to make it easier to build
 new pages

---
 internal/views/bulma/button.templ       | 34 +++++++++++++++++++++++++
 internal/views/bulma/form/control.templ |  8 ++++++
 internal/views/bulma/form/field.templ   |  8 ++++++
 internal/views/bulma/form/input.templ   |  9 +++++++
 internal/views/bulma/form/label.templ   |  6 +++++
 internal/views/bulma/form/new.templ     |  7 +++++
 internal/views/bulma/form/submit.templ  |  5 ++++
 internal/views/bulma/form/util.go       |  6 +++++
 internal/views/bulma/util.go            | 10 ++++++++
 9 files changed, 93 insertions(+)
 create mode 100644 internal/views/bulma/button.templ
 create mode 100644 internal/views/bulma/form/control.templ
 create mode 100644 internal/views/bulma/form/field.templ
 create mode 100644 internal/views/bulma/form/input.templ
 create mode 100644 internal/views/bulma/form/label.templ
 create mode 100644 internal/views/bulma/form/new.templ
 create mode 100644 internal/views/bulma/form/submit.templ
 create mode 100644 internal/views/bulma/form/util.go
 create mode 100644 internal/views/bulma/util.go

diff --git a/internal/views/bulma/button.templ b/internal/views/bulma/button.templ
new file mode 100644
index 0000000..865a605
--- /dev/null
+++ b/internal/views/bulma/button.templ
@@ -0,0 +1,34 @@
+package bulma
+
+templ Button(color string, isLight, isDark bool) {
+	if isLight {
+		<button type="button" class={ "button", "is-light", color }>
+			{ children... }
+		</button>
+	}
+	if isDark {
+		<button type="button" class={ "button", "is-dark", color }>
+			{ children... }
+		</button>
+	}
+	if !isLight && !isDark {
+		<button type="button" class={ "button", color }>
+		{ children... }
+	</button>
+	}
+}
+
+templ ButtonNewTab(url, text string) {
+	<button type="button" class="button">
+		<a href={ templ.SafeURL(url) } target="_blank" rel="noopener noreferrer">{ text }</a>
+	</button>
+}
+
+
+templ ALink(url, title string) {
+	<a href={ templ.SafeURL(url) }>{ title }</a>
+}
+
+templ ANewTab(url, text string) {
+	<a href={ templ.SafeURL(url) } target="_blank" rel="noopener noreferrer">{ text }</a>
+}
diff --git a/internal/views/bulma/form/control.templ b/internal/views/bulma/form/control.templ
new file mode 100644
index 0000000..d5183b2
--- /dev/null
+++ b/internal/views/bulma/form/control.templ
@@ -0,0 +1,8 @@
+package form
+
+// Div container to add a input field to.
+templ Control() {
+    <div class="control">
+        { children... }
+    </div>
+}
\ No newline at end of file
diff --git a/internal/views/bulma/form/field.templ b/internal/views/bulma/form/field.templ
new file mode 100644
index 0000000..ad7b0c3
--- /dev/null
+++ b/internal/views/bulma/form/field.templ
@@ -0,0 +1,8 @@
+package form
+
+// This creates a field that you can add a Label, Control or Input object.
+templ Field() {
+	<div class="field">
+		{ children... }
+	</div>
+}
\ No newline at end of file
diff --git a/internal/views/bulma/form/input.templ b/internal/views/bulma/form/input.templ
new file mode 100644
index 0000000..5255d18
--- /dev/null
+++ b/internal/views/bulma/form/input.templ
@@ -0,0 +1,9 @@
+package form
+
+templ Input(color, id, fieldType string) {
+	if color == "" {
+		<input class={ "input" } id={ id } type={ fieldType }/>
+	} else {
+		<input class={ "input", color } id={ id } type={ fieldType }/>
+	}
+}
diff --git a/internal/views/bulma/form/label.templ b/internal/views/bulma/form/label.templ
new file mode 100644
index 0000000..66deea3
--- /dev/null
+++ b/internal/views/bulma/form/label.templ
@@ -0,0 +1,6 @@
+package form
+
+// This will create a small bit of text to add context to the form.
+templ Label(text string) {
+	<label class="label">{ text }</label>
+}
\ No newline at end of file
diff --git a/internal/views/bulma/form/new.templ b/internal/views/bulma/form/new.templ
new file mode 100644
index 0000000..a0a4190
--- /dev/null
+++ b/internal/views/bulma/form/new.templ
@@ -0,0 +1,7 @@
+package form
+
+templ New(postUrl string) {
+    <form hx-post={ postUrl }>
+        { children... }
+    </form>
+}
\ No newline at end of file
diff --git a/internal/views/bulma/form/submit.templ b/internal/views/bulma/form/submit.templ
new file mode 100644
index 0000000..e12ada7
--- /dev/null
+++ b/internal/views/bulma/form/submit.templ
@@ -0,0 +1,5 @@
+package form
+
+templ Submit(text, color string) {
+    <button type="submit" class={ "button", color }>{ text }</button>
+}
\ No newline at end of file
diff --git a/internal/views/bulma/form/util.go b/internal/views/bulma/form/util.go
new file mode 100644
index 0000000..34750a1
--- /dev/null
+++ b/internal/views/bulma/form/util.go
@@ -0,0 +1,6 @@
+package form
+
+const (
+	InputTypeText     = "text"
+	InputTypePassword = "password"
+)
diff --git a/internal/views/bulma/util.go b/internal/views/bulma/util.go
new file mode 100644
index 0000000..f53dfd9
--- /dev/null
+++ b/internal/views/bulma/util.go
@@ -0,0 +1,10 @@
+package bulma
+
+const (
+	ColorPrimary = "is-primary"
+	ColorInfo    = "is-info"
+	ColorLink    = "is-link"
+	ColorWarning = "is-warning"
+	ColorSuccess = "is-success"
+	ColorError   = "is-error"
+)