special treatment for input and textarea fields; minor code cleanups

src/karax.nim

@@ -52,7 +52,9 @@ proc wrapEvent(d: Node; n: VNode; k: EventKind; action: EventHandler) =
     let action = action
     let n = n
     result = proc (ev: Event) =
-      action(ev, n)
+      if n.kind == VNodeKind.textarea or n.kind == VNodeKind.input:
+        keyeventBody()
+      else: action(ev, n)
 
   proc enterWrapper(): (proc (ev: Event)) =
     let action = action
@@ -189,7 +191,7 @@ proc updateStyles(newNode, oldNode: VNode) =
   oldNode.style = newNode.style
 
 proc printV(n: VNode; depth: cstring = "") =
-  kout depth, cstring($n.kind), n.myid, cstring"key ", n.key
+  kout depth, cstring($n.kind), cstring"key ", n.key
   #for k, v in pairs(n.style):
   #  kout depth, "style: ", k, v
   if n.kind == VNodeKind.component:

src/vdom.nim

@@ -120,7 +120,6 @@ type
     style*: VStyle ## the style that should be applied to the virtual node.
     dom*: Node ## the attached real DOM node. Can be 'nil' if the virtual node
                ## is not part of the virtual DOM anymore.
-    myid*: int
 
   VComponent* = ref object of VNode ## The abstract class for every karax component.
     renderImpl*: proc(self: VComponent): VNode

tests/blur.nim

@@ -4,7 +4,6 @@ type TextInput* = ref object of VComponent
   value: cstring
   isActive: bool
 
-var renderId: int
 proc render(x: VComponent): VNode =
   let self = TextInput(x)
 
@@ -37,18 +36,16 @@ proc render(x: VComponent): VNode =
     self.isActive = not self.isActive
     markDirty(self)
 
-  kout cstring"rendering ", self.myid
-  inc renderId
-  result = buildHtml(tdiv(style=style)):
-    input(style=inputStyle, value=self.value, onblur=flip, onfocus=flip)
+  proc onchanged(ev: Event; n: VNode) =
+    kout cstring"onchanged", n.value
+
+  result = buildHtml(tdiv(style=style)):
+    textarea(style=inputStyle, value=self.value, onblur=flip, onfocus=flip, onkeyup=onchanged)
 
-var gid = 0
 proc newTextInput*(style: VStyle = VStyle(); value: cstring = cstring""): TextInput =
   result = newComponent(TextInput, render)
   result.style = style
   result.value = value
-  inc gid
-  result.myid = gid
 
 proc createDom(): VNode =
   result = buildHtml(tdiv):