From 2f8a3b5016c2d483201708697c4dd0ee4a870e60 Mon Sep 17 00:00:00 2001
From: David Vogel <Dadido3@aol.com>
Date: Fri, 23 Jun 2023 20:41:04 +0200
Subject: [PATCH] Add CheckBox and RadioButton input components

- Add support for *bool to FieldBindAny
- Update example page PageInput
---
 components/input/check-box.go         |  27 +++
 components/input/check-box.vugu       |  14 ++
 components/input/check-box_vgen.go    |  50 +++++
 components/input/field-binder.go      |  20 +-
 components/input/radio-button.go      |  32 +++
 components/input/radio-button.vugu    |  14 ++
 components/input/radio-button_vgen.go |  50 +++++
 page-input.go                         |   8 +
 page-input.vugu                       |  30 +++
 page-input_vgen.go                    | 312 +++++++++++++++++++++++---
 10 files changed, 526 insertions(+), 31 deletions(-)
 create mode 100644 components/input/check-box.go
 create mode 100644 components/input/check-box.vugu
 create mode 100644 components/input/check-box_vgen.go
 create mode 100644 components/input/radio-button.go
 create mode 100644 components/input/radio-button.vugu
 create mode 100644 components/input/radio-button_vgen.go

diff --git a/components/input/check-box.go b/components/input/check-box.go
new file mode 100644
index 0000000..fc3f3cc
--- /dev/null
+++ b/components/input/check-box.go
@@ -0,0 +1,27 @@
+package input
+
+import (
+	"github.com/vugu/vugu"
+)
+
+// CheckBox is a boolean type input component.
+// Similar to a button that can be toggled.
+type CheckBox struct {
+	AttrMap vugu.AttrMap
+
+	Bind *bool
+}
+
+func (c *CheckBox) isChecked() bool {
+	if c.Bind != nil {
+		return *c.Bind
+	}
+
+	return false
+}
+
+func (c *CheckBox) handleChange(event vugu.DOMEvent) {
+	if c.Bind != nil {
+		*c.Bind = event.PropBool("target", "checked")
+	}
+}
diff --git a/components/input/check-box.vugu b/components/input/check-box.vugu
new file mode 100644
index 0000000..4fcf040
--- /dev/null
+++ b/components/input/check-box.vugu
@@ -0,0 +1,14 @@
+<input type="checkbox" .checked="c.isChecked()" vg-attr='utils.AttributesAppend{AttrMap: c.AttrMap, Classes: "d3c-1687533177"}' @click="c.handleChange(event)">
+
+<style>
+	.d3c-1687533177 {
+		accent-color: var(--d3c-color-accent);
+	}
+</style>
+
+<script type="application/x-go">
+	import (
+		//"git.d3nexus.de/Dadido3/D3vugu-components/icons"
+		"git.d3nexus.de/Dadido3/D3vugu-components/utils"
+	)
+</script>
diff --git a/components/input/check-box_vgen.go b/components/input/check-box_vgen.go
new file mode 100644
index 0000000..e2ef6cf
--- /dev/null
+++ b/components/input/check-box_vgen.go
@@ -0,0 +1,50 @@
+package input
+
+// Code generated by vugu via vugugen. Please regenerate instead of editing or add additional code in a separate file. DO NOT EDIT.
+
+import "fmt"
+import "reflect"
+import "github.com/vugu/vjson"
+import "github.com/vugu/vugu"
+import js "github.com/vugu/vugu/js"
+
+import (
+	//"git.d3nexus.de/Dadido3/D3vugu-components/icons"
+	"git.d3nexus.de/Dadido3/D3vugu-components/utils"
+)
+
+func (c *CheckBox) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
+
+	vgout = &vugu.BuildOut{}
+
+	var vgiterkey interface{}
+	_ = vgiterkey
+	var vgn *vugu.VGNode
+	vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "input", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "type", Val: "checkbox"}}}
+	vgout.Out = append(vgout.Out, vgn)	// root for output
+	vgn.AddAttrList(utils.AttributesAppend{AttrMap: c.AttrMap, Classes: "d3c-1687533177"})
+	{
+		b, err := vjson.Marshal(c.isChecked())
+		if err != nil {
+			panic(err)
+		}
+		vgn.Prop = append(vgn.Prop, vugu.VGProperty{Key: "checked", JSONVal: vjson.RawMessage(b)})
+	}
+	vgn.DOMEventHandlerSpecList = append(vgn.DOMEventHandlerSpecList, vugu.DOMEventHandlerSpec{
+		EventType:	"click",
+		Func:		func(event vugu.DOMEvent) { c.handleChange(event) },
+		// TODO: implement capture, etc. mostly need to decide syntax
+	})
+	vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Data: "style", Attr: []vugu.VGAttribute(nil)}
+	{
+		vgn.AppendChild(&vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t.d3c-1687533177 {\n\t\taccent-color: var(--d3c-color-accent);\n\t}\n", Attr: []vugu.VGAttribute(nil)})
+	}
+	vgout.AppendCSS(vgn)
+	return vgout
+}
+
+// 'fix' unused imports
+var _ fmt.Stringer
+var _ reflect.Type
+var _ vjson.RawMessage
+var _ js.Value
diff --git a/components/input/field-binder.go b/components/input/field-binder.go
index cb0b842..f8d7284 100644
--- a/components/input/field-binder.go
+++ b/components/input/field-binder.go
@@ -1,6 +1,7 @@
 package input
 
 import (
+	"encoding"
 	"fmt"
 	"strconv"
 )
