From 518c47ab4747e76371b0fe9d29f518d02309e9af Mon Sep 17 00:00:00 2001 From: David Vogel Date: Fri, 19 May 2023 23:45:39 +0200 Subject: [PATCH] Improve overlay package - Add toast overlays - Add a way to color overlay containers and menus - Add d3c-button-transparent CSS class - Update overlay example page --- components/input/button.vugu | 2 +- components/input/button_vgen.go | 2 +- components/overlay/container.go | 49 +++++- components/overlay/container.vugu | 61 ++++++- components/overlay/container_vgen.go | 111 ++++++++++++- components/overlay/modal-requester.go | 7 + components/overlay/modal-requester.vugu | 2 +- components/overlay/overlay-classes.go | 8 + components/overlay/toast-simple.go | 19 +++ components/overlay/toast-simple.vugu | 26 +++ components/overlay/toast-simple_vgen.go | 95 +++++++++++ go.mod | 1 + go.sum | 2 + page-colors_vgen.go | 80 +++++----- page-overlays.go | 31 +++- page-overlays.vugu | 36 +++-- page-overlays_vgen.go | 202 ++++++++++++++++++++++-- root_vgen.go | 32 ++-- 18 files changed, 665 insertions(+), 101 deletions(-) create mode 100644 components/overlay/overlay-classes.go create mode 100644 components/overlay/toast-simple.go create mode 100644 components/overlay/toast-simple.vugu create mode 100644 components/overlay/toast-simple_vgen.go diff --git a/components/input/button.vugu b/components/input/button.vugu index 631082c..dab91bf 100644 --- a/components/input/button.vugu +++ b/components/input/button.vugu @@ -27,7 +27,7 @@ flex-direction: column; } - .d3c-1633357633-sidebar .d3c-1633424238, .d3c-1633357633-menu .d3c-1633424238 { + .d3c-1633424238.d3c-button-transparent, .d3c-1633357633-sidebar .d3c-1633424238, .d3c-1633357633-menu .d3c-1633424238 { border: none; background-color: transparent; } diff --git a/components/input/button_vgen.go b/components/input/button_vgen.go index 0372599..3932869 100644 --- a/components/input/button_vgen.go +++ b/components/input/button_vgen.go @@ -55,7 +55,7 @@ func (c *Button) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { } 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-1633424238 {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.5em;\n\t\ttext-decoration: none;\n\t\tpadding: 0.3em 0.5em;\n\t\tmargin: 0.5em 0;\n\t\tborder-radius: 4px;\n\t\tborder: 1px solid var(--d3c-color-border);\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\tfont-size: 1em;\n\t\tfont-family: \"Segoe UI\", sans-serif;\n\t\tmin-height: 2em;\n\t\tuser-select: none;\n\t}\n\n\t.d3c-1633424238.d3c-button-vertical {\n\t\tflex-direction: column;\n\t}\n\n\t.d3c-1633357633-sidebar .d3c-1633424238, .d3c-1633357633-menu .d3c-1633424238 {\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t}\n\n\t.d3c-1633424238:hover {\n\t\tbackground-color: var(--d3c-color-hovered);\n\t}\n\n\t.d3c-1633424238:active {\n\t\tbackground-color: var(--d3c-color-clicked);\n\t}\n\n\t.d3c-1633424238-selected {\n\t\tbackground-color: var(--d3c-color-selected) !important;\n\t}\n", Attr: []vugu.VGAttribute(nil)}) + vgn.AppendChild(&vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t.d3c-1633424238 {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 0.5em;\n\t\ttext-decoration: none;\n\t\tpadding: 0.3em 0.5em;\n\t\tmargin: 0.5em 0;\n\t\tborder-radius: 4px;\n\t\tborder: 1px solid var(--d3c-color-border);\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\tfont-size: 1em;\n\t\tfont-family: \"Segoe UI\", sans-serif;\n\t\tmin-height: 2em;\n\t\tuser-select: none;\n\t}\n\n\t.d3c-1633424238.d3c-button-vertical {\n\t\tflex-direction: column;\n\t}\n\n\t.d3c-1633424238.d3c-button-transparent, .d3c-1633357633-sidebar .d3c-1633424238, .d3c-1633357633-menu .d3c-1633424238 {\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t}\n\n\t.d3c-1633424238:hover {\n\t\tbackground-color: var(--d3c-color-hovered);\n\t}\n\n\t.d3c-1633424238:active {\n\t\tbackground-color: var(--d3c-color-clicked);\n\t}\n\n\t.d3c-1633424238-selected {\n\t\tbackground-color: var(--d3c-color-selected) !important;\n\t}\n", Attr: []vugu.VGAttribute(nil)}) } vgout.AppendCSS(vgn) return vgout diff --git a/components/overlay/container.go b/components/overlay/container.go index eb60dde..e1d992c 100644 --- a/components/overlay/container.go +++ b/components/overlay/container.go @@ -3,12 +3,24 @@ package overlay import ( "git.d3nexus.de/Dadido3/D3vugu-components/components/navigation" "github.com/vugu/vugu" + "golang.org/x/exp/slices" ) // Container can be embedded in your root component and provides a way to show overlays like modals and toasts. type Container struct { - modal vugu.Builder `vugu:"data"` - modalTitle string + modal vugu.Builder `vugu:"data"` + modalTitle string `vugu:"data"` + modalSignalClasses string // Additional classes that are applied to the modal menu bar. + modalContainerClasses string // Additional classes that are applied to the whole modal body. + + toasts []ContainerToast `vugu:"data"` +} + +type ContainerToast struct { + body vugu.Builder `vugu:"data"` + + signalClasses string // Additional classes that are applied to the small bar to the left. + containerClasses string // Additional classes that are applied to the whole toast. } func (c *Container) handleModalClose(event vugu.DOMEvent) { @@ -19,10 +31,43 @@ func (c *Container) SetModal(component vugu.Builder) { c.modal = component c.modalTitle = "" + c.modalContainerClasses = "" + c.modalSignalClasses = "d3c-color-accent" // Retrieve title from component if it implements the PageTitleGetter interface. if pageInfo, ok := component.(navigation.PageTitleGetter); ok { c.modalTitle, _, _ = pageInfo.PageTitle() } + // Retrieve additional CSS classes from component. + if overlayClassesGetter, ok := component.(OverlayClassesGetter); ok { + c.modalSignalClasses, c.modalContainerClasses = overlayClassesGetter.OverlayClasses() + } +} + +func (c *Container) handleToastClose(event vugu.DOMEvent, toast vugu.Builder) { + c.CloseToast(toast) +} + +func (c *Container) AddToast(component vugu.Builder) { + toast := ContainerToast{ + body: component, + signalClasses: "d3c-color-accent", + } + + // Retrieve additional classes. + if overlayClassesGetter, ok := component.(OverlayClassesGetter); ok { + toast.signalClasses, toast.containerClasses = overlayClassesGetter.OverlayClasses() + } + + c.toasts = append(c.toasts, toast) +} + +func (c *Container) CloseToast(component vugu.Builder) { + for i, toast := range c.toasts { + if toast.body == component { + c.toasts = slices.Delete(c.toasts, i, i+1) + break + } + } } type OverlayContainerRef struct { diff --git a/components/overlay/container.vugu b/components/overlay/container.vugu index 616964c..0ff603f 100644 --- a/components/overlay/container.vugu +++ b/components/overlay/container.vugu @@ -1,13 +1,22 @@
-
-
-

