Group element helpers in different files (#21) According to the section at https://developer.mozilla.org/en-US/docs/Web/HTML/Element
Markus Wüstenberg markus@maragu.dk
Fri, 25 Sep 2020 09:57:47 +0200
16 files changed, 368 insertions(+), 302 deletions(-)
A el/content.go
@@ -0,0 +1,25 @@+package el + +import ( + g "github.com/maragudk/gomponents" +) + +func Div(children ...g.Node) g.NodeFunc { + return g.El("div", children...) +} + +func Ol(children ...g.Node) g.NodeFunc { + return g.El("ol", children...) +} + +func Ul(children ...g.Node) g.NodeFunc { + return g.El("ul", children...) +} + +func Li(children ...g.Node) g.NodeFunc { + return g.El("li", children...) +} + +func P(children ...g.Node) g.NodeFunc { + return g.El("p", children...) +}
A el/content_test.go
@@ -0,0 +1,39 @@+package el_test + +import ( + "testing" + + g "github.com/maragudk/gomponents" + "github.com/maragudk/gomponents/assert" + "github.com/maragudk/gomponents/el" +) + +func TestDiv(t *testing.T) { + t.Run("returns a div element", func(t *testing.T) { + assert.Equal(t, `<div><span /></div>`, el.Div(el.Span())) + }) +} + +func TestOl(t *testing.T) { + t.Run("returns an ol element", func(t *testing.T) { + assert.Equal(t, `<ol><li /></ol>`, el.Ol(el.Li())) + }) +} + +func TestUl(t *testing.T) { + t.Run("returns a ul element", func(t *testing.T) { + assert.Equal(t, `<ul><li /></ul>`, el.Ul(el.Li())) + }) +} + +func TestLi(t *testing.T) { + t.Run("returns an li element", func(t *testing.T) { + assert.Equal(t, `<li>hat</li>`, el.Li(g.Text("hat"))) + }) +} + +func TestP(t *testing.T) { + t.Run("returns a p element", func(t *testing.T) { + assert.Equal(t, `<p>hat</p>`, el.P(g.Text("hat"))) + }) +}
A el/document.go
@@ -0,0 +1,69 @@+// Package el provides shortcuts and helpers to common HTML elements. +// See https://developer.mozilla.org/en-US/docs/Web/HTML/Element for a list of elements. +package el + +import ( + "strings" + + g "github.com/maragudk/gomponents" +) + +// Document returns an special kind of Node that prefixes its children with the string "<!doctype html>". +func Document(children ...g.Node) g.NodeFunc { + return func() string { + var b strings.Builder + b.WriteString("<!doctype html>") + for _, c := range children { + b.WriteString(c.Render()) + } + return b.String() + } +} + +// HTML returns an element with name "html" and the given children. +func HTML(children ...g.Node) g.NodeFunc { + return g.El("html", children...) +} + +// Head returns an element with name "head" and the given children. +func Head(children ...g.Node) g.NodeFunc { + return g.El("head", children...) +} + +// Body returns an element with name "body" and the given children. +func Body(children ...g.Node) g.NodeFunc { + return g.El("body", children...) +} + +// Title returns an element with name "title" and a single Text child. +func Title(title string) g.NodeFunc { + return g.El("title", g.Text(title)) +} + +func Meta(children ...g.Node) g.NodeFunc { + return g.El("meta", children...) +} + +func Link(children ...g.Node) g.NodeFunc { + return g.El("link", children...) +} + +func Style(children ...g.Node) g.NodeFunc { + return g.El("style", children...) +} + +func Base(children ...g.Node) g.NodeFunc { + return g.El("base", children...) +} + +func prepend(node g.Node, nodes []g.Node) []g.Node { + newNodes := []g.Node{node} + newNodes = append(newNodes, nodes...) + return newNodes +} + +func prepend2(node1, node2 g.Node, nodes []g.Node) []g.Node { + newNodes := []g.Node{node1, node2} + newNodes = append(newNodes, nodes...) + return newNodes +}
A el/document_test.go
@@ -0,0 +1,63 @@+package el_test + +import ( + "testing" + + g "github.com/maragudk/gomponents" + "github.com/maragudk/gomponents/assert" + "github.com/maragudk/gomponents/el" +) + +func TestDocument(t *testing.T) { + t.Run("returns doctype and children", func(t *testing.T) { + assert.Equal(t, `<!doctype html><html />`, el.Document(g.El("html"))) + }) +} + +func TestHTML(t *testing.T) { + t.Run("returns an html element", func(t *testing.T) { + assert.Equal(t, "<html><div /><span /></html>", el.HTML(g.El("div"), g.El("span"))) + }) +} + +func TestHead(t *testing.T) { + t.Run("returns a head element", func(t *testing.T) { + assert.Equal(t, "<head><title /><link /></head>", el.Head(g.El("title"), g.El("link"))) + }) +} + +func TestBody(t *testing.T) { + t.Run("returns a body element", func(t *testing.T) { + assert.Equal(t, "<body><div /><span /></body>", el.Body(g.El("div"), g.El("span"))) + }) +} + +func TestTitle(t *testing.T) { + t.Run("returns a title element with text content", func(t *testing.T) { + assert.Equal(t, "<title>hat</title>", el.Title("hat")) + }) +} + +func TestMeta(t *testing.T) { + t.Run("returns a meta element", func(t *testing.T) { + assert.Equal(t, `<meta charset="utf-8" />`, el.Meta(g.Attr("charset", "utf-8"))) + }) +} + +func TestLink(t *testing.T) { + t.Run("returns a link element", func(t *testing.T) { + assert.Equal(t, `<link rel="stylesheet" />`, el.Link(g.Attr("rel", "stylesheet"))) + }) +} + +func TestStyle(t *testing.T) { + t.Run("returns a style element", func(t *testing.T) { + assert.Equal(t, `<style type="text/css" />`, el.Style(g.Attr("type", "text/css"))) + }) +} + +func TestBase(t *testing.T) { + t.Run("returns a base element", func(t *testing.T) { + assert.Equal(t, `<base href="/hat/" />`, el.Base(g.Attr("href", "/hat/"))) + }) +}
D el/elements.go
@@ -1,137 +0,0 @@-// Package el provides shortcuts and helpers to common HTML elements. -// See https://developer.mozilla.org/en-US/docs/Web/HTML/Element for a list of elements. -package el - -import ( - "strings" - - g "github.com/maragudk/gomponents" -) - -// Document returns an special kind of Node that prefixes its children with the string "<!doctype html>". -func Document(children ...g.Node) g.NodeFunc { - return func() string { - var b strings.Builder - b.WriteString("<!doctype html>") - for _, c := range children { - b.WriteString(c.Render()) - } - return b.String() - } -} - -// HTML returns an element with name "html" and the given children. -func HTML(children ...g.Node) g.NodeFunc { - return g.El("html", children...) -} - -// Head returns an element with name "head" and the given children. -func Head(children ...g.Node) g.NodeFunc { - return g.El("head", children...) -} - -// Body returns an element with name "body" and the given children. -func Body(children ...g.Node) g.NodeFunc { - return g.El("body", children...) -} - -// Title returns an element with name "title" and a single Text child. -func Title(title string) g.NodeFunc { - return g.El("title", g.Text(title)) -} - -func Meta(children ...g.Node) g.NodeFunc { - return g.El("meta", children...) -} - -func Link(children ...g.Node) g.NodeFunc { - return g.El("link", children...) -} - -func Style(children ...g.Node) g.NodeFunc { - return g.El("style", children...) -} - -func Div(children ...g.Node) g.NodeFunc { - return g.El("div", children...) -} - -func Span(children ...g.Node) g.NodeFunc { - return g.El("span", children...) -} - -func A(href string, children ...g.Node) g.NodeFunc { - return g.El("a", prepend(g.Attr("href", href), children)...) -} - -func P(children ...g.Node) g.NodeFunc { - return g.El("p", children...) -} - -func H1(text string, children ...g.Node) g.NodeFunc { - return g.El("h1", prepend(g.Text(text), children)...) -} - -func H2(text string, children ...g.Node) g.NodeFunc { - return g.El("h2", prepend(g.Text(text), children)...) -} - -func H3(text string, children ...g.Node) g.NodeFunc { - return g.El("h3", prepend(g.Text(text), children)...) -} - -func H4(text string, children ...g.Node) g.NodeFunc { - return g.El("h4", prepend(g.Text(text), children)...) -} - -func H5(text string, children ...g.Node) g.NodeFunc { - return g.El("h5", prepend(g.Text(text), children)...) -} - -func H6(text string, children ...g.Node) g.NodeFunc { - return g.El("h6", prepend(g.Text(text), children)...) -} - -func Ol(children ...g.Node) g.NodeFunc { - return g.El("ol", children...) -} - -func Ul(children ...g.Node) g.NodeFunc { - return g.El("ul", children...) -} - -func Li(children ...g.Node) g.NodeFunc { - return g.El("li", children...) -} - -func B(text string, children ...g.Node) g.NodeFunc { - return g.El("b", prepend(g.Text(text), children)...) -} - -func Strong(text string, children ...g.Node) g.NodeFunc { - return g.El("strong", prepend(g.Text(text), children)...) -} - -func I(text string, children ...g.Node) g.NodeFunc { - return g.El("i", prepend(g.Text(text), children)...) -} - -func Em(text string, children ...g.Node) g.NodeFunc { - return g.El("em", prepend(g.Text(text), children)...) -} - -func Img(src, alt string, children ...g.Node) g.NodeFunc { - return g.El("img", prepend2(g.Attr("src", src), g.Attr("alt", alt), children)...) -} - -func prepend(node g.Node, nodes []g.Node) []g.Node { - newNodes := []g.Node{node} - newNodes = append(newNodes, nodes...) - return newNodes -} - -func prepend2(node1, node2 g.Node, nodes []g.Node) []g.Node { - newNodes := []g.Node{node1, node2} - newNodes = append(newNodes, nodes...) - return newNodes -}
D el/elements_test.go
@@ -1,165 +0,0 @@-package el_test - -import ( - "testing" - - g "github.com/maragudk/gomponents" - "github.com/maragudk/gomponents/assert" - "github.com/maragudk/gomponents/el" -) - -func TestDocument(t *testing.T) { - t.Run("returns doctype and children", func(t *testing.T) { - assert.Equal(t, `<!doctype html><html />`, el.Document(g.El("html"))) - }) -} - -func TestHTML(t *testing.T) { - t.Run("returns an html element", func(t *testing.T) { - assert.Equal(t, "<html><div /><span /></html>", el.HTML(g.El("div"), g.El("span"))) - }) -} - -func TestHead(t *testing.T) { - t.Run("returns a head element", func(t *testing.T) { - assert.Equal(t, "<head><title /><link /></head>", el.Head(g.El("title"), g.El("link"))) - }) -} - -func TestBody(t *testing.T) { - t.Run("returns a body element", func(t *testing.T) { - assert.Equal(t, "<body><div /><span /></body>", el.Body(g.El("div"), g.El("span"))) - }) -} - -func TestTitle(t *testing.T) { - t.Run("returns a title element with text content", func(t *testing.T) { - assert.Equal(t, "<title>hat</title>", el.Title("hat")) - }) -} - -func TestMeta(t *testing.T) { - t.Run("returns a meta element", func(t *testing.T) { - assert.Equal(t, `<meta charset="utf-8" />`, el.Meta(g.Attr("charset", "utf-8"))) - }) -} - -func TestLink(t *testing.T) { - t.Run("returns a link element", func(t *testing.T) { - assert.Equal(t, `<link rel="stylesheet" />`, el.Link(g.Attr("rel", "stylesheet"))) - }) -} - -func TestStyle(t *testing.T) { - t.Run("returns a style element", func(t *testing.T) { - assert.Equal(t, `<style type="text/css" />`, el.Style(g.Attr("type", "text/css"))) - }) -} - -func TestDiv(t *testing.T) { - t.Run("returns a div element", func(t *testing.T) { - assert.Equal(t, `<div><span /></div>`, el.Div(el.Span())) - }) -} - -func TestSpan(t *testing.T) { - t.Run("returns a span element", func(t *testing.T) { - assert.Equal(t, `<span>hat</span>`, el.Span(g.Text("hat"))) - }) -} - -func TestA(t *testing.T) { - t.Run("returns an a element with a href attribute", func(t *testing.T) { - assert.Equal(t, `<a href="#">hat</a>`, el.A("#", g.Text("hat"))) - }) -} - -func TestP(t *testing.T) { - t.Run("returns a p element", func(t *testing.T) { - assert.Equal(t, `<p>hat</p>`, el.P(g.Text("hat"))) - }) -} - -func TestH1(t *testing.T) { - t.Run("returns an h1 element", func(t *testing.T) { - assert.Equal(t, `<h1 id="headline">hat</h1>`, el.H1("hat", g.Attr("id", "headline"))) - }) -} - -func TestH2(t *testing.T) { - t.Run("returns an h2 element", func(t *testing.T) { - assert.Equal(t, `<h2 id="headline">hat</h2>`, el.H2("hat", g.Attr("id", "headline"))) - }) -} - -func TestH3(t *testing.T) { - t.Run("returns an h3 element", func(t *testing.T) { - assert.Equal(t, `<h3 id="headline">hat</h3>`, el.H3("hat", g.Attr("id", "headline"))) - }) -} - -func TestH4(t *testing.T) { - t.Run("returns an h4 element", func(t *testing.T) { - assert.Equal(t, `<h4 id="headline">hat</h4>`, el.H4("hat", g.Attr("id", "headline"))) - }) -} - -func TestH5(t *testing.T) { - t.Run("returns an h5 element", func(t *testing.T) { - assert.Equal(t, `<h5 id="headline">hat</h5>`, el.H5("hat", g.Attr("id", "headline"))) - }) -} - -func TestH6(t *testing.T) { - t.Run("returns an h6 element", func(t *testing.T) { - assert.Equal(t, `<h6 id="headline">hat</h6>`, el.H6("hat", g.Attr("id", "headline"))) - }) -} - -func TestOl(t *testing.T) { - t.Run("returns an ol element", func(t *testing.T) { - assert.Equal(t, `<ol><li /></ol>`, el.Ol(el.Li())) - }) -} - -func TestUl(t *testing.T) { - t.Run("returns a ul element", func(t *testing.T) { - assert.Equal(t, `<ul><li /></ul>`, el.Ul(el.Li())) - }) -} - -func TestLi(t *testing.T) { - t.Run("returns an li element", func(t *testing.T) { - assert.Equal(t, `<li>hat</li>`, el.Li(g.Text("hat"))) - }) -} - -func TestB(t *testing.T) { - t.Run("returns a b element", func(t *testing.T) { - assert.Equal(t, `<b id="text">hat</b>`, el.B("hat", g.Attr("id", "text"))) - }) -} - -func TestStrong(t *testing.T) { - t.Run("returns a strong element", func(t *testing.T) { - assert.Equal(t, `<strong id="text">hat</strong>`, el.Strong("hat", g.Attr("id", "text"))) - }) -} - -func TestI(t *testing.T) { - t.Run("returns an i element", func(t *testing.T) { - assert.Equal(t, `<i id="text">hat</i>`, el.I("hat", g.Attr("id", "text"))) - }) -} - -func TestEm(t *testing.T) { - t.Run("returns an em element", func(t *testing.T) { - assert.Equal(t, `<em id="text">hat</em>`, el.Em("hat", g.Attr("id", "text"))) - }) -} - -func TestImg(t *testing.T) { - t.Run("returns an img element with href and alt attributes", func(t *testing.T) { - assert.Equal(t, `<img src="hat.png" alt="hat" id="image" />`, el.Img("hat.png", "hat", g.Attr("id", "image"))) - }) -}
A el/inline.go
@@ -0,0 +1,29 @@+package el + +import ( + g "github.com/maragudk/gomponents" +) + +func Span(children ...g.Node) g.NodeFunc { + return g.El("span", children...) +} + +func A(href string, children ...g.Node) g.NodeFunc { + return g.El("a", prepend(g.Attr("href", href), children)...) +} + +func B(text string, children ...g.Node) g.NodeFunc { + return g.El("b", prepend(g.Text(text), children)...) +} + +func Strong(text string, children ...g.Node) g.NodeFunc { + return g.El("strong", prepend(g.Text(text), children)...) +} + +func I(text string, children ...g.Node) g.NodeFunc { + return g.El("i", prepend(g.Text(text), children)...) +} + +func Em(text string, children ...g.Node) g.NodeFunc { + return g.El("em", prepend(g.Text(text), children)...) +}
A el/inline_test.go
@@ -0,0 +1,45 @@+package el_test + +import ( + "testing" + + g "github.com/maragudk/gomponents" + "github.com/maragudk/gomponents/assert" + "github.com/maragudk/gomponents/el" +) + +func TestSpan(t *testing.T) { + t.Run("returns a span element", func(t *testing.T) { + assert.Equal(t, `<span>hat</span>`, el.Span(g.Text("hat"))) + }) +} + +func TestA(t *testing.T) { + t.Run("returns an a element with a href attribute", func(t *testing.T) { + assert.Equal(t, `<a href="#">hat</a>`, el.A("#", g.Text("hat"))) + }) +} + +func TestB(t *testing.T) { + t.Run("returns a b element", func(t *testing.T) { + assert.Equal(t, `<b id="text">hat</b>`, el.B("hat", g.Attr("id", "text"))) + }) +} + +func TestStrong(t *testing.T) { + t.Run("returns a strong element", func(t *testing.T) { + assert.Equal(t, `<strong id="text">hat</strong>`, el.Strong("hat", g.Attr("id", "text"))) + }) +} + +func TestI(t *testing.T) { + t.Run("returns an i element", func(t *testing.T) { + assert.Equal(t, `<i id="text">hat</i>`, el.I("hat", g.Attr("id", "text"))) + }) +} + +func TestEm(t *testing.T) { + t.Run("returns an em element", func(t *testing.T) { + assert.Equal(t, `<em id="text">hat</em>`, el.Em("hat", g.Attr("id", "text"))) + }) +}
A el/media.go
@@ -0,0 +1,9 @@+package el + +import ( + g "github.com/maragudk/gomponents" +) + +func Img(src, alt string, children ...g.Node) g.NodeFunc { + return g.El("img", prepend2(g.Attr("src", src), g.Attr("alt", alt), children)...) +}
A el/media_test.go
@@ -0,0 +1,15 @@+package el_test + +import ( + "testing" + + g "github.com/maragudk/gomponents" + "github.com/maragudk/gomponents/assert" + "github.com/maragudk/gomponents/el" +) + +func TestImg(t *testing.T) { + t.Run("returns an img element with href and alt attributes", func(t *testing.T) { + assert.Equal(t, `<img src="hat.png" alt="hat" id="image" />`, el.Img("hat.png", "hat", g.Attr("id", "image"))) + }) +}
A el/section.go
@@ -0,0 +1,29 @@+package el + +import ( + g "github.com/maragudk/gomponents" +) + +func H1(text string, children ...g.Node) g.NodeFunc { + return g.El("h1", prepend(g.Text(text), children)...) +} + +func H2(text string, children ...g.Node) g.NodeFunc { + return g.El("h2", prepend(g.Text(text), children)...) +} + +func H3(text string, children ...g.Node) g.NodeFunc { + return g.El("h3", prepend(g.Text(text), children)...) +} + +func H4(text string, children ...g.Node) g.NodeFunc { + return g.El("h4", prepend(g.Text(text), children)...) +} + +func H5(text string, children ...g.Node) g.NodeFunc { + return g.El("h5", prepend(g.Text(text), children)...) +} + +func H6(text string, children ...g.Node) g.NodeFunc { + return g.El("h6", prepend(g.Text(text), children)...) +}
A el/section_test.go
@@ -0,0 +1,45 @@+package el_test + +import ( + "testing" + + g "github.com/maragudk/gomponents" + "github.com/maragudk/gomponents/assert" + "github.com/maragudk/gomponents/el" +) + +func TestH1(t *testing.T) { + t.Run("returns an h1 element", func(t *testing.T) { + assert.Equal(t, `<h1 id="headline">hat</h1>`, el.H1("hat", g.Attr("id", "headline"))) + }) +} + +func TestH2(t *testing.T) { + t.Run("returns an h2 element", func(t *testing.T) { + assert.Equal(t, `<h2 id="headline">hat</h2>`, el.H2("hat", g.Attr("id", "headline"))) + }) +} + +func TestH3(t *testing.T) { + t.Run("returns an h3 element", func(t *testing.T) { + assert.Equal(t, `<h3 id="headline">hat</h3>`, el.H3("hat", g.Attr("id", "headline"))) + }) +} + +func TestH4(t *testing.T) { + t.Run("returns an h4 element", func(t *testing.T) { + assert.Equal(t, `<h4 id="headline">hat</h4>`, el.H4("hat", g.Attr("id", "headline"))) + }) +} + +func TestH5(t *testing.T) { + t.Run("returns an h5 element", func(t *testing.T) { + assert.Equal(t, `<h5 id="headline">hat</h5>`, el.H5("hat", g.Attr("id", "headline"))) + }) +} + +func TestH6(t *testing.T) { + t.Run("returns an h6 element", func(t *testing.T) { + assert.Equal(t, `<h6 id="headline">hat</h6>`, el.H6("hat", g.Attr("id", "headline"))) + }) +}