@@ -12,11 +13,13 @@ type FieldBinder interface {
 	HTMLInputType() string  // HTMLInputType returns the to be used type parameter for the HTML input element.
 }
 
-// FieldBindAny implements the FieldBinder interface for all basic types.
+// FieldBindAny implements the FieldBinder interface for all basic types and the encoding.TextMarshaler, encoding.TextUnmarshaler interfaces.
 type FieldBindAny struct{ Value any }
 
 func (f FieldBindAny) String() string {
 	switch v := f.Value.(type) {
+	case *bool:
+		return strconv.FormatBool(*v)
 	case *string:
 		return *v
 	case *int:
@@ -43,6 +46,9 @@ func (f FieldBindAny) String() string {
 		return strconv.FormatFloat(float64(*v), 'f', -1, 32) // TODO: Format number in current user's locale
 	case *float64:
 		return strconv.FormatFloat(float64(*v), 'f', -1, 64)
+	case encoding.TextMarshaler:
+		data, _ := v.MarshalText() // Ignore any errors, as we can't handle them here.
+		return string(data)
 	}
 
 	return ""
@@ -50,6 +56,12 @@ func (f FieldBindAny) String() string {
 
 func (f FieldBindAny) SetString(value string) error {
 	switch v := f.Value.(type) {
+	case *bool:
+		val, err := strconv.ParseBool(value)
+		if err != nil {
+			return err
+		}
+		*v = val
 	case *string:
 		*v = value
 	case *int:
@@ -124,6 +136,8 @@ func (f FieldBindAny) SetString(value string) error {
 			return err
 		}
 		*v = float64(val)
+	case encoding.TextUnmarshaler:
+		return v.UnmarshalText([]byte(value))
 	default:
 		return fmt.Errorf("bound type %T is not supported", f.Value)
 	}
@@ -133,12 +147,16 @@ func (f FieldBindAny) SetString(value string) error {
 
 func (f FieldBindAny) HTMLInputType() string {
 	switch f.Value.(type) {
+	case *bool:
+		return "text" // We will render the boolean as text, as this is an input field, not a checkbox.
 	case *string:
 		return "text"
 	case *int, *int8, *int16, *int32, *int64, *uint, *uint8, *uint16, *uint32, *uint64:
 		return "number"
 	case *float32, *float64:
 		return "number"
+	case encoding.TextMarshaler, encoding.TextUnmarshaler:
+		return "text"
 	}
 
 	return "text"
diff --git a/components/input/radio-button.go b/components/input/radio-button.go
new file mode 100644
index 0000000..48b98d5
--- /dev/null
+++ b/components/input/radio-button.go
@@ -0,0 +1,32 @@
+package input
+
+import (
+	"github.com/vugu/vugu"
+)
+
+// RadioButton provides an option that the user can select.
+// A group of RadioButtons is defined when they share a data binding.
+type RadioButton struct {
+	AttrMap vugu.AttrMap
+
+	Bind FieldBinder // Binds the current selected key to some variable.
+	Key  string      // The key that this RadioButton represents as a string.
+}
+
+func (c *RadioButton) isChecked() bool {
+	if c.Bind != nil {
+		return c.Bind.String() == c.Key
+	}
+
+	return false
+}
+
+func (c *RadioButton) handleChange(event vugu.DOMEvent) {
+	if c.Bind == nil {
+		return
+	}
+
+	if event.PropBool("target", "checked") {
+		c.Bind.SetString(c.Key)
+	}
+}
diff --git a/components/input/radio-button.vugu b/components/input/radio-button.vugu
new file mode 100644
index 0000000..59f268b
--- /dev/null
+++ b/components/input/radio-button.vugu
@@ -0,0 +1,14 @@
+<input type="radio" .checked="c.isChecked()" vg-attr='utils.AttributesAppend{AttrMap: c.AttrMap, Classes: "d3c-1687535513"}' @click="c.handleChange(event)">
+
+<style>
+	.d3c-1687535513 {
+		accent-color: var(--d3c-color-accent);
+	}
+</style>
+
+<script type="application/x-go">
+	import (
+		//"git.d3nexus.de/Dadido3/D3vugu-components/icons"
+		"git.d3nexus.de/Dadido3/D3vugu-components/utils"
+	)
+</script>
diff --git a/components/input/radio-button_vgen.go b/components/input/radio-button_vgen.go
new file mode 100644
index 0000000..91e1fb0
--- /dev/null
+++ b/components/input/radio-button_vgen.go
@@ -0,0 +1,50 @@
+package input
+
+// Code generated by vugu via vugugen. Please regenerate instead of editing or add additional code in a separate file. DO NOT EDIT.
+
+import "fmt"
+import "reflect"
+import "github.com/vugu/vjson"
+import "github.com/vugu/vugu"
+import js "github.com/vugu/vugu/js"
+
+import (
+	//"git.d3nexus.de/Dadido3/D3vugu-components/icons"
+	"git.d3nexus.de/Dadido3/D3vugu-components/utils"
+)
+
+func (c *RadioButton) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
+
+	vgout = &vugu.BuildOut{}
+
+	var vgiterkey interface{}
+	_ = vgiterkey
+	var vgn *vugu.VGNode
+	vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "input", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "type", Val: "radio"}}}
+	vgout.Out = append(vgout.Out, vgn)	// root for output
+	vgn.AddAttrList(utils.AttributesAppend{AttrMap: c.AttrMap, Classes: "d3c-1687535513"})
+	{
+		b, err := vjson.Marshal(c.isChecked())
+		if err != nil {
+			panic(err)
+		}
+		vgn.Prop = append(vgn.Prop, vugu.VGProperty{Key: "checked", JSONVal: vjson.RawMessage(b)})
+	}
+	vgn.DOMEventHandlerSpecList = append(vgn.DOMEventHandlerSpecList, vugu.DOMEventHandlerSpec{
+		EventType:	"click",
+		Func:		func(event vugu.DOMEvent) { c.handleChange(event) },
+		// TODO: implement capture, etc. mostly need to decide syntax
+	})
+	vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Data: "style", Attr: []vugu.VGAttribute(nil)}
+	{
+		vgn.AppendChild(&vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t.d3c-1687535513 {\n\t\taccent-color: var(--d3c-color-accent);\n\t}\n", Attr: []vugu.VGAttribute(nil)})
+	}
+	vgout.AppendCSS(vgn)
+	return vgout
+}
+
+// 'fix' unused imports
+var _ fmt.Stringer
+var _ reflect.Type
+var _ vjson.RawMessage
+var _ js.Value
diff --git a/page-input.go b/page-input.go
index 593ca31..747c216 100644
--- a/page-input.go
+++ b/page-input.go
@@ -6,12 +6,18 @@ type PageInput struct {
 	button1Counter int  `vugu:"data"`
 	button4Bool    bool `vugu:"data"`
 
+	radioButton1 string `vugu:"data"`
+
+	checkBox1 bool `vugu:"data"`
+	checkBox2 bool `vugu:"data"`
+
 	inputField1String string  `vugu:"data"`
 	inputField2Int    int     `vugu:"data"`
 	inputField3Float  float64 `vugu:"data"`
 	inputField4String string  `vugu:"data"`
 	inputField5String string  `vugu:"data"`
 	inputField5Bool   bool    `vugu:"data"`
+	inputField6Bool   bool    `vugu:"data"`
 
 	dropdown1Slice []string `vugu:"data"`
 	dropdown1Index int      `vugu:"data"`
@@ -20,6 +26,8 @@ type PageInput struct {
 }
 
 func (c *PageInput) Init(ctx vugu.InitCtx) {
+	c.radioButton1 = "B"
+	c.checkBox2 = true
 	c.dropdown1Slice = []string{"This", "is", "a", "list", "of", "things!"}
 	c.tags1Slice = []string{"some", "tags"}
 }
diff --git a/page-input.vugu b/page-input.vugu
index 56930d9..5dea6b6 100644
--- a/page-input.vugu
+++ b/page-input.vugu
@@ -44,6 +44,32 @@
 		<input:Button :Bind="&c.button4Bool">Toggle me!</input:Button>
 		<span vg-content="fmt.Sprintf(`Boolean is set to %v.`, c.button4Bool)"></span>
 
+		<h2>Radio buttons</h2>
+		<view:Code>
+			<pre vg-content='"<input:RadioButton id=\"page-radio-button-1-a\" :Bind=\"input.FieldBindAny{&c.radioButton1}\" Key=\"A\"></input:RadioButton>\n" +
+							"<label for=\"page-radio-button-1-a\">Option A</label>"' style="margin: 0;"></pre>
+		</view:Code>
+		<input:RadioButton id="page-radio-button-1-a" :Bind="input.FieldBindAny{&c.radioButton1}" Key="A"></input:RadioButton>
+		<label for="page-radio-button-1-a">Option A</label>
+		<br>
+		<input:RadioButton id="page-radio-button-1-b" :Bind="input.FieldBindAny{&c.radioButton1}" Key="B"></input:RadioButton>
+		<label for="page-radio-button-1-b">Option B</label>
+		<br>
+		<input:RadioButton id="page-radio-button-1-c" :Bind="input.FieldBindAny{&c.radioButton1}" Key="C"></input:RadioButton>
+		<label for="page-radio-button-1-c">Option C</label>
+		<div vg-content="fmt.Sprintf(`Selected option is %q.`, c.radioButton1)"></div>
+
+		<h2>Checkboxes</h2>
+		<view:Code>
+			<pre vg-content='"<input:CheckBox id=\"page-checkBox-1\" :Bind=\"&c.checkBox1\"></input:CheckBox>\n" +
+							"<label for=\"page-checkBox-1\">Click this to toggle the checkBox</label>"' style="margin: 0;"></pre>
+		</view:Code>
+		<input:CheckBox id="page-checkBox-1" :Bind="&c.checkBox1"></input:CheckBox>
+		<label for="page-checkBox-1">Click this to toggle the checkbox</label>
+		<div vg-content="fmt.Sprintf(`Boolean is set to %v.`, c.checkBox1)"></div>
+		<input:CheckBox id="page-checkBox-2" :Bind="&c.checkBox2"></input:CheckBox>
+		<label for="page-checkBox-2">Click this to toggle the pre-checked checkbox</label>
+
 		<h2>Input fields</h2>
 		<p>Input fields can be bound to data. They will automatically change their type based on the bound data type.</p>
 		<p>To make labels work correctly, you have to use the <view:CodeInline>ID="some-id"</view:CodeInline> tag (uppercase ID), which will set the ID of the embedded input element!</p>
@@ -62,6 +88,10 @@
 		<label for="page-input-3">Some input field bound to float value</label>
 		<input:Field ID="page-input-3" :Bind="input.FieldBindAny{&c.inputField3Float}"></input:Field>
 		<span vg-content='fmt.Sprintf("Current value is %v.", c.inputField3Float)'></span>
+		<br>
+		<label for="page-input-6">Some input field bound to bool value</label>
+		<input:Field ID="page-input-6" :Bind="input.FieldBindAny{&c.inputField6Bool}"></input:Field>
+		<span vg-content='fmt.Sprintf("Current state is %v.", c.inputField6Bool)'></span>
 		<p>For passwords you have to use the <view:CodeInline>input.FieldBindPassword</view:CodeInline> binder:</p>
 		<label for="page-input-4">Some input field bound to password string</label>
 		<input:Field ID="page-input-4" :Bind="input.FieldBindPassword{&c.inputField4String}"></input:Field>
diff --git a/page-input_vgen.go b/page-input_vgen.go
index df9f040..935fd07 100644
--- a/page-input_vgen.go
+++ b/page-input_vgen.go
@@ -31,7 +31,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 		vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t"}
 		vgparent.AppendChild(vgn)
 		{
-			vgcompKey := vugu.MakeCompKey(0x20AFF4661A9DBAD9^vgin.CurrentPositionHash(), vgiterkey)
+			vgcompKey := vugu.MakeCompKey(0xD91683A9B73577EE^vgin.CurrentPositionHash(), vgiterkey)
 			// ask BuildEnv for prior instance of this specific component
 			vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*layout.Container)
 			if vgcomp == nil {
@@ -62,7 +62,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "Clickable components support the "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x2E6D6C403988153C^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0x5B30FCAD26739F63^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -89,7 +89,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: " event that handlers can be registered to with "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x8E897D05FF62A33^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0x6B9DB7F6B53653AE^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -117,7 +117,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0xC1C3CCC0AF55B34A^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xF288C6CA8AD20954^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -166,7 +166,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x736F807B47B17752^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x3B4A927BBE7A1799^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -198,7 +198,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0xCBC9DEE03A1E26A2^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x90DA35C1900DEDC8^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 					if vgcomp == nil {
@@ -232,7 +232,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x5F232F759A4B73AE^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x4D711FE64E9739F8^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -267,7 +267,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0xEB082BAAB0ABC376^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x765CC91E21B26780^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 					if vgcomp == nil {
@@ -284,7 +284,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						_ = vgparent
 
 						{
-							vgcompKey := vugu.MakeCompKey(0xE26F025C754B71B6^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x406B98FE10679DEC^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LDocument)
 							if vgcomp == nil {
@@ -330,7 +330,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "Use the "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x67ED61626DC06036^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0x61B658093D9F2480^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -360,7 +360,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x1B4AC4970673A406^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x223C6A258C851839^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -395,7 +395,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x793CBD2C6ACD6913^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x262D746787D635F5^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 					if vgcomp == nil {
@@ -414,7 +414,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						_ = vgparent
 
 						{
-							vgcompKey := vugu.MakeCompKey(0xD464CB7D5C84AD3E^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x1D5E2D2D1DC8E22B^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LGlobe)
 							if vgcomp == nil {
@@ -454,7 +454,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x96B6DA51AAF049CA^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x166575EBA57E5395^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -486,7 +486,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x3F74EE4F364D7546^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xE099A60747E10D04^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 					if vgcomp == nil {
@@ -520,6 +520,225 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgparent.AppendChild(vgn)
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h2", Attr: []vugu.VGAttribute(nil)}
 				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Radio buttons"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0xD69BB61B7D6C0736^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(view.Code)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.DefaultSlot = vugu.NewBuilderFunc(func(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
+						vgn := &vugu.VGNode{Type: vugu.VGNodeType(3)}
+						vgout = &vugu.BuildOut{}
+						vgout.Out = append(vgout.Out, vgn)
+						vgparent := vgn
+						_ = vgparent
+
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"}
+						vgparent.AppendChild(vgn)
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "pre", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "style", Val: "margin: 0;"}}}
+						vgparent.AppendChild(vgn)
+						vgn.SetInnerHTML("<input:RadioButton id=\"page-radio-button-1-a\" :Bind=\"input.FieldBindAny{&c.radioButton1}\" Key=\"A\"></input:RadioButton>\n" +
+							"<label for=\"page-radio-button-1-a\">Option A</label>")
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+						vgparent.AppendChild(vgn)
+						return
+					})
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x2B23448F4992967D^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.RadioButton)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.RadioButton)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = input.FieldBindAny{&c.radioButton1}
+					vgcomp.AttrMap = make(map[string]interface{}, 8)
+					vgcomp.AttrMap["id"] = "page-radio-button-1-a"
+					vgcomp.Key = "A"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-radio-button-1-a"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Option A"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "br", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML(""))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x242A69A41C22FD77^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.RadioButton)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.RadioButton)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = input.FieldBindAny{&c.radioButton1}
+					vgcomp.AttrMap = make(map[string]interface{}, 8)
+					vgcomp.AttrMap["id"] = "page-radio-button-1-b"
+					vgcomp.Key = "B"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-radio-button-1-b"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Option B"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "br", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML(""))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0xB3591D43765CE4A6^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.RadioButton)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.RadioButton)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = input.FieldBindAny{&c.radioButton1}
+					vgcomp.AttrMap = make(map[string]interface{}, 8)
+					vgcomp.AttrMap["id"] = "page-radio-button-1-c"
+					vgcomp.Key = "C"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-radio-button-1-c"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Option C"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(fmt.Sprintf(`Selected option is %q.`, c.radioButton1))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h2", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Checkboxes"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x356F69A257F5FFAC^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(view.Code)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.DefaultSlot = vugu.NewBuilderFunc(func(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
+						vgn := &vugu.VGNode{Type: vugu.VGNodeType(3)}
+						vgout = &vugu.BuildOut{}
+						vgout.Out = append(vgout.Out, vgn)
+						vgparent := vgn
+						_ = vgparent
+
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"}
+						vgparent.AppendChild(vgn)
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "pre", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "style", Val: "margin: 0;"}}}
+						vgparent.AppendChild(vgn)
+						vgn.SetInnerHTML("<input:CheckBox id=\"page-checkBox-1\" :Bind=\"&c.checkBox1\"></input:CheckBox>\n" +
+							"<label for=\"page-checkBox-1\">Click this to toggle the checkBox</label>")
+						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+						vgparent.AppendChild(vgn)
+						return
+					})
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0xB4DC6B64ABA54579^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.CheckBox)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.CheckBox)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = &c.checkBox1
+					vgcomp.AttrMap = make(map[string]interface{}, 8)
+					vgcomp.AttrMap["id"] = "page-checkBox-1"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-checkBox-1"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Click this to toggle the checkbox"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(fmt.Sprintf(`Boolean is set to %v.`, c.checkBox1))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x8E823C6B52892653^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.CheckBox)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.CheckBox)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = &c.checkBox2
+					vgcomp.AttrMap = make(map[string]interface{}, 8)
+					vgcomp.AttrMap["id"] = "page-checkBox-2"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-checkBox-2"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Click this to toggle the pre-checked checkbox"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h2", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
 				vgn.SetInnerHTML(vugu.HTML("Input fields"))
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
@@ -536,7 +755,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "To make labels work correctly, you have to use the "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x5A116BC94CF63768^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0x8A395E3190C3BB17^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -566,7 +785,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0xE85FB93B618818E8^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xDCC83ED7EF6D2B07^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -604,7 +823,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x89C59B48EFCFE8B2^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x3C5D37BC91592864^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
 					if vgcomp == nil {
@@ -637,7 +856,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x4E2591ABE6D3FA81^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xAD10FB81C6E8DBC6^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
 					if vgcomp == nil {
@@ -670,7 +889,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x551A134858275AB5^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x2227DAD00DA77ED^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
 					if vgcomp == nil {
@@ -692,6 +911,39 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn.SetInnerHTML(fmt.Sprintf("Current value is %v.", c.inputField3Float))
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "br", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML(""))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "label", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "for", Val: "page-input-6"}}}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(vugu.HTML("Some input field bound to bool value"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x9C29CAB437462211^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.Field)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Bind = input.FieldBindAny{&c.inputField6Bool}
+					vgcomp.ID = "page-input-6"
+					vgout.Components = append(vgout.Components, vgcomp)
+					vgn = &vugu.VGNode{Component: vgcomp}
+					vgparent.AppendChild(vgn)
+				}
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "span", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				vgn.SetInnerHTML(fmt.Sprintf("Current state is %v.", c.inputField6Bool))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "p", Attr: []vugu.VGAttribute(nil)}
 				vgparent.AppendChild(vgn)
 				{
@@ -700,7 +952,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "For passwords you have to use the "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x7D75A607D172A648^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0xE03E10C30B31DCAE^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -735,7 +987,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x60E1D908E511559^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xF80E7959999F9A6E^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
 					if vgcomp == nil {
@@ -768,7 +1020,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x9CE0F544EC27FBEB^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x24D83BEE34C19455^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Field)
 					if vgcomp == nil {
@@ -789,7 +1041,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0xE80EA74D367F5D16^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x4C793F71A9D72212^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 							if vgcomp == nil {
@@ -810,7 +1062,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								vgparent.AppendChild(vgn)
 								if !c.inputField5Bool {
 									{
-										vgcompKey := vugu.MakeCompKey(0xA5DA8A9DBDB90700^vgin.CurrentPositionHash(), vgiterkey)
+										vgcompKey := vugu.MakeCompKey(0xDBC6A1964C3AAB4E^vgin.CurrentPositionHash(), vgiterkey)
 										// ask BuildEnv for prior instance of this specific component
 										vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LLockOpened)
 										if vgcomp == nil {
@@ -830,7 +1082,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								vgparent.AppendChild(vgn)
 								if c.inputField5Bool {
 									{
-										vgcompKey := vugu.MakeCompKey(0xDD2A63E717759625^vgin.CurrentPositionHash(), vgiterkey)
+										vgcompKey := vugu.MakeCompKey(0xADC3EACF8D017D8^vgin.CurrentPositionHash(), vgiterkey)
 										// ask BuildEnv for prior instance of this specific component
 										vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LLockClosed)
 										if vgcomp == nil {
@@ -857,7 +1109,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x1F20F757A0BF686B^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0xAAE16992DDE3F2B4^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 							if vgcomp == nil {
@@ -876,7 +1128,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t"}
 								vgparent.AppendChild(vgn)
 								{
-									vgcompKey := vugu.MakeCompKey(0x70D6A89A66CE9BBA^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0xF4E25069180419AB^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LGlobe)
 									if vgcomp == nil {
@@ -918,7 +1170,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x454363DE2B487242^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0xA8B644EE4371B847^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Dropdown)
 					if vgcomp == nil {
@@ -953,7 +1205,7 @@ func (c *PageInput) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0xD0C3C4E61B43E42F^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x13F92885BE084412^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Tags)
 					if vgcomp == nil {