- +
+
+

+
+
+
+
+
+
+ +
+
+
\ No newline at end of file + diff --git a/components/overlay/container_vgen.go b/components/overlay/container_vgen.go index bebc1ec..2f0cb5b 100644 --- a/components/overlay/container_vgen.go +++ b/components/overlay/container_vgen.go @@ -37,19 +37,21 @@ func (c *Container) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent.AppendChild(vgn) vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute(nil)} vgparent.AppendChild(vgn) + vgn.AddAttrInterface("class", c.modalContainerClasses) { 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: "div", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-menu d3c-color-accent"}}} + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute(nil)} vgparent.AppendChild(vgn) + vgn.AddAttrInterface("class", "d3c-1684423938-modal-menu "+c.modalSignalClasses) { vgparent := vgn _ = vgparent vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t"} vgparent.AppendChild(vgn) - vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h3", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-title"}, vugu.VGAttribute{Namespace: "", Key: "style", Val: "flex-grow:1"}}} + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h3", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-modal-title"}, vugu.VGAttribute{Namespace: "", Key: "style", Val: "flex-grow:1"}}} vgparent.AppendChild(vgn) vgn.SetInnerHTML(c.modalTitle) vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t"} @@ -64,6 +66,8 @@ func (c *Container) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgin.BuildEnv.WireComponent(vgcomp) } vgin.BuildEnv.UseComponent(vgcompKey, vgcomp) // ensure we can use this in the cache next time around + vgcomp.AttrMap = make(map[string]interface{}, 8) + vgcomp.AttrMap["class"] = "d3c-button-transparent" vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleModalClose(event) }) vgcomp.SymbolSlot = vugu.NewBuilderFunc(func(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn := &vugu.VGNode{Type: vugu.VGNodeType(3)} @@ -113,12 +117,113 @@ func (c *Container) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent.AppendChild(vgn) } } + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t"} + vgparent.AppendChild(vgn) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-toast-container"}}} + vgparent.AppendChild(vgn) + { + vgparent := vgn + _ = vgparent + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} + vgparent.AppendChild(vgn) + for vgiterkeyt, toast := range c.toasts { + var vgiterkey interface{} = vgiterkeyt + _ = vgiterkey + toast := toast + _ = toast + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute(nil)} + vgparent.AppendChild(vgn) + vgn.AddAttrInterface("class", "d3c-1684423938-toast "+toast.containerClasses) + { + 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: "div", Attr: []vugu.VGAttribute(nil)} + vgparent.AppendChild(vgn) + vgn.AddAttrInterface("class", "d3c-1684423938-toast-signal "+toast.signalClasses) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"} + vgparent.AppendChild(vgn) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-toast-body"}}} + vgparent.AppendChild(vgn) + { + vgparent := vgn + _ = vgparent + { + var vgcomp vugu.Builder = toast.body + if vgcomp != nil { + vgin.BuildEnv.WireComponent(vgcomp) + 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\t"} + vgparent.AppendChild(vgn) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684423938-toast-menu"}}} + vgparent.AppendChild(vgn) + { + vgparent := vgn + _ = vgparent + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t"} + vgparent.AppendChild(vgn) + { + vgcompKey := vugu.MakeCompKey(0xA4C000EAE5DBC775^vgin.CurrentPositionHash(), vgiterkey) + // ask BuildEnv for prior instance of this specific component + vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) + if vgcomp == nil { + // create new one if needed + vgcomp = new(input.Button) + vgin.BuildEnv.WireComponent(vgcomp) + } + vgin.BuildEnv.UseComponent(vgcompKey, vgcomp) // ensure we can use this in the cache next time around + vgcomp.AttrMap = make(map[string]interface{}, 8) + vgcomp.AttrMap["class"] = "d3c-button-transparent" + vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleToastClose(event, toast.body) }) + vgcomp.SymbolSlot = 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 + + { + vgcompKey := vugu.MakeCompKey(0x552899AFEF0EE902^vgin.CurrentPositionHash(), vgiterkey) + // ask BuildEnv for prior instance of this specific component + vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LCancel) + if vgcomp == nil { + // create new one if needed + vgcomp = new(icons.LCancel) + vgin.BuildEnv.WireComponent(vgcomp) + } + vgin.BuildEnv.UseComponent(vgcompKey, vgcomp) // ensure we can use this in the cache next time around + vgout.Components = append(vgout.Components, vgcomp) + vgn = &vugu.VGNode{Component: vgcomp} + 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\t"} + vgparent.AppendChild(vgn) + } + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} + vgparent.AppendChild(vgn) + } + } + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t"} + vgparent.AppendChild(vgn) + } vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n"} vgparent.AppendChild(vgn) } 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-1684423938 {\n\t\tposition: fixed;\n\t\tz-index: 2;\n\t}\n\n\t.d3c-1684423938-modal-container {\n\t\twidth: 100vw;\n\t\theight: 100vh;\n\t\tposition: fixed;\n\t\tbackdrop-filter: blur(1px) brightness(80%);\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tz-index: 1;\n\t}\n\n\t.d3c-1684423938-modal-container > div {\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t\tborder-radius: 4px;\n\t\tmax-width: 100%;\n\t\tmax-height: 100%;\n\t\toverflow: auto;\n\t\tbox-shadow: 0 1em 3em var(--d3c-color-shadow);\n\t}\n\n\t.d3c-1684423938-menu {\n\t\tpadding: 0.5em;\n\t\tdisplay: flex;\n\t\tgap: 0.5em;\n\t\tjustify-content: flex-end;\n\t\talign-items: baseline;\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t}\n\n\t.d3c-1684423938-menu > * {\n\t\tmargin: 0 !important;\n\t}\n\n\t.d3c-1684423938-title {\n\t\ttext-align: center;\n\t}\n", Attr: []vugu.VGAttribute(nil)}) + vgn.AppendChild(&vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t.d3c-1684423938 {\n\t\tposition: fixed;\n\t\tz-index: 2;\n\t}\n\n\t.d3c-1684423938-modal-container {\n\t\twidth: 100vw;\n\t\theight: 100vh;\n\t\tposition: fixed;\n\t\tbackdrop-filter: blur(1px) brightness(80%);\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tz-index: 1;\n\t}\n\n\t.d3c-1684423938-modal-container > div {\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t\tborder-radius: 4px;\n\t\tmax-width: 100%;\n\t\tmax-height: 100%;\n\t\toverflow: auto;\n\t\tbox-shadow: 0 1em 3em var(--d3c-color-shadow);\n\t}\n\n\t.d3c-1684423938-modal-menu {\n\t\tpadding: 0.5em;\n\t\tdisplay: flex;\n\t\tgap: 0.5em;\n\t\tjustify-content: flex-end;\n\t\talign-items: baseline;\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t}\n\n\t.d3c-1684423938-modal-menu > * {\n\t\tmargin: 0 !important;\n\t}\n\n\t.d3c-1684423938-modal-title {\n\t\ttext-align: center;\n\t}\n\n\t.d3c-1684423938-toast-container {\n\t\tpadding: 1em;\n\t\tpointer-events: none;\n\t\twidth: 100vw;\n\t\theight: 100vh;\n\t\tposition: fixed;\n\t\tz-index: 2;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: flex-end;\n\t\talign-items: center;\n\t\tgap: 1em;\n\t\tbox-sizing: border-box;\n\t}\n\n\t.d3c-1684423938-toast {\n\t\tpointer-events: auto;\n\t\tdisplay: flex;\n\t\tbackground-color: var(--d3c-color-background);\n\t\tborder-radius: 4px;\n\t\toverflow: hidden;\n\t\tcolor: var(--d3c-color-text);\n\t\tbox-shadow: 0 1em 2em var(--d3c-color-shadow);\n\t}\n\n\t.d3c-1684423938-toast-signal {\n\t\twidth: 0.5em;\n\t\theight: 100%;\n\t\tbackground-color: var(--d3c-color-background);\n\t\tcolor: var(--d3c-color-text);\n\t}\n\n\t.d3c-1684423938-toast-menu {\n\t\tpadding-right: 0.5em;\n\t}\n", Attr: []vugu.VGAttribute(nil)}) } vgout.AppendCSS(vgn) return vgout diff --git a/components/overlay/modal-requester.go b/components/overlay/modal-requester.go index a7a18f4..2974c49 100644 --- a/components/overlay/modal-requester.go +++ b/components/overlay/modal-requester.go @@ -13,6 +13,8 @@ type ModalRequester struct { Title string `vugu:"data"` Message string `vugu:"data"` + SignalColor string // A d3c CSS class for the color scheme of the small bar. + ClickAbort input.ClickHandler ClickYes input.ClickHandler } @@ -31,6 +33,11 @@ func (c *ModalRequester) handleClickYes(event vugu.DOMEvent) { c.SetModal(nil) } +// OverlayClasses implements OverlayClassesGetter which is used by the overlay package to add classes to overlay elements. +func (c *ModalRequester) OverlayClasses() (signalClasses, containerClasses string) { + return c.SignalColor, "" +} + // PageTitle implements PageTitleGetter which is used by PageInfo. func (c *ModalRequester) PageTitle() (title, longTitle, shortTitle string) { return c.Title, c.Title, c.Title diff --git a/components/overlay/modal-requester.vugu b/components/overlay/modal-requester.vugu index 641ae5b..9ab669d 100644 --- a/components/overlay/modal-requester.vugu +++ b/components/overlay/modal-requester.vugu @@ -28,4 +28,4 @@ "git.d3nexus.de/Dadido3/D3vugu-components/components/input" "git.d3nexus.de/Dadido3/D3vugu-components/components/layout" ) - \ No newline at end of file + diff --git a/components/overlay/overlay-classes.go b/components/overlay/overlay-classes.go new file mode 100644 index 0000000..67b35ff --- /dev/null +++ b/components/overlay/overlay-classes.go @@ -0,0 +1,8 @@ +package overlay + +// OverlayClassesGetter can be implemented by components that are used in overlays. +// With this mechanic these components can set additional CSS classes to the modal or toast container. +// One use case is to give a toast or modal some other color with the `d3c-color-*` classes. +type OverlayClassesGetter interface { + OverlayClasses() (signalClasses, containerClasses string) +} diff --git a/components/overlay/toast-simple.go b/components/overlay/toast-simple.go new file mode 100644 index 0000000..9339bec --- /dev/null +++ b/components/overlay/toast-simple.go @@ -0,0 +1,19 @@ +package overlay + +import ( + "github.com/vugu/vugu" +) + +type ToastSimple struct { + OverlayContainerRef + + SymbolSlot vugu.Builder `vugu:"data"` // Slot for the symbol. + + Message string `vugu:"data"` + + SignalColor string // A d3c CSS class for the color scheme of the small bar. +} + +func (c *ToastSimple) OverlayClasses() (signalClasses, containerClasses string) { + return c.SignalColor, "" +} diff --git a/components/overlay/toast-simple.vugu b/components/overlay/toast-simple.vugu new file mode 100644 index 0000000..bebc3b5 --- /dev/null +++ b/components/overlay/toast-simple.vugu @@ -0,0 +1,26 @@ +
+ +
+ +

+
+ +
+ + + + diff --git a/components/overlay/toast-simple_vgen.go b/components/overlay/toast-simple_vgen.go new file mode 100644 index 0000000..645cd67 --- /dev/null +++ b/components/overlay/toast-simple_vgen.go @@ -0,0 +1,95 @@ +package overlay + +// 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/components/layout" +) + +func (c *ToastSimple) 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: "div", Attr: []vugu.VGAttribute(nil)} + vgout.Out = append(vgout.Out, vgn) // root for output + { + vgparent := vgn + _ = vgparent + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t"} + vgparent.AppendChild(vgn) + { + vgcompKey := vugu.MakeCompKey(0xB9D9A7518285E51F^vgin.CurrentPositionHash(), vgiterkey) + // ask BuildEnv for prior instance of this specific component + vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*layout.Container) + if vgcomp == nil { + // create new one if needed + vgcomp = new(layout.Container) + 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"} + vgparent.AppendChild(vgn) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "div", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "class", Val: "d3c-1684524720-flex"}}} + vgparent.AppendChild(vgn) + { + vgparent := vgn + _ = vgparent + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t"} + vgparent.AppendChild(vgn) + { + var vgcomp vugu.Builder = c.SymbolSlot + if vgcomp != nil { + vgin.BuildEnv.WireComponent(vgcomp) + 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\t"} + vgparent.AppendChild(vgn) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "p", Attr: []vugu.VGAttribute{vugu.VGAttribute{Namespace: "", Key: "style", Val: "white-space: pre-wrap;"}}} + vgparent.AppendChild(vgn) + vgn.SetInnerHTML(c.Message) + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} + vgparent.AppendChild(vgn) + } + vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\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"} + vgparent.AppendChild(vgn) + } + 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-1684524720-flex {\n\t\tmargin: 0.5em 0;\n\t\tdisplay: flex;\n\t\tgap: 0.5em;\n\t}\n\n\t.d3c-1684524720-flex > * {\n\t\tmargin: 0;\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/go.mod b/go.mod index c7d7b15..4c7d5bc 100644 --- a/go.mod +++ b/go.mod @@ -6,6 +6,7 @@ require ( github.com/vugu/vgrouter v0.0.0-20200725205318-eeb478c42e5d github.com/vugu/vjson v0.0.0-20200505061711-f9cbed27d3d9 github.com/vugu/vugu v0.3.5 + golang.org/x/exp v0.0.0-20230519143937-03e91628a987 ) require ( diff --git a/go.sum b/go.sum index 31d455b..626a255 100644 --- a/go.sum +++ b/go.sum @@ -34,6 +34,8 @@ github.com/vugu/vugu v0.3.5/go.mod h1:E0NT8+F8KDmLDKzYTNySlcvljJdfOpBHzcMJ/0bYLf github.com/vugu/xxhash v0.0.0-20191111030615-ed24d0179019 h1:8NGiD5gWbVGObr+lnqcbM2rcOQBO6mr+m19BIblCdho= github.com/vugu/xxhash v0.0.0-20191111030615-ed24d0179019/go.mod h1:PrBK6+LJXwb+3EnJTHo43Uh4FhjFFwvN4jKk4Zc5zZ8= golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w= +golang.org/x/exp v0.0.0-20230519143937-03e91628a987 h1:3xJIFvzUFbu4ls0BTBYcgbCGhA63eAOEMxIHugyXJqA= +golang.org/x/exp v0.0.0-20230519143937-03e91628a987/go.mod h1:V1LtkGg67GoY2N1AnLN78QLrzxkLyJw7RJb1gzOOz9w= golang.org/x/net v0.0.0-20190912160710-24e19bdeb0f2/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s= golang.org/x/sys v0.0.0-20181031143558-9b800f95dbbc/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY= golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY= diff --git a/page-colors_vgen.go b/page-colors_vgen.go index fdb2401..cc7d7ad 100644 --- a/page-colors_vgen.go +++ b/page-colors_vgen.go @@ -73,7 +73,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x96098CB0B573182A^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x58C38B75AA03AA2E^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -108,7 +108,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x64AD217412230CF^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x80935F5D48DA9F6F^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -141,7 +141,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xC21BBA903E4FBD23^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x3D2E77D1AA05141^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -174,7 +174,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x736F3EA9E22840DE^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x7590A8285D972FC0^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -207,7 +207,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x7318852D6FF7E225^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x9FA0389941803E7E^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -240,7 +240,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x590B193DE45D2365^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x5DE60228BFA6DC05^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -273,7 +273,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xBE20635692AF75FB^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x81E6C783DCB222D^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -306,7 +306,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x8F69D506A2B46324^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xEBA4FA16CD695FAC^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -339,7 +339,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x44391F7A18EA68E5^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xD1F22BE520A4D2F1^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -372,7 +372,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xB3F8269A2D0CCA09^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xF4C97B100AC05156^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -405,7 +405,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x12A4FDCC9B76A6AE^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x2D43E866AD32186A^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -438,7 +438,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgparent := vgn _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x67EC49FACA72611D^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x3685F67B1DFF3548^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -474,7 +474,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x1ABC1BE7C11DEA69^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x3E3BBC1D6D9BB70B^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code) if vgcomp == nil { @@ -516,7 +516,7 @@ func (c *PageColors) 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(0x5B207EA0E767EDAE^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x91799A6A8DB835DC^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -535,7 +535,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x5776C7EF91365193^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x97759048726CA018^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LPlus) if vgcomp == nil { @@ -568,7 +568,7 @@ func (c *PageColors) 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(0xE8DDC80FB1C7BF9A^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x4D56D72CFA7DA1E8^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -620,7 +620,7 @@ func (c *PageColors) 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(0xAE754A121081FB0D^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xD9371741E9BC60EA^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -639,7 +639,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xD0BA5A84A185DE3B^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xAFCD2F9B58831CA8^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LInfoCircle) if vgcomp == nil { @@ -672,7 +672,7 @@ func (c *PageColors) 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(0x2BF23163554B3B6F^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xDC6B84DB1A33BBC1^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -691,7 +691,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xA8804557FBADAC48^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xFDACB4A397260016^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LWarning) if vgcomp == nil { @@ -734,7 +734,7 @@ func (c *PageColors) 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(0x562CBF41D8CE4335^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x82BB143FBA0084FD^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -753,7 +753,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x9756F4936414E367^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x2723A1A51826F7EC^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LPlus) if vgcomp == nil { @@ -786,7 +786,7 @@ func (c *PageColors) 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(0x19470952BBFFB5AF^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xB2E2141C5B44A686^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -838,7 +838,7 @@ func (c *PageColors) 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(0xB6DE95B63367A1F4^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xBEF82AEE9691EC62^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -857,7 +857,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x81E3F61F5CB00F77^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xB22C5A6E93C7AC9^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LInfoCircle) if vgcomp == nil { @@ -890,7 +890,7 @@ func (c *PageColors) 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(0x4661BE319F4A24D5^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x7777775ABAD873ED^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -909,7 +909,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xC3E2DEA30EDAAF09^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x7B260ACC53894132^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LWarning) if vgcomp == nil { @@ -950,7 +950,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x66CD01C2F9A51315^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x4DC92E263044DAE8^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code) if vgcomp == nil { @@ -1246,7 +1246,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "Icons will use the text color by default, if you need to change their stroke/fill coloring, use the "} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x9A717945C584C892^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x9C302FDE8EE7681^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -1276,7 +1276,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x9EDF37F927354A52^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x2D6DA5E326EE8AC9^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code) if vgcomp == nil { @@ -1315,7 +1315,7 @@ func (c *PageColors) 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(0xAFCD2F9B58831CA8^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xA6E519A5CDC25E68^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LInfoCircle) if vgcomp == nil { @@ -1333,7 +1333,7 @@ func (c *PageColors) 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(0x81EDE092A6ECA4BE^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x32DB6F58BFDFE6FD^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LWarning) if vgcomp == nil { @@ -1359,7 +1359,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x4765275A22B050DB^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x80A6F9D5787BE518^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*layout.LayerContainer) if vgcomp == nil { @@ -1387,7 +1387,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "This container uses the "} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0xC07B110D2BA21341^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x7793B4B81AE55595^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline) if vgcomp == nil { @@ -1419,7 +1419,7 @@ func (c *PageColors) 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(0x2884ECF9CF6F9896^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x35407C776AEDFA2^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -1436,7 +1436,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0x88AAFA98B3078878^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x170C1E72F015DBBE^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LPlus) if vgcomp == nil { @@ -1469,7 +1469,7 @@ func (c *PageColors) 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(0x4CDA282D533E2C70^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xAF0BB57570FA91AF^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button) if vgcomp == nil { @@ -1488,7 +1488,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { _ = vgparent { - vgcompKey := vugu.MakeCompKey(0xD83B41FB3807972D^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x66385E7ADD163FB1^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LPlus) if vgcomp == nil { @@ -1529,7 +1529,7 @@ func (c *PageColors) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) { vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"} vgparent.AppendChild(vgn) { - vgcompKey := vugu.MakeCompKey(0x13CD951865998F92^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0x92E6E708166BE47E^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*layout.LayerContainer) if vgcomp == nil { @@ -1550,7 +1550,7 @@ func (c *PageColors) 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(0xB45B7C9CDA346D29^vgin.CurrentPositionHash(), vgiterkey) + vgcompKey := vugu.MakeCompKey(0xFB49BCCB77EF69A0^vgin.CurrentPositionHash(), vgiterkey) // ask BuildEnv for prior instance of this specific component vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LWarning) if vgcomp == nil { diff --git a/page-overlays.go b/page-overlays.go index 1a51563..ee7738c 100644 --- a/page-overlays.go +++ b/page-overlays.go @@ -1,6 +1,8 @@ package main import ( + "time" + "git.d3nexus.de/Dadido3/D3vugu-components/components/input" "git.d3nexus.de/Dadido3/D3vugu-components/components/overlay" "git.d3nexus.de/Dadido3/D3vugu-components/icons" @@ -11,12 +13,29 @@ type PageOverlays struct { overlay.OverlayContainerRef } -func (c *PageOverlays) handleButton(event vugu.DOMEvent) { +func (c *PageOverlays) handleSimpleModalButton(event vugu.DOMEvent) { c.SetModal(&overlay.ModalRequester{ - SymbolSlot: &icons.LInfoCircle{AttrMap: vugu.AttrMap{"style": "font-size: 2em;"}}, - Title: "Simple requester", - Message: "This is a simple modal requester, are you happy with it?\nIt also supports multi line text!", - ClickAbort: input.ClickFunc(func(event input.ClickEvent) {}), - ClickYes: input.ClickFunc(func(event input.ClickEvent) {}), + SymbolSlot: &icons.LInfoCircle{AttrMap: vugu.AttrMap{"style": "font-size: 2em;"}}, + Title: "Simple requester", + Message: "This is a simple modal requester, are you happy with it?\nIt also supports multi line text!", + SignalColor: "d3c-color-accent", + ClickAbort: input.ClickFunc(func(event input.ClickEvent) {}), + ClickYes: input.ClickFunc(func(event input.ClickEvent) {}), + }) +} + +func (c *PageOverlays) handleSimpleToastButton(event vugu.DOMEvent) { + c.AddToast(&overlay.ToastSimple{ + SymbolSlot: &icons.LInfoCircle{AttrMap: vugu.AttrMap{"style": "font-size: 2em;"}}, + Message: "This is a simple toast!\nIt supports multiple lines and has an icon slot.\nThere also can be multiple of it at the same time, this one was opened at " + time.Now().Format(time.TimeOnly) + ".", + SignalColor: "d3c-color-accent", + }) +} + +func (c *PageOverlays) handleWarningToastButton(event vugu.DOMEvent) { + c.AddToast(&overlay.ToastSimple{ + SymbolSlot: &icons.LWarning{AttrMap: vugu.AttrMap{"style": "font-size: 2em;", "class": "d3c-color-caution d3c-icon-use-color"}}, + Message: "This is a warning, be careful!", + SignalColor: "d3c-color-caution", }) } diff --git a/page-overlays.vugu b/page-overlays.vugu index 1384baa..d74dba0 100644 --- a/page-overlays.vugu +++ b/page-overlays.vugu @@ -1,20 +1,38 @@
-

Modals

-

If you component or page contains overlay.OverlayContainerRef and is wired correctly, you can create modals very easily.

+

Overlays

+

Overlays are handled by the overlay.Container component which has to be embedded into your root component.

+

Every page or component that creates overlays has to embed the overlay.OverlayContainerRef structure. Your wiring function also needs to set the reference to your overlay.Container that you have placed in your root component.

+ +

Modals

A simple requester modal is already contained in the overlay package. Use it with:

- 

 		
-		Open simple modal
+		Open simple modal
+
+		
Toasts

+		
A simple text and icon containing toast is already contained in the overlay package. Use it with:

+		
+			

+		
+		Open simple toast
+		Open warning toast
 	
 

 
diff --git a/page-overlays_vgen.go b/page-overlays_vgen.go
index 0aeecba..596b8e3 100644
--- a/page-overlays_vgen.go
+++ b/page-overlays_vgen.go
@@ -29,7 +29,7 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 		vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t"}
 		vgparent.AppendChild(vgn)
 		{
-			vgcompKey := vugu.MakeCompKey(0x8B32FC019648006^vgin.CurrentPositionHash(), vgiterkey)
+			vgcompKey := vugu.MakeCompKey(0x52AAFCFE6AA27B67^vgin.CurrentPositionHash(), vgiterkey)
 			// ask BuildEnv for prior instance of this specific component
 			vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*layout.Container)
 			if vgcomp == nil {
@@ -49,7 +49,7 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgparent.AppendChild(vgn)
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(3), Namespace: "", Data: "h1", Attr: []vugu.VGAttribute(nil)}
 				vgparent.AppendChild(vgn)
-				vgn.SetInnerHTML(vugu.HTML("Modals"))
+				vgn.SetInnerHTML(vugu.HTML("Overlays"))
 				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)}
