feat: improve real-time chart example; add small refinements to via core files

h/attributes.go

@@ -34,6 +34,10 @@ func Class(v string) H {
 	return gh.Class(v)
 }
 
+func Role(v string) H {
+	return gh.Role(v)
+}
+
 // Data attributes automatically have their name prefixed with "data-".
 func Data(name, v string) H {
 	return gh.Data(name, v)

h/h.go

@@ -11,6 +11,7 @@ package h
 
 import (
 	"io"
+
 	g "maragu.dev/gomponents"
 	gc "maragu.dev/gomponents/components"
 )
@@ -50,6 +51,13 @@ func Attr(name string, value ...string) H {
 	return g.Attr(name, value...)
 }
 
+func If(condition bool, n H) H {
+	if condition {
+		return n
+	}
+	return nil
+}
+
 // HTML5Props defines properties for HTML5 pages. Title is set always set, Description
 // and Language elements only if the strings are non-empty.
 type HTML5Props struct {

h/util.go

@@ -7,6 +7,10 @@ import (
 func retype(nodes []H) []g.Node {
 	list := make([]g.Node, len(nodes))
 	for i, node := range nodes {
+		if node == nil {
+			list[i] = nil
+			continue
+		}
 		list[i] = node.(g.Node)
 	}
 	return list