diff --git a/karax/karax.nim b/karax/karax.nim index 7fdcde0..2383b5b 100644 --- a/karax/karax.nim +++ b/karax/karax.nim @@ -194,8 +194,15 @@ proc toDom*(n: VNode; useAttachedNode: bool; kxi: KaraxInstance = nil): Node = result = toDom(x.expanded, useAttachedNode, kxi) attach n return result - else: - result = document.createElement(toTag[n.kind]) + else: # we are dealing with fundamental tags at this point, and not nim components/functions + if (svgElements*needingNamespace).contains(n.kind): + result = document.createElementNS(svgNamespace,toTag[n.kind]) #svg top-level elements need to be declared with a namespace + #we apply a default so that users can just treat it like html in the DSL while learning + + elif (mathElements*needingNamespace).contains(n.kind): #mathML needs a similar treatment as svg + result = document.createElementNS(mathNamespace,toTag[n.kind]) + else: + result = document.createElement(toTag[n.kind]) attach n for k in n: appendChild(result, toDom(k, useAttachedNode, kxi)) diff --git a/karax/vdom.nim b/karax/vdom.nim index 1bec42d..e1d2f58 100644 --- a/karax/vdom.nim +++ b/karax/vdom.nim @@ -67,6 +67,17 @@ type const selfClosing = {area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr} + +const + svgElements* = {animate..view} + mathElements* = {maction..semantics} + needingNamespace* = {svg,math} + +var + svgNamespace* = "http://www.w3.org/2000/svg" + mathNamespace* = "http://www.w3.org/1998/Math/MathML" + #global var settings: defaults are already set up, but may be adjusted in one shot for the user's entire project + type EventKind* {.pure.} = enum ## The events supported by the virtual DOM.