Implementation of the Vuetify component 'snackbar'

src/Vuetify/Update_validation.jl

@@ -511,3 +511,50 @@ fn=(x)->begin
         haskey(x.attrs, "color")   ? nothing  : x.attrs["color"]   = "secondary"
         haskey(x.attrs, "style")   ? nothing  : x.attrs["style"]   = Dict("margin" => "-12px", "width" => "auto")
 end)
+
+
+UPDATE_VALIDATION["v-snackbar"] = (
+    doc = """The v-snackbar component is used to display a quick message to a user.
+            <code>
+            ### Snackbars
+            @el(snackbar, "v-snackbar", content = "This is a snackbar", timeout = 3000)
+            </code>
+            Timeout, color and content properties are all binded to the elements data *id*.timeout, *id*.color, *id*.content, so they can be dynamically changed during page interaction.
+          """,
+    value_attr = nothing,
+    fn = (x) -> begin
+        x.cols == nothing ? x.cols = 6 : nothing
+
+        ## 3 Basic Defaults
+        haskey(x.attrs, "content") ? nothing  : x.attrs["content"] = ""
+        haskey(x.attrs, "value")   ? nothing  : x.attrs["value"] = false
+        haskey(x.attrs, "color")   ? nothing  : x.attrs["color"]   = "success"
+        haskey(x.attrs, "timeout") ? nothing  : x.attrs["timeout"] = 4000
+        haskey(x.attrs, "style")   ? nothing  : x.attrs["style"]   = ""
+
+        ## Render function
+        x.render_func = (y; opts = PAGE_OPTIONS) -> begin
+            path = opts.path == "" ? "" : opts.path * "."
+            slot = Dict()
+            slot["action=\"{ attrs }\""] = html("v-btn", "<v-icon fab>mdi-close</v-icon>", Dict("icon" => true, "@click" => "$path$(y.id).value = false"))                        
+            slot = [html("template", v, Dict("v-slot:$k" => true)) for (k, v) in slot]
+
+            y.binds["timeout"] = y.id * ".timeout"
+            y.binds["color"]   = y.id * ".color"
+            y.binds["content"] = y.id * ".content"
+            y.binds["v-html"]  = y.id * ".content"
+            domvalue = VueJS.dom(y, prevent_render_func = true, opts = opts)
+
+            content = []            
+            push!(content, "{{ snackbar.content }}")
+            push!(content, slot[1])
+
+            delete!(domvalue.attrs, ":value")
+            domvalue.value = content
+            domvalue["v-model"] = "$path$(y.id).value"
+
+            return domvalue
+        end
+    end
+)
+