@@ -57,10 +57,47 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				{
 					vgparent := vgn
 					_ = vgparent
-					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "If you component or page contains "}
+					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "Overlays are handles by the "}
 					vgparent.AppendChild(vgn)
 					{
-						vgcompKey := vugu.MakeCompKey(0x1B9CC39770823BF5^vgin.CurrentPositionHash(), vgiterkey)
+						vgcompKey := vugu.MakeCompKey(0x98FA206D4A8EB1A5^vgin.CurrentPositionHash(), vgiterkey)
+						// ask BuildEnv for prior instance of this specific component
+						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
+						if vgcomp == nil {
+							// create new one if needed
+							vgcomp = new(view.CodeInline)
+							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: "overlay.Container"}
+							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: " component which has to be embedded into your root component."}
+					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: "p", Attr: []vugu.VGAttribute(nil)}
+				vgparent.AppendChild(vgn)
+				{
+					vgparent := vgn
+					_ = vgparent
+					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "Every page or component that creates overlays has to embed the "}
+					vgparent.AppendChild(vgn)
+					{
+						vgcompKey := vugu.MakeCompKey(0x12EDAAD1660231D4^vgin.CurrentPositionHash(), vgiterkey)
 						// ask BuildEnv for prior instance of this specific component
 						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
 						if vgcomp == nil {
@@ -84,9 +121,41 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Component: vgcomp}
 						vgparent.AppendChild(vgn)
 					}
