Add hx-on (#10)

Fixes #9

htmx.go

@@ -3,6 +3,8 @@
 package htmx
 
 import (
+	"io"
+
 	g "github.com/maragudk/gomponents"
 )
 
@@ -18,6 +20,12 @@ func Get(url string) g.Node {
 	return attr("get", url)
 }
 
+// On handles any event with a script inline.
+// See https://htmx.org/attributes/hx-on
+func On(name string, v string) g.Node {
+	return &rawAttr{name: "on:" + name, value: v}
+}
+
 // Post to the specified URL.
 // See https://htmx.org/attributes/hx-post
 func Post(url string) g.Node {
@@ -195,3 +203,18 @@ func Validate(v string) g.Node {
 func attr(name, value string) g.Node {
 	return g.Attr("hx-"+name, value)
 }
+
+// rawAttr is an attribute that doesn't escape its value.
+type rawAttr struct {
+	name  string
+	value string
+}
+
+func (r *rawAttr) Render(w io.Writer) error {
+	_, err := w.Write([]byte(" hx-" + r.name + `="` + r.value + `"`))
+	return err
+}
+
+func (r *rawAttr) Type() g.NodeType {
+	return g.AttributeType
+}

htmx_test.go

@@ -60,3 +60,15 @@ func ExampleGet() {
 	_ = n.Render(os.Stdout)
 	// Output: <button hx-post="/clicked" hx-swap="outerHTML"></button>
 }
+
+func TestOn(t *testing.T) {
+	t.Run(`should output hx-on:click="alert('hat')"`, func(t *testing.T) {
+		n := g.El("div", hx.On("click", "alert('hat')"))
+		assert.Equal(t, `<div hx-on:click="alert('hat')"></div>`, n)
+	})
+
+	t.Run(`should output hx-on::before-request="alert('hat')"`, func(t *testing.T) {
+		n := g.El("div", hx.On(":before-request", "alert('hat')"))
+		assert.Equal(t, `<div hx-on::before-request="alert('hat')"></div>`, n)
+	})
+}