-					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: " and is wired correctly, you can create modals very easily."}
+					vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: " structure. Your wiring function also needs to set the reference to your "}
+					vgparent.AppendChild(vgn)
+					{
+						vgcompKey := vugu.MakeCompKey(0x6BE202C38EAC2939^vgin.CurrentPositionHash(), vgiterkey)
+						// ask BuildEnv for prior instance of this specific component
+						vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.CodeInline)
+						if vgcomp == nil {
+							// create new one if needed
+							vgcomp = new(view.CodeInline)
+							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: "overlay.Container"}
+							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: " that you have placed in your root component."}
 					vgparent.AppendChild(vgn)
 				}
+				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("Modals"))
 				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)}
@@ -95,7 +164,7 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x9C5F61CA0305F660^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x5565E66B9FF31A10^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*view.Code)
 					if vgcomp == nil {
@@ -115,13 +184,14 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						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("func (c *PageOverlays) handleButton(event vugu.DOMEvent) {" +
+						vgn.SetInnerHTML("func (c *PageOverlays) handleButton(event vugu.DOMEvent) {\n" +
 							"	c.SetModal(&overlay.ModalRequester{\n" +
-							"		SymbolSlot: &icons.LInfoCircle{AttrMap: vugu.AttrMap{\"style\": \"font-size: 2em;\"}},\n" +
-							"		Title:      \"Simple requester\",\n" +
-							"		Message:    \"This is a simple modal requester, are you happy with it?\\nIt also supports multi line text!\",\n" +
-							"		ClickAbort: input.ClickFunc(func(event input.ClickEvent) {}),\n" +
-							"		ClickYes:   input.ClickFunc(func(event input.ClickEvent) {}),\n" +
+							"		SymbolSlot:  &icons.LInfoCircle{AttrMap: vugu.AttrMap{\"style\": \"font-size: 2em;\"}},\n" +
+							"		Title:       \"Simple requester\",\n" +
+							"		Message:     \"This is a simple modal requester, are you happy with it?\\nIt also supports multi line text!\",\n" +
+							"		SignalColor: \"d3c-color-accent\",\n" +
+							"		ClickAbort:  input.ClickFunc(func(event input.ClickEvent) {}),\n" +
+							"		ClickYes:    input.ClickFunc(func(event input.ClickEvent) {}),\n" +
 							"	})\n" +
 							"}")
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
@@ -135,7 +205,7 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
 				vgparent.AppendChild(vgn)
 				{
-					vgcompKey := vugu.MakeCompKey(0x5A0135D77FE2347F^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x7C62485D3D2933F^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
 					if vgcomp == nil {
@@ -144,7 +214,7 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgin.BuildEnv.WireComponent(vgcomp)
 					}
 					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
-					vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleButton(event) })
+					vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleSimpleModalButton(event) })
 					vgcomp.DefaultSlot = vugu.NewBuilderFunc(func(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn := &vugu.VGNode{Type: vugu.VGNodeType(3)}
 						vgout = &vugu.BuildOut{}
@@ -160,6 +230,110 @@ func (c *PageOverlays) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 					vgn = &vugu.VGNode{Component: vgcomp}
 					vgparent.AppendChild(vgn)
 				}
+				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("Toasts"))
+				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)
+				vgn.SetInnerHTML(vugu.HTML("A simple text and icon containing toast is already contained in the overlay package. Use it with:"))
+				vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t"}
+				vgparent.AppendChild(vgn)
+				{
+					vgcompKey := vugu.MakeCompKey(0x11C56611B2245D6B^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("func (c *PageOverlays) handleButton(event vugu.DOMEvent) {\n" +
+							"	c.AddToast(&overlay.ToastSimple{\n" +
+							"		SymbolSlot: &icons.LInfoCircle{AttrMap: vugu.AttrMap{\"style\": \"font-size: 2em;\"}},\n" +
+							"		Message:     \"This is a simple toast!\\nIt supports multiple lines and has an icon slot.\\nThere also can be multiple of it at the same time, this one was opened at \" + time.Now().Format(time.TimeOnly) + \".\",\n" +
+							"		SignalColor: \"d3c-color-accent\",\n" +
+							"	})\n" +
+							"}")
+						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(0x172E92B73BA79BEE^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.Button)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleSimpleToastButton(event) })
+					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: "Open simple toast"}
+						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(0x7EA3FB75145AFEBD^vgin.CurrentPositionHash(), vgiterkey)
+					// ask BuildEnv for prior instance of this specific component
+					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*input.Button)
+					if vgcomp == nil {
+						// create new one if needed
+						vgcomp = new(input.Button)
+						vgin.BuildEnv.WireComponent(vgcomp)
+					}
+					vgin.BuildEnv.UseComponent(vgcompKey, vgcomp)	// ensure we can use this in the cache next time around
+					vgcomp.Click = input.ClickFunc(func(event input.ClickEvent) { c.handleWarningToastButton(event) })
+					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: "Open warning toast"}
+						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"}
 				vgparent.AppendChild(vgn)
 				return
diff --git a/root_vgen.go b/root_vgen.go
index ca0bc67..7986577 100644
--- a/root_vgen.go
+++ b/root_vgen.go
@@ -57,7 +57,7 @@ func (c *Root) 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(0x961FC23E1D0E2B0D^vgin.CurrentPositionHash(), vgiterkey)
+					vgcompKey := vugu.MakeCompKey(0x13D2A66973251153^vgin.CurrentPositionHash(), vgiterkey)
 					// ask BuildEnv for prior instance of this specific component
 					vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.Sidebar)
 					if vgcomp == nil {
@@ -76,7 +76,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0xB9941BB3060B0608^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0xE938629831D22C73^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.ButtonFullscreen)
 							if vgcomp == nil {
@@ -103,7 +103,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x9BCC66709F5B5FC4^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x512C516F370EBA81^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -121,7 +121,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0x2888A7DC96618E2B^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0xE60BDC191D489035^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LHome)
 									if vgcomp == nil {
@@ -160,7 +160,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x23321930E313B763^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0xEF681D2FC420491E^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -178,7 +178,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0x50779F17FE66AB6A^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0x9422483909AB3545^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LStar)
 									if vgcomp == nil {
@@ -217,7 +217,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x6358DCE5F06DD9C5^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x5A9A5FC2B82656D3^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -235,7 +235,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0x1392BD562D0DC520^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0xA158CCD6344C8F14^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LInfoCircle)
 									if vgcomp == nil {
@@ -274,7 +274,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x55C1CF2617845DEB^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x7A43D1F40A5008FA^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -292,7 +292,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0xFBA2AAE0C18A3D58^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0x647FEAD3011C9D78^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LCustomize)
 									if vgcomp == nil {
@@ -331,7 +331,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x236DDCBADDD06C42^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0xC8F3C6E3C21BB663^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -349,7 +349,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0x72B82E58E2F7EA80^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0x21CE96F5EEBC0DE0^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LDocument)
 									if vgcomp == nil {
@@ -399,7 +399,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0x4C3861E4C90B286D^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x2D42CEB753CF5843^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -417,7 +417,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0x193E99FC3B0535F1^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0xF93E9305192E8C81^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LGlobe)
 									if vgcomp == nil {
@@ -456,7 +456,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 						vgn = &vugu.VGNode{Type: vugu.VGNodeType(1), Data: "\n\t\t\t\t\t"}
 						vgparent.AppendChild(vgn)
 						{
-							vgcompKey := vugu.MakeCompKey(0xB388BDAC5D1B95AC^vgin.CurrentPositionHash(), vgiterkey)
+							vgcompKey := vugu.MakeCompKey(0x305B37D58E5D5A08^vgin.CurrentPositionHash(), vgiterkey)
 							// ask BuildEnv for prior instance of this specific component
 							vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*navigation.SidebarEntry)
 							if vgcomp == nil {
@@ -474,7 +474,7 @@ func (c *Root) Build(vgin *vugu.BuildIn) (vgout *vugu.BuildOut) {
 								_ = vgparent
 
 								{
-									vgcompKey := vugu.MakeCompKey(0xFE7C9C5BB6C1F6F7^vgin.CurrentPositionHash(), vgiterkey)
+									vgcompKey := vugu.MakeCompKey(0x269733CB3FD93BD4^vgin.CurrentPositionHash(), vgiterkey)
 									// ask BuildEnv for prior instance of this specific component
 									vgcomp, _ := vgin.BuildEnv.CachedComponent(vgcompKey).(*icons.LSettings)
 									if vgcomp == nil {