From da683b9628d3094c72bf7c279a52d9799657373f Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 14:12:44 -0600
Subject: [PATCH 01/76] Initial commit of domRef removal on vcomp

---
 ts/miso/context/dom.ts    |  12 +-
 ts/miso/context/patch.ts  |  15 ++-
 ts/miso/dom.ts            | 243 +++++++++++++++++++++++++++++---------
 ts/miso/event.ts          |  43 +++++--
 ts/miso/hydrate.ts        |  33 ++++--
 ts/miso/types.ts          |  29 +++--
 ts/spec/component.spec.ts |  79 +++++++++----
 ts/spec/dom.spec.ts       |  29 +++--
 ts/spec/event.spec.ts     |  25 ++--
 ts/spec/hydrate.spec.ts   |   4 +-
 10 files changed, 371 insertions(+), 141 deletions(-)

diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index 21cc7f794..9147ba7ec 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -7,9 +7,12 @@ import
   , HydrationContext
   , DOMRef
   , ComponentContext
-  , VTree
+  , VTree,
+  VTreeType
   } from '../types';
 
+import { drill } from '../dom'; 
+
 export const eventContext : EventContext<DOMRef> = {
   addEventListener : (mount: DOMRef, event: string, listener, capture: boolean) => {
       mount.addEventListener(event, listener, capture);
@@ -68,7 +71,12 @@ export const componentContext : ComponentContext = {
 
 export const drawingContext : DrawingContext<DOMRef> = {
   nextSibling : (node: VTree<DOMRef>) => {
-    return node.domRef.nextSibling as DOMRef;
+    switch (node.type) {
+      case VTreeType.VComp:
+        return drill(node).nextSibling as DOMRef;
+      default:
+        return node.domRef.nextSibling as DOMRef;
+    }
   },
   createTextNode : (s: string) => {
     return document.createTextNode(s) as any; // dmj: hrm
diff --git a/ts/miso/context/patch.ts b/ts/miso/context/patch.ts
index 1662b5bd2..06a5ef56e 100644
--- a/ts/miso/context/patch.ts
+++ b/ts/miso/context/patch.ts
@@ -5,9 +5,13 @@ import {
   VNode,
   NodeId,
   CSS,
-  ComponentContext
+  ComponentContext,
+  VTree,
+  VTreeType,
 } from '../types';
 
+import { drill } from '../dom'; 
+
 /*
 
   This file is used to provide testing for miso-lynx, or other patch-based architectures
@@ -93,8 +97,13 @@ export const componentContext : ComponentContext = {
 };
 
 export const patchDrawingContext : DrawingContext<NodeId> = {
-  nextSibling : (node: VNode<NodeId>) => {
-    return node.nextSibling.domRef;
+  nextSibling : (node: VTree<NodeId>) => {
+    switch (node.nextSibling.type) {
+      case VTreeType.VComp:
+        return drill(node.nextSibling) as NodeId;
+      default:
+        return node.nextSibling.domRef as NodeId;
+    }
   },
   createTextNode : (value : string) => {
       const nodeId: number = nextNodeId ();
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index ced4bf0bd..3565dbea9 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -1,23 +1,19 @@
-import { Class, DrawingContext, CSS, VNode, VText, VComp, ComponentId, VTree, Props, VTreeType } from './types';
+import { Class, DrawingContext, CSS, VNode, VText, VComp, ComponentId, VTree, Props, VTreeType, OP } from './types';
 
 /* virtual-dom diffing algorithm, applies patches as detected */
 export function diff<T>(c: VTree<T>, n: VTree<T>, parent: T, context: DrawingContext<T>): void {
-    if (!c && !n)
-        return;
-    else if (!c)
-        create(n, parent, context);
-    else if (!n)
-        destroy(c, parent, context);
+    if (!c && !n) return;
+    else if (!c) create(n, parent, context);
+    else if (!n) destroy(c, parent, context);
     else if (c.type === VTreeType.VText && n.type === VTreeType.VText) {
         diffVText(c, n, context);
     }
     else if (c.type === VTreeType.VComp && n.type === VTreeType.VComp) {
-        if (n.tag === c.tag && n.key === c.key) {
-          n.domRef = c.domRef;
-          diffAttrs(c, n, context);
-        } else {
-          replace(c, n, parent, context);
+        if (n.key === c.key) {
+          n.child = c.child;
+          return;
         }
+        replace(c, n, parent, context);
     }
     else if (c.type === VTreeType.VNode && n.type === VTreeType.VNode) {
         if (n.tag === c.tag && n.key === c.key) {
@@ -28,7 +24,7 @@ export function diff<T>(c: VTree<T>, n: VTree<T>, parent: T, context: DrawingCon
         }
     }
     else
-        replace(c, n, parent, context);
+      replace(c, n, parent, context);
 }
 
 function diffVText<T>(c: VText<T>, n: VText<T>, context : DrawingContext<T>): void {
@@ -37,6 +33,17 @@ function diffVText<T>(c: VText<T>, n: VText<T>, context : DrawingContext<T>): vo
   return;
 }
 
+export function drill<T>(c: VComp<T>): T {
+  while (c.type === VTreeType.VComp && c.child) {
+    switch (c.child.type) {
+      case VTreeType.VComp:
+        c = c.child;
+        break;
+      default:
+        return c.child.domRef;
+    }
+  }
+}
 
 // replace everything function
 function replace<T>(c: VTree<T>, n: VTree<T>, parent: T, context : DrawingContext<T>): void {
@@ -51,15 +58,35 @@ function replace<T>(c: VTree<T>, n: VTree<T>, parent: T, context : DrawingContex
   switch (n.type) {
       case VTreeType.VText:
           switch (c.type) {
+              case VTreeType.VComp:
+                context.replaceChild(parent, context.createTextNode(n.text), drill(c));
+                break;
               default:
                 n.domRef = context.createTextNode(n.text);
                 context.replaceChild(parent, n.domRef, c.domRef);
                 break;
           }
           break;
-      default:
-        context.replaceChild(parent, createElement(n, context), c.domRef as T);
-        break;
+      case VTreeType.VComp:
+          switch (c.type) {
+            case VTreeType.VComp:
+              createElement(parent, OP.REPLACE, drill(c), n, context);
+              break;
+           default:
+             createElement(parent, OP.REPLACE, c.domRef, n, context);
+             break;
+          }
+          break;
+      case VTreeType.VNode:
+        switch (c.type) {
+          case VTreeType.VComp:
+            createElement(parent, OP.REPLACE, drill(c), n, context);
+            break;
+          default:
+            createElement(parent, OP.REPLACE, c.domRef, n, context);
+            break;
+        }
+        break;    
   }
   // step 3: call destroyed hooks, call created hooks
   switch (c.type) {
@@ -82,7 +109,15 @@ function destroy<T>(c: VTree<T>, parent: T, context: DrawingContext<T>): void {
           break;
   }
   // step 2: destroy
-  context.removeChild(parent, c.domRef);
+  switch (c.type) {
+      case VTreeType.VComp:
+          context.removeChild(parent, drill(c));
+          break;
+      default:
+        context.removeChild(parent, c.domRef);
+        break;
+  }
+  // step 2: destroy
   // step 3: invoke post-hooks for vnode and vcomp
   switch (c.type) {
       case VTreeType.VText:
@@ -128,14 +163,12 @@ function callBeforeDestroyedRecursive<T>(c: VNode<T> | VComp<T>): void {
        callBeforeDestroyedRecursive(child);
 }
 
-export function diffAttrs<T>(c: VNode<T> | VComp<T> | null, n: VNode<T> | VComp<T>, context: DrawingContext<T>): void {
+export function diffAttrs<T>(c: VNode<T> | null, n: VNode<T>, context: DrawingContext<T>): void {
     diffProps(c ? c.props : {}, n.props, n.domRef, n.ns === 'svg', context);
     diffClass(c ? c.classList : null, n.classList, n.domRef, context);
     diffCss(c ? c.css : {}, n.css, n.domRef, context);
-    if (n.type === VTreeType.VNode) {
-      diffChildren(c ? c.children : [], n.children, n.domRef, context);
-      drawCanvas(n);
-    }
+    diffChildren(c ? c.children : [], n.children, n.domRef, context);
+    drawCanvas(n);
 }
 
 export function diffClass<T> (c: Class, n: Class, domRef: T, context: DrawingContext<T>): void {
@@ -252,7 +285,7 @@ function diffChildren<T>(cs: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
   }
 }
 
-function populateDomRef<T>(c: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
+function populateDomRef<T>(c: VNode<T>, context: DrawingContext<T>): void {
   if (c.ns === 'svg') {
     c.domRef = context.createElementNS('http://www.w3.org/2000/svg', c.tag);
   } else if (c.ns === 'mathml') {
@@ -263,34 +296,43 @@ function populateDomRef<T>(c: VComp<T> | VNode<T>, context: DrawingContext<T>):
 }
 
 /* used in hydrate.ts */
-export function callCreated<T>(n: VComp<T> | VNode<T>, context: DrawingContext<T>): T {
+export function callCreated<T>(parent: T, n: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
   switch (n.type) {
       case VTreeType.VComp:
           if (n.onBeforeMounted) n.onBeforeMounted();
-          mountComponent(n, context);
+          mountComponent(OP.APPEND, parent, n, null, context);
+          if (n.onMounted) n.onMounted(drill(n));          
           break;
       case VTreeType.VNode:
           if (n.onCreated) n.onCreated(n.domRef);
           break;
   }
-  return n.domRef;
 }
 
-function createElement<T>(n: VComp<T> | VNode<T>, context: DrawingContext<T>): T {
+function createElement<T>(parent : T, op: OP, replacing : T | null, n: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
   switch (n.type) {
     case VTreeType.VComp:
       if (n.onBeforeMounted) n.onBeforeMounted();
-      populateDomRef(n, context);
-      mountComponent(n, context);
+      mountComponent(op, parent, n, replacing, context);
       break;
     case VTreeType.VNode:
       if (n.onBeforeCreated) n.onBeforeCreated();
       populateDomRef(n, context);
       if (n.onCreated) n.onCreated(n.domRef);
+      diffAttrs(null, n, context);
+      switch (op) {
+        case OP.INSERT_BEFORE:
+          context.insertBefore(parent, n.domRef, replacing);
+          break;
+        case OP.APPEND:
+          context.appendChild(parent, n.domRef);
+          break;
+        case OP.REPLACE:
+          context.replaceChild(parent, n.domRef, replacing);
+          break;
+      }
       break;
   }
-  diffAttrs(null, n, context);
-  return n.domRef;
 }
 
 /* draw the canvas if you need to */
@@ -301,30 +343,111 @@ function drawCanvas<T> (c: VNode<T>) {
 
 // unmount components
 function unmountComponent<T>(c: VComp<T>): void {
-  if (c.onUnmounted) c.onUnmounted(c.domRef);
-  c.unmount(c.domRef);
+  if (c.onUnmounted) c.onUnmounted((drill(c)));
+  c.unmount(drill(c));
 }
 
 // mounts vcomp by calling into Haskell side.
 // unmount is handled with pre-destroy recursive hooks
-function mountComponent<T>(obj: VComp<T>, context: DrawingContext<T>): void {
-  obj.mount(obj, (componentId: ComponentId, componentTree: VNode<T>) => {
+function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, context: DrawingContext<T>): void {
+  n.mount(parent, (componentId: ComponentId, componentTree: VNode<T>) => {
     // mount() gives us the VTree from the Haskell side, so we just attach it here
     // to tie the knot (attach to both vdom and real dom).
-    obj.children.push(componentTree);
-    context.appendChild(obj.domRef, componentTree.domRef);
-    if (obj.onMounted) obj.onMounted(obj.domRef);
+    n.componentId = componentId;
+    n.child = componentTree;
+      if (n.onMounted) n.onMounted(drill(n));          
+      switch (op) { 
+        case OP.INSERT_BEFORE:
+          context.insertBefore(parent, drill(n), replacing);
+          break;
+        case OP.APPEND:
+          context.appendChild(parent, drill(n));
+          break;
+        case OP.REPLACE:
+          context.replaceChild(parent, drill(n), replacing);
+          break;
+      }
   });
 }
-// creates nodes on virtual and dom (vtext, vcomp, vnode)
-function create<T>(obj: VTree<T>, parent: T, context: DrawingContext<T>): void {
-  if (obj.type === VTreeType.VText) {
-    obj.domRef = context.createTextNode(obj.text);
-    context.appendChild(parent, obj.domRef);
+
+// Creates nodes on virtual dom (vtext, vcomp, vnode)
+function create<T>(n: VTree<T>, parent: T, context: DrawingContext<T>): void {
+  if (n.type === VTreeType.VText) {
+    n.domRef = context.createTextNode(n.text);
+    context.appendChild(parent, n.domRef);
   } else {
-    context.appendChild(parent, createElement(obj, context));
+    createElement(parent, OP.APPEND, null, n, context);
   }
 }
+
+function insertBefore<T>(parent: T, n: VTree<T>, o: VTree<T> | null, context: DrawingContext<T>): void {
+  switch (n.type) {
+    case VTreeType.VComp:
+      if (!o) {
+        context.insertBefore(parent, drill(n), null);
+      } else {
+        switch (o.type) {
+          case VTreeType.VComp:
+            context.insertBefore(parent, drill(n), drill(o));
+            break;
+          default:
+            context.insertBefore(parent, drill(n), o.domRef);
+            break;
+        }
+      }
+      break;
+    default:
+      if (!o) {
+        context.insertBefore(parent, n.domRef, null);
+      } else {
+        switch (o.type) {
+          case VTreeType.VComp:
+            context.insertBefore(parent, n.domRef, drill(o));
+            break;
+          default:
+            context.insertBefore(parent, n.domRef, o.domRef);
+            break;
+        }
+      }
+   }
+} 
+
+function removeChild<T>(parent: T, n: VTree<T>, context: DrawingContext<T>): void {
+  switch (n.type) {
+    case VTreeType.VComp:
+      context.removeChild(parent, drill(n));
+      break;
+    default:
+      context.removeChild(parent, n.domRef);
+      break;
+  }
+}
+
+function swapDOMRef<T>(oFirst: VTree<T>, oLast: VTree<T>, parent: T, context: DrawingContext<T>): void {
+   switch (oLast.type) {
+       case VTreeType.VComp:
+          switch (oFirst.type) {
+            case VTreeType.VComp:
+              context.swapDOMRefs(drill(oLast), drill(oFirst), parent);
+              break;
+            default:
+              context.swapDOMRefs(drill(oLast), oFirst.domRef, parent);
+              break;              
+          } 
+          break;
+        default:
+          switch (oFirst.type) {
+            case VTreeType.VComp:
+              context.swapDOMRefs(oLast.domRef, drill(oFirst), parent);
+              break;
+            default:
+              context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
+              break;              
+          }
+          break;  
+      }
+  }
+
 /* Child reconciliation algorithm, inspired by kivi and Bobril */
 function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, context: DrawingContext<T>): void {
   var oldFirstIndex: number = 0,
@@ -360,7 +483,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
       /* insertBefore's semantics will append a node if the second argument provided is `null` or `undefined`.
          Otherwise, it will insert node.domRef before oLast.domRef.
       */
-      context.insertBefore(parent, nFirst.domRef, oFirst ? oFirst.domRef : null);
+      insertBefore(parent, nFirst, oFirst, context);
       os.splice(newFirstIndex, 0, nFirst);
       newFirstIndex++;
     } /* No more new nodes, delete all remaining nodes in old list
@@ -370,7 +493,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
     else if (newFirstIndex > newLastIndex) {
       tmp = oldLastIndex;
       while (oldLastIndex >= oldFirstIndex) {
-        context.removeChild(parent, os[oldLastIndex--].domRef);
+        removeChild(parent, os[oldLastIndex--], context);
       }
       os.splice(oldFirstIndex, tmp - oldFirstIndex + 1);
       break;
@@ -392,7 +515,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
                -> [ c b a ] <- new children
       */
      else if (oFirst.key === nLast.key && nFirst.key === oLast.key) {
-      context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
+      swapDOMRef(oLast, oFirst, parent, context);
       swap<VTree<T>>(os, oldFirstIndex, oldLastIndex);
       diff(os[oldFirstIndex++], ns[newFirstIndex++], parent, context);
       diff(os[oldLastIndex--], ns[newLastIndex--], parent, context);
@@ -408,7 +531,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
         and now we happy path */
     else if (oFirst.key === nLast.key) {
       /* insertAfter */
-      context.insertBefore(parent, oFirst.domRef, context.nextSibling(oLast));
+      insertBefore(parent, oFirst, oLast.nextSibling, context);
       /* swap positions in old vdom */
       os.splice(oldLastIndex, 0, os.splice(oldFirstIndex, 1)[0]);
       diff(os[oldLastIndex--], ns[newLastIndex--], parent, context);
@@ -422,7 +545,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
          and now we happy path */
     else if (oLast.key === nFirst.key) {
       /* insertAfter */
-      context.insertBefore(parent, oLast.domRef, oFirst.domRef);
+      insertBefore(parent, oLast, oFirst, context);
       /* swap positions in old vdom */
       os.splice(oldFirstIndex, 0, os.splice(oldLastIndex, 1)[0]);
       diff(os[oldFirstIndex++], nFirst, parent, context);
@@ -463,7 +586,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
         /* optionally perform `diff` here */
         diff(os[oldFirstIndex++], nFirst, parent, context);
         /* Swap DOM references */
-        context.insertBefore(parent, node.domRef, os[oldFirstIndex].domRef);
+        insertBefore(parent, node, os[oldFirstIndex], context);
         /* increment counters */
         newFirstIndex++;
       } /* If new key was *not* found in the old map this means it must now be created, example below
@@ -480,12 +603,26 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
             switch (nFirst.type) {
               case VTreeType.VText:
                 nFirst.domRef = context.createTextNode(nFirst.text);
-                context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
+                switch (oFirst.type) {
+                  case VTreeType.VComp:
+                    context.insertBefore(parent, nFirst.domRef, drill(oFirst));
+                    break;
+                  default:
+                    context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
+                    break;
+                }
                 break;
               default:
-                context.insertBefore(parent, createElement(nFirst, context), oFirst.domRef);
-                break;
+                switch (oFirst.type) {
+                  case VTreeType.VComp:
+                    createElement(parent, OP.INSERT_BEFORE, drill(oFirst), nFirst, context);
+                    break;
+                  case VTreeType.VNode:
+                    createElement(parent, OP.INSERT_BEFORE, oFirst.domRef, nFirst, context);
+                    break;
             }
+            break;
+          }
         os.splice(oldFirstIndex++, 0, nFirst);
         newFirstIndex++;
         oldLastIndex++;
diff --git a/ts/miso/event.ts b/ts/miso/event.ts
index bbdfc7081..fbff6ba56 100644
--- a/ts/miso/event.ts
+++ b/ts/miso/event.ts
@@ -1,4 +1,5 @@
-import { EventContext, VTree, EventCapture, EventObject, Options, VTreeType } from './types';
+import { EventContext, VTree, EventCapture, EventObject, Options, VTreeType, VComp } from './types';
+import { drill } from './dom';
 
 /* event delegation algorithm */
 export function delegate<T> (
@@ -95,7 +96,19 @@ function delegateEvent <T>(
     return;
   } /* stack not length 1, recurse */
   else if (stack.length > 1) {
-      if (obj.type === VTreeType.VComp || obj.type === VTreeType.VNode) {
+      if (obj.type === VTreeType.VText) {
+        return;
+      }
+      else if (obj.type === VTreeType.VComp) {
+        if (!obj.child) {
+          if (debug) {
+            console.warn('VComp has no child property set during event delegation', obj);
+          }
+          return;
+        }
+        return delegateEvent(event, obj.child, stack, debug, context);
+      }
+      else if (obj.type === VTreeType.VNode) {
         if (context.isEqual(obj.domRef, stack[0])) {
           const eventObj: EventObject<T> = obj.events.captures[event.type];
           if (eventObj) {
@@ -111,17 +124,29 @@ function delegateEvent <T>(
           }
           stack.splice(0,1);
         }
-      for (const child of obj.children) {
-          if (child.type === VTreeType.VComp || child.type === VTreeType.VNode) {
-            if (context.isEqual(child.domRef, stack[0])) {
-              delegateEvent(event, child, stack, debug, context);
-            }
-          }
+        for (const child of obj.children) {
+           if (child.type === VTreeType.VComp) {
+             // For VComp, we need to drill to get the actual domRef
+             const childDomRef = drill(child as VComp<T>);
+             if (childDomRef && context.isEqual(childDomRef, stack[0])) {
+               delegateEvent(event, child, stack, debug, context);
+             }
+           } else if (child.type === VTreeType.VNode) {
+             if (context.isEqual(child.domRef, stack[0])) {
+               delegateEvent(event, child, stack, debug, context);
+             }
+           }
         }
       }
     } else {
+    /* stack.length === 1, we're at the target */
+    if (obj.type === VTreeType.VComp) {
+      /* VComp doesn't have events directly, delegate to its child */
+      if (obj.child) {
+        delegateEvent(event, obj.child, stack, debug, context);
+      }
+    } else if (obj.type === VTreeType.VNode) {
     /* captures run first */
-    if (obj.type === VTreeType.VNode) {
       const eventCaptureObj: EventObject<T> = obj.events.captures[event.type];
       if (eventCaptureObj && !event['captureStopped']) {
         const options: Options = eventCaptureObj.options;
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index ac81111e9..2320bd137 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -1,4 +1,4 @@
-import { callCreated, diffAttrs } from './dom';
+import { drill, callCreated, diffAttrs } from './dom';
 import { DrawingContext, HydrationContext, VTree, VComp, VText, DOMRef, VTreeType } from './types';
 
 /* prerendering / hydration / isomorphic support */
@@ -14,6 +14,14 @@ function collapseSiblingTextNodes(vs: Array<VTree<DOMRef>>): Array<VTree<DOMRef>
   return adjusted;
 }
 
+function setVCompRef(vtree: VTree<DOMRef>, node: Node): void {
+  if (vtree.type === VTreeType.VComp) {
+    setVCompRef(vtree.child, node);
+  } else {
+    vtree.domRef = node as DOMRef;
+  }
+}
+
 /* function to determine if <script> tags are present in `body` top-level
    if so we work around them */
 function preamble(mountPoint: DOMRef | Text, context : DrawingContext<DOMRef>): Node {
@@ -61,14 +69,17 @@ export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTr
     while (context.firstChild(node as DOMRef))
       drawingContext.removeChild(node as DOMRef, context.lastChild(node as DOMRef));
 
-    (vtree.domRef as Node) = node;
-
      switch (vtree.type) {
+         case VTreeType.VNode:
+            diffAttrs(null, vtree, drawingContext);
+            (vtree.domRef as Node) = node;
+            break;
          case VTreeType.VText:
-             break;
+            (vtree.domRef as Node) = node;
+            break;
          default:
-             diffAttrs(null, vtree, drawingContext);
-             break;
+            // drill(vtree) = node as DOMRef; (dmj: set vcomp here)
+            break;
      }
 
     return false;
@@ -186,7 +197,7 @@ function check(result: boolean, vtree: VTree<DOMRef>, context: HydrationContext<
     for (const child of vtree.children) {
        const value = check(result, child, context, drawingContext);
        result = result && value;
-    }
+  }
   }
   return result;
 }
@@ -198,8 +209,8 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   // We handle this in collapseSiblingTextNodes
   switch (vtree.type) {
     case VTreeType.VComp:
-      (vtree as VComp<DOMRef>).domRef = node as DOMRef;
-      callCreated(vtree, drawingContext);
+      setVCompRef(vtree, node);
+      callCreated(node, vtree, drawingContext);
       break;
     case VTreeType.VText:
       (vtree as VText<DOMRef>).domRef = node as DOMRef;
@@ -208,7 +219,7 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
       vtree.domRef = node as DOMRef;
       vtree.children = collapseSiblingTextNodes(vtree.children);
       // Fire onCreated events as though the elements had just been created.
-      callCreated(vtree, drawingContext);
+      callCreated(node, vtree, drawingContext);
 
       for (var i = 0; i < vtree.children.length; i++) {
         const vdomChild = vtree.children[i];
@@ -232,7 +243,7 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
             break;
           default:
             if (domChild.nodeType !== 1) return false;
-            vdomChild.domRef = domChild as DOMRef;
+            setVCompRef(vdomChild, domChild);
              walk(logLevel, vdomChild, domChild, context, drawingContext);
             break;
         }
diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index bc3be7eb2..f45a779ca 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -16,27 +16,36 @@ export enum VTreeType {
   VText = 2
 }
 
+export enum OP {
+  APPEND = 0,
+  REPLACE = 1,
+  INSERT_BEFORE = 2
+}
+
 export type VComp<T> = {
   type: VTreeType.VComp;
-  domRef: T;
-  ns: 'html';
-  tag: string;
+  child: VTree<T>;
+  componentId: ComponentId;
   key: string;
-  props: Props;
-  css: CSS;
-  classList: Class;
-  events: Events<T>;
+
+  // domRef: T;
+  // ns: 'html';
+  // tag: string;
+  // props: Props;
+  // css: CSS;
+  // classList: Class;
+  // events: Events<T>;
+
   parent: Parent<T>;
+  nextSibling: VTree<T>;
   children: Array<VTree<T>>;
-
   eventPropagation: boolean;
   onBeforeMounted: () => void;
   onMounted: (domRef: T) => void;
   onBeforeUnmounted: () => void;
   onUnmounted: (domRef: T) => void;
-  mount: (vcomp: VComp<T>, callback: ((componentId : ComponentId, component: VTree<T>) => void)) => void;
+  mount: (parent: T, callback: ((componentId : ComponentId, component: VTree<T>) => void)) => void;
   unmount: (e: T) => void;
-  nextSibling: VTree<T>;
 };
 
 export type VNode<T> = {
diff --git a/ts/spec/component.spec.ts b/ts/spec/component.spec.ts
index 4b140882d..314b60808 100644
--- a/ts/spec/component.spec.ts
+++ b/ts/spec/component.spec.ts
@@ -25,8 +25,10 @@ describe ('Component tests', () => {
     const build = (name, children) => {
         return vcomp<DOMRef> ({
           children: children,
-          mount: () => {
-            
+          mount: (domRef, callback) => {
+            const child = vnode<DOMRef>({ tag: 'div' });
+            diff<DOMRef>(null, child, domRef, drawingContext);
+            callback(0, child);
           },
           unmount: () => {
             unmounts.push(name);
@@ -45,19 +47,16 @@ describe ('Component tests', () => {
     var newNode = vcomp<DOMRef>({
       mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
       unmount: () => {
         unmountCount++;
       },
-      props: { id: 'vcomp-foo' },
-      css: {
-        'backgroundColor': 'red',
-      },
     });
     diff<DOMRef>(null, newNode, document.body, drawingContext);
     expect(mountCount).toBe(1);
-    expect(newNode.domRef.id).toBe('vcomp-foo');
-    expect(newNode.domRef.style['backgroundColor']).toBe('red');
     diff<DOMRef>(newNode, null, document.body, drawingContext);
     expect(unmountCount).toBe(1);
   });
@@ -65,10 +64,13 @@ describe ('Component tests', () => {
     // populate DOM
     var mountCount = 0;
     var compNode1 = vcomp<DOMRef>({
-      mount: () => {
+      key: 'comp1',
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div', css: { backgroundColor: 'red' } });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
-      css: { 'backgroundColor': 'red' },
     });
     diff<DOMRef>(null, compNode1, document.body, drawingContext);
     expect(mountCount).toBe(1);
@@ -80,10 +82,13 @@ describe ('Component tests', () => {
     // Replace node
     mountCount = 0;
     var compNode2 = vcomp<DOMRef>({
-      mount: () => {
+      key: 'comp2',
+      mount: (domRef, callback) => {
         mountCount++;
-      },
-      css: { 'backgroundColor': 'green' },
+        const child = vnode<DOMRef>({ tag: 'div', css: { backgroundColor: 'green' } });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
+      }
     });
     diff<DOMRef>(compNode1, compNode2, document.body, drawingContext);
     expect((document.body.childNodes[0] as HTMLElement).style['backgroundColor']).toBe('green');
@@ -94,12 +99,14 @@ describe ('Component tests', () => {
     var unmountCount = 0, mountCount = 0;
     var comp1 = vcomp<DOMRef>({
         key : 'a',
-        tag: 'a',
         unmount: () => {
             unmountCount++
         },
-        mount: () => {
+        mount: (domRef, callback) => {
             mountCount++;
+            const child = vnode<DOMRef>({ tag: 'a' });
+            diff<DOMRef>(null, child, domRef, drawingContext);
+            callback(0, child);
         },
     });
     // dmj: tag always 'div' for component, this is just for a test to ensure swap property
@@ -112,8 +119,11 @@ describe ('Component tests', () => {
     // Replace node
     var comp2 = vcomp<DOMRef>({
       key : 'b',
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
     });
     diff<DOMRef>(comp1, comp2, document.body, drawingContext);
@@ -131,6 +141,11 @@ describe ('Component tests', () => {
     var unmountCount = 0
     var comp1 = vcomp<DOMRef>({
       key: 'a',
+      mount: (domRef, callback) => {
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
+      },
       unmount: () => {
         unmountCount++
       }
@@ -145,8 +160,11 @@ describe ('Component tests', () => {
     var mountCount = 0;
     var comp2 = vcomp<DOMRef>({
       key : 'a',
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
     });
     diff<DOMRef>(comp1, comp2, document.body, drawingContext);
@@ -169,8 +187,11 @@ describe ('Component tests', () => {
     // Replace node
     var mountCount = 0;
     var compNode = vcomp<DOMRef>({
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
     });
     diff<DOMRef>(node, compNode, document.body, drawingContext);
@@ -191,8 +212,11 @@ describe ('Component tests', () => {
     // Replace node
     var mountCount = 0;
     var compNode = vcomp<DOMRef>({
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
     });
     diff<DOMRef>(node, compNode, document.body, drawingContext);
@@ -204,8 +228,11 @@ describe ('Component tests', () => {
   test('Should replace Component with TextNode', () => {
     var mountCount = 0, unmountCount = 0;
     var component = vcomp<DOMRef>({
-      mount: () => {
-        return mountCount++;
+      mount: (domRef, callback) => {
+        mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
       unmount: () => {
         return unmountCount++;
@@ -231,8 +258,11 @@ describe ('Component tests', () => {
     var mountCount = 0,
       unmountCount = 0;
     var component = vcomp<DOMRef>({
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
       unmount: () => {
         unmountCount++;
@@ -260,8 +290,11 @@ describe ('Component tests', () => {
     let unmountCount = 0;
 
     let component = vcomp<DOMRef>({
-      mount: () => {
+      mount: (domRef, callback) => {
         mountCount++;
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
       unmount: () => {
         unmountCount++;
diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index d166439d4..7a5fc28ad 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -438,9 +438,12 @@ describe('DOM tests', () => {
       onBeforeMounted: () => {
         beforeMounted++;
       },
-      mount: () => {
+      mount: (domRef, callback) => {
         mount++;
         mounted++; //dmj : 'onMounted' is called inside of 'mount' callback in dom.ts
+        const child = vnode<DOMRef>({ tag: 'div' });
+        diff<DOMRef>(null, child, domRef, drawingContext);
+        callback(0, child);
       },
       onBeforeUnmounted: () => {
         beforeUnmounted++;
@@ -577,7 +580,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
       expect(newNode.children[i].key).toBe(currentNode.children[i].key);
-      expect(newNode.children[i].domRef).toBe(currentNode.children[i].domRef);
+      expect((newNode.children[i] as VNode<DOMRef>).domRef).toBe((currentNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -597,7 +600,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -617,7 +620,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -637,7 +640,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -657,7 +660,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -734,7 +737,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -766,7 +769,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -796,7 +799,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -816,7 +819,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -849,7 +852,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(currentNode.children[i].key).toEqual(newNode.children[i].key);
-        expect(currentNode.children[i].domRef).toEqual(newNode.children[i].domRef);
+        expect((currentNode.children[i] as VNode<DOMRef>).domRef).toEqual((newNode.children[i] as VNode<DOMRef>).domRef);
     }
     expect(currentNode.domRef.children).toEqual(newNode.domRef.children);
     expect(currentNode.domRef.childNodes).toEqual(newNode.domRef.childNodes);
@@ -868,7 +871,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
       expect(newNode.children[i].key).toBe(currentNode.children[i].key);
-      expect(newNode.children[i].domRef).toBe(currentNode.children[i].domRef);
+      expect((newNode.children[i] as VNode<DOMRef>).domRef).toBe((currentNode.children[i] as VNode<DOMRef>).domRef);
     }
   });
 
@@ -894,7 +897,7 @@ describe('DOM tests', () => {
     expect(newNode.children.length).toBe(currentNode.children.length);
     for (var i = 0; i < newNode.children.length; i++) {
         expect(newNode.children[i].key).toBe(currentNode.children[i].key);
-        expect(newNode.children[i].domRef).toBe(currentNode.children[i].domRef);
+        expect((newNode.children[i] as VNode<DOMRef>).domRef).toBe((currentNode.children[i] as VNode<DOMRef>).domRef);
     }
   });
 
diff --git a/ts/spec/event.spec.ts b/ts/spec/event.spec.ts
index d008c664a..52c690a45 100644
--- a/ts/spec/event.spec.ts
+++ b/ts/spec/event.spec.ts
@@ -99,10 +99,9 @@ describe ('Event tests', () => {
     });
 
     var childVComp = vcomp({
-      children: [child],
       eventPropagation: true,
       mount : function (vcomp, f) {
-        diff(null, child, vcomp.domRef, drawingContext);
+        diff(null, child, vcomp, drawingContext);
         return f(0, child);
       }
     });
@@ -113,11 +112,9 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      events: events,
-      children: [parent],
-      mount : function (vcomp, f) {
-        diff(null, parent, vcomp.domRef, drawingContext);
-        return f(1, child);
+      mount : function (p, f) {
+        diff(null, parent, p, drawingContext);
+        return f(1, parent);
       }
     });
 
@@ -172,7 +169,7 @@ describe ('Event tests', () => {
       children: [child],
       eventPropagation: false,
       mount : function (vcomp, f) {
-        diff(null, child, vcomp.domRef, drawingContext);
+        diff(null, child, vcomp, drawingContext);
         return f(0, child);
       }
     });
@@ -183,10 +180,9 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      events: events,
       children: [parent],
       mount : function (vcomp, f) {
-        diff(null, parent, vcomp.domRef, drawingContext);
+        diff(null, parent, vcomp, drawingContext);
         return f(1, child);
       }
     });
@@ -241,8 +237,8 @@ describe ('Event tests', () => {
     var childVComp = vcomp({
       children: [child],
       eventPropagation: true,
-      mount : function (vcomp, f) {
-        diff(null, child, vcomp.domRef, drawingContext);
+      mount : function (p: DOMRef, f) {
+        diff(null, child, p, drawingContext);
         return f(0, child);
       }
     });
@@ -253,10 +249,9 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      events: events,
       children: [parent],
-      mount : function (vcomp, f) {
-        diff(null, parent, vcomp.domRef, drawingContext);
+      mount : function (p: DOMRef, f) {
+        diff(null, parent, p, drawingContext);
         return f(1, child);
       }
     });
diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index 308509043..fd7e15ffe 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -1,7 +1,7 @@
 /* imports */
 import { hydrate, integrityCheck } from '../miso/hydrate';
 import { vnode, vtext, vnodeKids } from '../miso/smart';
-import { VText, DOMRef } from '../miso/types';
+import { VText, VNode, DOMRef } from '../miso/types';
 import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { hydrationContext, drawingContext } from '../miso/context/dom';
 
@@ -348,7 +348,7 @@ describe ("Hydration tests", () => {
     const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
     expect(result).toEqual(true);
     expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(true);
-    tree.children[0].domRef = document.createElement('div');
+    (tree.children[0] as VNode<DOMRef>).domRef = document.createElement('div');
     expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(false);
   });
 

From 59bab560aadd29bb773908363afaa48f8f4a11b5 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 14:15:11 -0600
Subject: [PATCH 02/76] lint

---
 ts/miso/context/patch.ts | 1 -
 ts/miso/hydrate.ts       | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/ts/miso/context/patch.ts b/ts/miso/context/patch.ts
index 06a5ef56e..5acdc79f6 100644
--- a/ts/miso/context/patch.ts
+++ b/ts/miso/context/patch.ts
@@ -2,7 +2,6 @@ import {
   ComponentId,
   EventCapture,
   DrawingContext,
-  VNode,
   NodeId,
   CSS,
   ComponentContext,
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 2320bd137..ae343cc2e 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -1,5 +1,5 @@
-import { drill, callCreated, diffAttrs } from './dom';
-import { DrawingContext, HydrationContext, VTree, VComp, VText, DOMRef, VTreeType } from './types';
+import { callCreated, diffAttrs } from './dom';
+import { DrawingContext, HydrationContext, VTree, VText, DOMRef, VTreeType } from './types';
 
 /* prerendering / hydration / isomorphic support */
 function collapseSiblingTextNodes(vs: Array<VTree<DOMRef>>): Array<VTree<DOMRef>> {

From b435cb4ffcb5810fba48559700ab882e3f4dcb85 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 14:19:08 -0600
Subject: [PATCH 03/76] Address watch warnings

---
 ts/miso/hydrate.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index ae343cc2e..c73197d64 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -128,7 +128,7 @@ function check(result: boolean, vtree: VTree<DOMRef>, context: HydrationContext<
       result = false;
     }
   } // if vnode / vcomp, must be the same
-  else {
+  else if (vtree.type === VTreeType.VNode) {
     // tags must be identical
     if (vtree.tag.toUpperCase() !== context.getTag(vtree.domRef).toUpperCase()) {
       console.warn(

From 3903d9fa5fc3008d7096d210514ac0a8bb2b8130 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Wed, 10 Dec 2025 14:55:58 -0600
Subject: [PATCH 04/76] Regen JS

---
 js/miso.js      | 273 +++++++++++++++++++++++++++++++++++++++---------
 js/miso.prod.js |   2 +-
 2 files changed, 222 insertions(+), 53 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 9ec4920f1..b2c800a21 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -9,12 +9,11 @@ function diff(c, n, parent, context) {
   else if (c.type === 2 /* VText */ && n.type === 2 /* VText */) {
     diffVText(c, n, context);
   } else if (c.type === 0 /* VComp */ && n.type === 0 /* VComp */) {
-    if (n.tag === c.tag && n.key === c.key) {
-      n.domRef = c.domRef;
-      diffAttrs(c, n, context);
-    } else {
-      replace(c, n, parent, context);
+    if (n.key === c.key) {
+      n.child = c.child;
+      return;
     }
+    replace(c, n, parent, context);
   } else if (c.type === 1 /* VNode */ && n.type === 1 /* VNode */) {
     if (n.tag === c.tag && n.key === c.key) {
       n.domRef = c.domRef;
@@ -31,6 +30,17 @@ function diffVText(c, n, context) {
   n.domRef = c.domRef;
   return;
 }
+function drill(c) {
+  while (c.type === 0 /* VComp */ && c.child) {
+    switch (c.child.type) {
+      case 0 /* VComp */:
+        c = c.child;
+        break;
+      default:
+        return c.child.domRef;
+    }
+  }
+}
 function replace(c, n, parent, context) {
   switch (c.type) {
     case 2 /* VText */:
@@ -42,14 +52,34 @@ function replace(c, n, parent, context) {
   switch (n.type) {
     case 2 /* VText */:
       switch (c.type) {
+        case 0 /* VComp */:
+          context.replaceChild(parent, context.createTextNode(n.text), drill(c));
+          break;
         default:
           n.domRef = context.createTextNode(n.text);
           context.replaceChild(parent, n.domRef, c.domRef);
           break;
       }
       break;
-    default:
-      context.replaceChild(parent, createElement(n, context), c.domRef);
+    case 0 /* VComp */:
+      switch (c.type) {
+        case 0 /* VComp */:
+          createElement(parent, 1 /* REPLACE */, drill(c), n, context);
+          break;
+        default:
+          createElement(parent, 1 /* REPLACE */, c.domRef, n, context);
+          break;
+      }
+      break;
+    case 1 /* VNode */:
+      switch (c.type) {
+        case 0 /* VComp */:
+          createElement(parent, 1 /* REPLACE */, drill(c), n, context);
+          break;
+        default:
+          createElement(parent, 1 /* REPLACE */, c.domRef, n, context);
+          break;
+      }
       break;
   }
   switch (c.type) {
@@ -68,7 +98,14 @@ function destroy(c, parent, context) {
       callBeforeDestroyedRecursive(c);
       break;
   }
-  context.removeChild(parent, c.domRef);
+  switch (c.type) {
+    case 0 /* VComp */:
+      context.removeChild(parent, drill(c));
+      break;
+    default:
+      context.removeChild(parent, c.domRef);
+      break;
+  }
   switch (c.type) {
     case 2 /* VText */:
       break;
@@ -115,10 +152,8 @@ function diffAttrs(c, n, context) {
   diffProps(c ? c.props : {}, n.props, n.domRef, n.ns === "svg", context);
   diffClass(c ? c.classList : null, n.classList, n.domRef, context);
   diffCss(c ? c.css : {}, n.css, n.domRef, context);
-  if (n.type === 1 /* VNode */) {
-    diffChildren(c ? c.children : [], n.children, n.domRef, context);
-    drawCanvas(n);
-  }
+  diffChildren(c ? c.children : [], n.children, n.domRef, context);
+  drawCanvas(n);
 }
 function diffClass(c, n, domRef, context) {
   if (!c && !n) {
@@ -226,27 +261,27 @@ function populateDomRef(c, context) {
     c.domRef = context.createElement(c.tag);
   }
 }
-function callCreated(n, context) {
+function callCreated(parent, n, context) {
   switch (n.type) {
     case 0 /* VComp */:
       if (n.onBeforeMounted)
         n.onBeforeMounted();
-      mountComponent(n, context);
+      mountComponent(0 /* APPEND */, parent, n, null, context);
+      if (n.onMounted)
+        n.onMounted(drill(n));
       break;
     case 1 /* VNode */:
       if (n.onCreated)
         n.onCreated(n.domRef);
       break;
   }
-  return n.domRef;
 }
-function createElement(n, context) {
+function createElement(parent, op, replacing, n, context) {
   switch (n.type) {
     case 0 /* VComp */:
       if (n.onBeforeMounted)
         n.onBeforeMounted();
-      populateDomRef(n, context);
-      mountComponent(n, context);
+      mountComponent(op, parent, n, replacing, context);
       break;
     case 1 /* VNode */:
       if (n.onBeforeCreated)
@@ -254,10 +289,20 @@ function createElement(n, context) {
       populateDomRef(n, context);
       if (n.onCreated)
         n.onCreated(n.domRef);
+      diffAttrs(null, n, context);
+      switch (op) {
+        case 2 /* INSERT_BEFORE */:
+          context.insertBefore(parent, n.domRef, replacing);
+          break;
+        case 0 /* APPEND */:
+          context.appendChild(parent, n.domRef);
+          break;
+        case 1 /* REPLACE */:
+          context.replaceChild(parent, n.domRef, replacing);
+          break;
+      }
       break;
   }
-  diffAttrs(null, n, context);
-  return n.domRef;
 }
 function drawCanvas(c) {
   if (c.tag === "canvas" && c.draw)
@@ -265,23 +310,99 @@ function drawCanvas(c) {
 }
 function unmountComponent(c) {
   if (c.onUnmounted)
-    c.onUnmounted(c.domRef);
-  c.unmount(c.domRef);
+    c.onUnmounted(drill(c));
+  c.unmount(drill(c));
 }
-function mountComponent(obj, context) {
-  obj.mount(obj, (componentId, componentTree) => {
-    obj.children.push(componentTree);
-    context.appendChild(obj.domRef, componentTree.domRef);
-    if (obj.onMounted)
-      obj.onMounted(obj.domRef);
+function mountComponent(op, parent, n, replacing, context) {
+  n.mount(parent, (componentId, componentTree) => {
+    n.componentId = componentId;
+    n.child = componentTree;
+    if (n.onMounted)
+      n.onMounted(drill(n));
+    switch (op) {
+      case 2 /* INSERT_BEFORE */:
+        context.insertBefore(parent, drill(n), replacing);
+        break;
+      case 0 /* APPEND */:
+        context.appendChild(parent, drill(n));
+        break;
+      case 1 /* REPLACE */:
+        context.replaceChild(parent, drill(n), replacing);
+        break;
+    }
   });
 }
-function create(obj, parent, context) {
-  if (obj.type === 2 /* VText */) {
-    obj.domRef = context.createTextNode(obj.text);
-    context.appendChild(parent, obj.domRef);
+function create(n, parent, context) {
+  if (n.type === 2 /* VText */) {
+    n.domRef = context.createTextNode(n.text);
+    context.appendChild(parent, n.domRef);
   } else {
-    context.appendChild(parent, createElement(obj, context));
+    createElement(parent, 0 /* APPEND */, null, n, context);
+  }
+}
+function insertBefore(parent, n, o, context) {
+  switch (n.type) {
+    case 0 /* VComp */:
+      if (!o) {
+        context.insertBefore(parent, drill(n), null);
+      } else {
+        switch (o.type) {
+          case 0 /* VComp */:
+            context.insertBefore(parent, drill(n), drill(o));
+            break;
+          default:
+            context.insertBefore(parent, drill(n), o.domRef);
+            break;
+        }
+      }
+      break;
+    default:
+      if (!o) {
+        context.insertBefore(parent, n.domRef, null);
+      } else {
+        switch (o.type) {
+          case 0 /* VComp */:
+            context.insertBefore(parent, n.domRef, drill(o));
+            break;
+          default:
+            context.insertBefore(parent, n.domRef, o.domRef);
+            break;
+        }
+      }
+  }
+}
+function removeChild(parent, n, context) {
+  switch (n.type) {
+    case 0 /* VComp */:
+      context.removeChild(parent, drill(n));
+      break;
+    default:
+      context.removeChild(parent, n.domRef);
+      break;
+  }
+}
+function swapDOMRef(oFirst, oLast, parent, context) {
+  switch (oLast.type) {
+    case 0 /* VComp */:
+      switch (oFirst.type) {
+        case 0 /* VComp */:
+          context.swapDOMRefs(drill(oLast), drill(oFirst), parent);
+          break;
+        default:
+          context.swapDOMRefs(drill(oLast), oFirst.domRef, parent);
+          break;
+      }
+      break;
+    default:
+      switch (oFirst.type) {
+        case 0 /* VComp */:
+          context.swapDOMRefs(oLast.domRef, drill(oFirst), parent);
+          break;
+        default:
+          context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
+          break;
+      }
+      break;
   }
 }
 function syncChildren(os, ns, parent, context) {
@@ -296,13 +417,13 @@ function syncChildren(os, ns, parent, context) {
     oLast = os[oldLastIndex];
     if (oldFirstIndex > oldLastIndex) {
       diff(null, nFirst, parent, context);
-      context.insertBefore(parent, nFirst.domRef, oFirst ? oFirst.domRef : null);
+      insertBefore(parent, nFirst, oFirst, context);
       os.splice(newFirstIndex, 0, nFirst);
       newFirstIndex++;
     } else if (newFirstIndex > newLastIndex) {
       tmp = oldLastIndex;
       while (oldLastIndex >= oldFirstIndex) {
-        context.removeChild(parent, os[oldLastIndex--].domRef);
+        removeChild(parent, os[oldLastIndex--], context);
       }
       os.splice(oldFirstIndex, tmp - oldFirstIndex + 1);
       break;
@@ -311,16 +432,16 @@ function syncChildren(os, ns, parent, context) {
     } else if (oLast.key === nLast.key) {
       diff(os[oldLastIndex--], ns[newLastIndex--], parent, context);
     } else if (oFirst.key === nLast.key && nFirst.key === oLast.key) {
-      context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
+      swapDOMRef(oLast, oFirst, parent, context);
       swap(os, oldFirstIndex, oldLastIndex);
       diff(os[oldFirstIndex++], ns[newFirstIndex++], parent, context);
       diff(os[oldLastIndex--], ns[newLastIndex--], parent, context);
     } else if (oFirst.key === nLast.key) {
-      context.insertBefore(parent, oFirst.domRef, context.nextSibling(oLast));
+      insertBefore(parent, oFirst, oLast.nextSibling, context);
       os.splice(oldLastIndex, 0, os.splice(oldFirstIndex, 1)[0]);
       diff(os[oldLastIndex--], ns[newLastIndex--], parent, context);
     } else if (oLast.key === nFirst.key) {
-      context.insertBefore(parent, oLast.domRef, oFirst.domRef);
+      insertBefore(parent, oLast, oFirst, context);
       os.splice(oldFirstIndex, 0, os.splice(oldLastIndex, 1)[0]);
       diff(os[oldFirstIndex++], nFirst, parent, context);
       newFirstIndex++;
@@ -338,16 +459,30 @@ function syncChildren(os, ns, parent, context) {
       if (found) {
         os.splice(oldFirstIndex, 0, os.splice(tmp, 1)[0]);
         diff(os[oldFirstIndex++], nFirst, parent, context);
-        context.insertBefore(parent, node.domRef, os[oldFirstIndex].domRef);
+        insertBefore(parent, node, os[oldFirstIndex], context);
         newFirstIndex++;
       } else {
         switch (nFirst.type) {
           case 2 /* VText */:
             nFirst.domRef = context.createTextNode(nFirst.text);
-            context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
+            switch (oFirst.type) {
+              case 0 /* VComp */:
+                context.insertBefore(parent, nFirst.domRef, drill(oFirst));
+                break;
+              default:
+                context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
+                break;
+            }
             break;
           default:
-            context.insertBefore(parent, createElement(nFirst, context), oFirst.domRef);
+            switch (oFirst.type) {
+              case 0 /* VComp */:
+                createElement(parent, 2 /* INSERT_BEFORE */, drill(oFirst), nFirst, context);
+                break;
+              case 1 /* VNode */:
+                createElement(parent, 2 /* INSERT_BEFORE */, oFirst.domRef, nFirst, context);
+                break;
+            }
             break;
         }
         os.splice(oldFirstIndex++, 0, nFirst);
@@ -415,7 +550,17 @@ function delegateEvent(event, obj, stack, debug, context) {
     }
     return;
   } else if (stack.length > 1) {
-    if (obj.type === 0 /* VComp */ || obj.type === 1 /* VNode */) {
+    if (obj.type === 2 /* VText */) {
+      return;
+    } else if (obj.type === 0 /* VComp */) {
+      if (!obj.child) {
+        if (debug) {
+          console.warn("VComp has no child property set during event delegation", obj);
+        }
+        return;
+      }
+      return delegateEvent(event, obj.child, stack, debug, context);
+    } else if (obj.type === 1 /* VNode */) {
       if (context.isEqual(obj.domRef, stack[0])) {
         const eventObj = obj.events.captures[event.type];
         if (eventObj) {
@@ -432,7 +577,12 @@ function delegateEvent(event, obj, stack, debug, context) {
         stack.splice(0, 1);
       }
       for (const child of obj.children) {
-        if (child.type === 0 /* VComp */ || child.type === 1 /* VNode */) {
+        if (child.type === 0 /* VComp */) {
+          const childDomRef = drill(child);
+          if (childDomRef && context.isEqual(childDomRef, stack[0])) {
+            delegateEvent(event, child, stack, debug, context);
+          }
+        } else if (child.type === 1 /* VNode */) {
           if (context.isEqual(child.domRef, stack[0])) {
             delegateEvent(event, child, stack, debug, context);
           }
@@ -440,7 +590,11 @@ function delegateEvent(event, obj, stack, debug, context) {
       }
     }
   } else {
-    if (obj.type === 1 /* VNode */) {
+    if (obj.type === 0 /* VComp */) {
+      if (obj.child) {
+        delegateEvent(event, obj.child, stack, debug, context);
+      }
+    } else if (obj.type === 1 /* VNode */) {
       const eventCaptureObj = obj.events.captures[event.type];
       if (eventCaptureObj && !event["captureStopped"]) {
         const options = eventCaptureObj.options;
@@ -549,6 +703,13 @@ function collapseSiblingTextNodes(vs) {
   }
   return adjusted;
 }
+function setVCompRef(vtree, node) {
+  if (vtree.type === 0 /* VComp */) {
+    setVCompRef(vtree.child, node);
+  } else {
+    vtree.domRef = node;
+  }
+}
 function preamble(mountPoint, context) {
   var mountChildIdx = 0, node;
   var root = context.getRoot();
@@ -580,12 +741,15 @@ function hydrate(logLevel, mountPoint, vtree, context, drawingContext) {
     }
     while (context.firstChild(node))
       drawingContext.removeChild(node, context.lastChild(node));
-    vtree.domRef = node;
     switch (vtree.type) {
+      case 1 /* VNode */:
+        diffAttrs(null, vtree, drawingContext);
+        vtree.domRef = node;
+        break;
       case 2 /* VText */:
+        vtree.domRef = node;
         break;
       default:
-        diffAttrs(null, vtree, drawingContext);
         break;
     }
     return false;
@@ -626,7 +790,7 @@ function check(result, vtree, context, drawingContext) {
       console.warn("VText node content differs", vtree);
       result = false;
     }
-  } else {
+  } else if (vtree.type === 1 /* VNode */) {
     if (vtree.tag.toUpperCase() !== context.getTag(vtree.domRef).toUpperCase()) {
       console.warn("Integrity check failed, tags differ", vtree.tag.toUpperCase(), context.getTag(vtree.domRef));
       result = false;
@@ -678,8 +842,8 @@ function check(result, vtree, context, drawingContext) {
 function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
-      vtree.domRef = node;
-      callCreated(vtree, drawingContext);
+      setVCompRef(vtree, node);
+      callCreated(node, vtree, drawingContext);
       break;
     case 2 /* VText */:
       vtree.domRef = node;
@@ -687,7 +851,7 @@ function walk(logLevel, vtree, node, context, drawingContext) {
     case 1 /* VNode */:
       vtree.domRef = node;
       vtree.children = collapseSiblingTextNodes(vtree.children);
-      callCreated(vtree, drawingContext);
+      callCreated(node, vtree, drawingContext);
       for (var i = 0;i < vtree.children.length; i++) {
         const vdomChild = vtree.children[i];
         const domChild = node.childNodes[i];
@@ -711,7 +875,7 @@ function walk(logLevel, vtree, node, context, drawingContext) {
           default:
             if (domChild.nodeType !== 1)
               return false;
-            vdomChild.domRef = domChild;
+            setVCompRef(vdomChild, domChild);
             walk(logLevel, vdomChild, domChild, context, drawingContext);
             break;
         }
@@ -970,7 +1134,12 @@ var componentContext = {
 };
 var drawingContext = {
   nextSibling: (node) => {
-    return node.domRef.nextSibling;
+    switch (node.type) {
+      case 0 /* VComp */:
+        return drill(node).nextSibling;
+      default:
+        return node.domRef.nextSibling;
+    }
   },
   createTextNode: (s) => {
     return document.createTextNode(s);
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 8508c8121..3f0ddd272 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function J(G,K,Q,X){if(!G&&!K)return;else if(!G)WG(K,Q,X);else if(!K)QG(G,Q,X);else if(G.type===2&&K.type===2)KG(G,K,X);else if(G.type===0&&K.type===0)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,A(G,K,X);else E(G,K,Q,X);else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,A(G,K,X);else E(G,K,Q,X);else E(G,K,Q,X)}function KG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G,K,Q,X){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){default:K.domRef=X.createTextNode(K.text),X.replaceChild(Q,K.domRef,G.domRef);break}break;default:X.replaceChild(Q,O(K,X),G.domRef);break}switch(G.type){case 2:break;default:N(G);break}}function QG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,G.domRef),G.type){case 2:break;default:N(G);break}}function N(G){UG(G);for(let K of G.children)if(K.type===1||K.type===0)N(K)}function UG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)HG(G)}function XG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){XG(G);for(let K of G.children)if(K.type===1||K.type===0)S(K)}function A(G,K,Q){if(ZG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),YG(G?G.classList:null,K.classList,K.domRef,Q),_G(G?G.css:{},K.css,K.domRef,Q),K.type===1)qG(G?G.children:[],K.children,K.domRef,Q),zG(K)}function YG(G,K,Q,X){if(!G&&!K)return;if(!G){for(let U of K)X.addClass(U,Q);return}if(!K){for(let U of G)X.removeClass(U,Q);return}for(let U of G)if(!K.has(U))X.removeClass(U,Q);for(let U of K)if(!G.has(U))X.addClass(U,Q);return}function ZG(G,K,Q,X,U){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(X||!(Y in Q)||Y==="disabled")U.removeAttribute(Q,Y);else U.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(X)if(Y==="href")U.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else U.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else U.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],X)if(Y==="href")U.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else U.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else U.setAttribute(Q,Y,Z)}}function _G(G,K,Q,X){X.setInlineStyle(G,K,Q)}function $G(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function qG(G,K,Q,X){if($G(G,K))JG(G,K,Q,X);else for(let U=0;U<Math.max(K.length,G.length);U++)J(G[U],K[U],Q,X)}function l(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function M(G,K){switch(G.type){case 0:if(G.onBeforeMounted)G.onBeforeMounted();x(G,K);break;case 1:if(G.onCreated)G.onCreated(G.domRef);break}return G.domRef}function O(G,K){switch(G.type){case 0:if(G.onBeforeMounted)G.onBeforeMounted();l(G,K),x(G,K);break;case 1:if(G.onBeforeCreated)G.onBeforeCreated();if(l(G,K),G.onCreated)G.onCreated(G.domRef);break}return A(null,G,K),G.domRef}function zG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function HG(G){if(G.onUnmounted)G.onUnmounted(G.domRef);G.unmount(G.domRef)}function x(G,K){G.mount(G,(Q,X)=>{if(G.children.push(X),K.appendChild(G.domRef,X.domRef),G.onMounted)G.onMounted(G.domRef)})}function WG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else Q.appendChild(K,O(G,Q))}function JG(G,K,Q,X){var U=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,W,B,i;for(;;){if(Z>_&&U>Y)break;if(q=K[Z],$=K[_],W=G[U],H=G[Y],U>Y)J(null,q,Q,X),X.insertBefore(Q,q.domRef,W?W.domRef:null),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=U)X.removeChild(Q,G[Y--].domRef);G.splice(U,z-U+1);break}else if(W.key===q.key)J(G[U++],K[Z++],Q,X);else if(H.key===$.key)J(G[Y--],K[_--],Q,X);else if(W.key===$.key&&q.key===H.key)X.swapDOMRefs(H.domRef,W.domRef,Q),AG(G,U,Y),J(G[U++],K[Z++],Q,X),J(G[Y--],K[_--],Q,X);else if(W.key===$.key)X.insertBefore(Q,W.domRef,X.nextSibling(H)),G.splice(Y,0,G.splice(U,1)[0]),J(G[Y--],K[_--],Q,X);else if(H.key===q.key)X.insertBefore(Q,H.domRef,W.domRef),G.splice(U,0,G.splice(Y,1)[0]),J(G[U++],q,Q,X),Z++;else{B=!1,z=U;while(z<=Y){if(G[z].key===q.key){B=!0,i=G[z];break}z++}if(B)G.splice(U,0,G.splice(z,1)[0]),J(G[U++],q,Q,X),X.insertBefore(Q,i.domRef,G[U].domRef),Z++;else{switch(q.type){case 2:q.domRef=X.createTextNode(q.text),X.insertBefore(Q,q.domRef,W.domRef);break;default:X.insertBefore(Q,O(q,X),W.domRef);break}G.splice(U++,0,q),Z++,Y++}}}}function AG(G,K,Q){let X=G[K];G[K]=G[Q],G[Q]=X}function P(G,K,Q,X,U){for(let Z of K)U.addEventListener(G,Z.name,function(Y){a(Y,G,Q,X,U)},Z.capture)}function L(G,K,Q,X,U){for(let Z of K)U.removeEventListener(G,Z.name,function(Y){a(Y,G,Q,X,U)},Z.capture)}function a(G,K,Q,X,U){Q(function(Z){if(Array.isArray(G))for(let Y of G)d(Y,Z,K,X,U);else d(G,Z,K,X,U)})}function d(G,K,Q,X,U){var Z=U.getTarget(G);if(Z){let Y=DG(Q,Z,U);r(G,K,Y,X,U)}}function DG(G,K,Q){var X=[];while(!Q.isEqual(G,K))if(X.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return X;return X}function r(G,K,Q,X,U){if(!Q.length){if(X)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===0||K.type===1){if(U.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0||Z.type===1){if(U.isEqual(Z.domRef,Q[0]))r(G,Z,Q,X,U)}}}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(U.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(U.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)p(K.parent,G)}}else if(!G.captureStopped)p(K.parent,G)}}function p(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let X=Q.options;if(X.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),X.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function D(G,K){if(typeof G[0]==="object"){var Q=[];for(var X=0;X<G.length;X++)Q.push(D(G[X],K));return Q}for(let _ of G)K=K[_];var U;if(K instanceof Array||"length"in K&&K.localName!=="select"){U=[];for(var Z=0;Z<K.length;Z++)U.push(D([],K[Z]));return U}U={};for(var Y in BG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")U[Y]=K[Y]}return U}function BG(G){var K={},Q=0;do{var X=Object.getOwnPropertyNames(G);for(Q=0;Q<X.length;Q++)K[X[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function EG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var X=1;X<G.length;X++){if(Q[K].type===2&&G[X].type===2){Q[K].text+=G[X].text;continue}Q[++K]=G[X]}return Q}function RG(G,K){var Q=0,X,U=K.getRoot();if(!G)if(U.childNodes.length>0)X=U.firstChild;else X=U.appendChild(K.createElement("div"));else if(G.childNodes.length===0)X=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])X=U.appendChild(K.createElement("div"));else X=G.childNodes[Q]}return X}function V(G,K,Q,X,U){let Z=RG(K,U);if(!o(G,Q,Z,X,U)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(X.firstChild(Z))U.removeChild(Z,X.lastChild(Z));switch(Q.domRef=Z,Q.type){case 2:break;default:A(null,Q,U);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function F(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function s(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function I(G,K,Q){return c(!0,G,K,Q)}function c(G,K,Q,X){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else{if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let U in K.props)if(U==="href"||U==="src"){let Z=window.location.origin+"/"+K.props[U],Y=Q.getAttribute(K.domRef,U),_=K.props[U];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+U+" differs",K.props[U],Q.getAttribute(K.domRef,U)),G=!1}else if(U==="height"||U==="width"){if(parseFloat(K.props[U])!==parseFloat(Q.getAttribute(K.domRef,U)))console.warn("Property "+U+" differs",K.props[U],Q.getAttribute(K.domRef,U)),G=!1}else if(U==="class"||U==="className"){if(K.props[U]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[U],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[U]!==Q.getAttribute(K.domRef,U))console.warn("Property "+U+" differs",K.props[U],Q.getAttribute(K.domRef,U)),G=!1;for(let U in K.css)if(U==="color"){if(s(Q.getInlineStyle(K.domRef,U)).toString()!==s(K.css[U]).toString())console.warn("Style "+U+" differs",K.css[U],Q.getInlineStyle(K.domRef,U)),G=!1}else if(K.css[U]!==Q.getInlineStyle(K.domRef,U))console.warn("Style "+U+" differs",K.css[U],Q.getInlineStyle(K.domRef,U)),G=!1;for(let U of K.children){let Z=c(G,U,Q,X);G=G&&Z}}return G}function o(G,K,Q,X,U){switch(K.type){case 0:K.domRef=Q,M(K,U);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=EG(K.children),M(K,U);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return F(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return F(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=X.children(Q)[Z];else return F(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;Y.domRef=_,o(G,Y,_,X,U);break}}}return!0}var w="1.9.0.0";function f(G,K){var Q=function(){var X=document.getElementById(G);if(X&&X.focus)X.focus()};K>0?setTimeout(Q,K):Q()}function C(G,K){var Q=function(){var X=document.getElementById(G);if(X&&X.blur)X.blur()};K>0?setTimeout(Q,K):Q()}function j(G,K){var Q=function(){var X=document.getElementById(G);if(X&&typeof X.select==="function")X.select()};K>0?setTimeout(Q,K):Q()}function k(G,K,Q,X){var U=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};X>0?setTimeout(U,X):U()}function T(G,K,Q,X,U,Z,Y){var _={method:K,headers:X};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,W]of $.headers)z[H]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return U({error:null,body:null,headers:z,status:q})}).then(($)=>U({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function b(G){var K=function(Q){let X=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){X=Q.parentNode.componentId;break}Q=Q.parentNode}return X};return K(G)}function g(G,K,Q,X,U,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(X)X($.data);return}let H=JSON.parse($.data);if(U)U(H)}catch(H){if(z&&X)X($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function h(G){if(G)G.close(),G=null}function u(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function y(G,K,Q,X,U,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){U("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(X)X(z)}catch(z){if(Z&&Q)Q(_.data);else U(z.message)}},Y}catch(Y){U(Y.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let X of Q.trim().split(" "))if(X)G.classList.add(X)}var n={addEventListener:(G,K,Q,X)=>{G.addEventListener(K,Q,X)},removeEventListener:(G,K,Q,X)=>{G.removeEventListener(K,Q,X)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},t={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},e={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},GG={nextSibling:(G)=>{return G.domRef.nextSibling},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let X=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,X);return},setInlineStyle:(G,K,Q)=>{var X;for(let U in G)if(X=K[U],!X)if(U in Q.style)Q.style[U]="";else Q.style.setProperty(U,"");else if(X!==G[U])if(U in Q.style)Q.style[U]=X;else Q.style.setProperty(U,X);for(let U in K){if(G&&G[U])continue;if(U in Q.style)Q.style[U]=K[U];else Q.style.setProperty(U,K[U])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,X)=>{return G.setAttributeNS(K,Q,X)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:t,eventContext:n,drawingContext:GG,componentContext:e,diff:J,hydrate:V,version:w,delegate:P,callBlur:C,callFocus:f,callSelect:j,callSetSelectionRange:k,eventJSON:D,fetchCore:T,eventSourceConnect:y,eventSourceClose:m,websocketConnect:g,websocketClose:h,websocketSend:u,undelegate:L,populateClass:v,getParentComponentId:b,integrityCheck:I,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}L(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,S(G,K,U);else L(G,K,Q,U);else L(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function L(G,K,Q,U){switch(G.type){case 2:break;default:O(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:I(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:O(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:I(G);break}}function I(G){YG(G);for(let K of G.children)if(K.type===1||K.type===0)I(K)}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function O(G){ZG(G);for(let K of G.children)if(K.type===1||K.type===0)O(K)}function S(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))EG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(S(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(z(G))}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function E(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function RG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function EG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,M,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),E(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)RG(J,W,Q,U),NG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)E(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)E(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{M=!1,H=X;while(H<=Y){if(G[H].key===q.key){M=!0,p=G[H];break}H++}if(M)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),E(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function NG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function R(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(R(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(R([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function f(G,K){if(G.type===0)f(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:S(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:f(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;f(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:C,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:T,callSetSelectionRange:h,eventJSON:R,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From bf174cb4f6e38da2e90502f9038bc3ce2185da30 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Wed, 10 Dec 2025 14:56:17 -0600
Subject: [PATCH 05/76] Drop namespace, tag from `VComp`. Add mount combos.

- [x] Add `mount`, `mount_`, `+>`
- [x] Update `Miso.Html.Render`.
---
 src/Miso.hs             |  4 +--
 src/Miso/Html/Render.hs |  4 +--
 src/Miso/Runtime.hs     |  6 ++---
 src/Miso/Types.hs       | 55 ++++++++++++++++++++++++++++++-----------
 ts/miso/types.ts        |  8 ------
 5 files changed, 48 insertions(+), 29 deletions(-)

diff --git a/src/Miso.hs b/src/Miso.hs
index 3668b241e..fecc76665 100644
--- a/src/Miso.hs
+++ b/src/Miso.hs
@@ -181,8 +181,8 @@ initComponent
   => Component parent model action
   -> JSM (ComponentState model action)
 initComponent vcomp@Component {..} = do
-  mount <- mountElement (getMountPoint mountPoint)
-  initialize Draw isRoot vcomp (pure mount)
+  root <- mountElement (getMountPoint mountPoint)
+  initialize Draw isRoot vcomp (pure root)
 ----------------------------------------------------------------------------
 isRoot :: Bool
 isRoot = True
diff --git a/src/Miso/Html/Render.hs b/src/Miso/Html/Render.hs
index 2af281e40..db79a27d0 100644
--- a/src/Miso/Html/Render.hs
+++ b/src/Miso/Html/Render.hs
@@ -96,8 +96,8 @@ renderBuilder (VNode ns tag attrs children) = mconcat
               , ns == MATHML
               ]
 
-renderBuilder (VComp ns tag attrs (SomeComponent vcomp)) =
-  renderBuilder (VNode ns tag attrs vkids)
+renderBuilder (VComp _ (SomeComponent vcomp)) =
+  foldMap renderBuilder vkids
     where
 #ifdef SSR
       vkids = [ unsafeCoerce $ (view vcomp) $ getInitialComponentModel vcomp ]
diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index 02d8b65ef..b99bb09a7 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -826,7 +826,7 @@ buildVTree
   -> LogLevel
   -> Events
   -> JSM VTree
-buildVTree hydrate (VComp ns tag attrs (SomeComponent app)) snk _ _ = do
+buildVTree hydrate (VComp attrs (SomeComponent app)) snk _ _ = do
   mountCallback <- do
     FFI.syncCallback2 $ \vcomp continuation -> do
       domRef <- vcomp ! ("domRef" :: MisoString)
@@ -843,9 +843,9 @@ buildVTree hydrate (VComp ns tag attrs (SomeComponent app)) snk _ _ = do
         Nothing -> pure ()
         Just componentState ->
           unmount app componentState
-  vcomp <- createNode "vcomp" ns tag
+  vcomp <- create
   setAttrs vcomp attrs snk (logLevel app) (events app)
-  flip (FFI.set "children") vcomp =<< toJSVal ([] :: [MisoString])
+  FFI.set "child" jsNull vcomp
   flip (FFI.set "mount") vcomp =<< toJSVal mountCallback
   FFI.set "unmount" unmountCallback vcomp
   FFI.set "eventPropagation" (eventPropagation app) vcomp
diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index 4c5504884..12760814e 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -62,6 +62,8 @@ module Miso.Types
   , (<---)
   -- ** Component mounting
   , (+>)
+  , mount
+  , mount_
   -- ** Utils
   , getMountPoint
   , optionalAttrs
@@ -81,7 +83,7 @@ module Miso.Types
   , ms
   ) where
 -----------------------------------------------------------------------------
-import           Data.Aeson (Value, ToJSON)
+import           Data.Aeson (Value, ToJSON(..))
 import           Data.JSString (JSString)
 import qualified Data.Map.Strict as M
 import           Data.Maybe (fromMaybe, isJust)
@@ -262,7 +264,7 @@ data LogLevel
 data View model action
   = VNode NS MisoString [Attribute action] [View model action]
   | VText MisoString
-  | VComp NS MisoString [Attribute action] (SomeComponent model)
+  | VComp [Attribute action] (SomeComponent model)
   deriving Functor
 -----------------------------------------------------------------------------
 -- | Existential wrapper allowing nesting of t'Miso.Types.Component' in t'Miso.Types.Component'
@@ -275,26 +277,51 @@ data SomeComponent parent
 -- Used in the @view@ function to mount a t'Miso.Types.Component' on any 'VNode'.
 --
 -- @
---   div_ [ key_ "component-id" ] +> component model noop $ \\m ->
+--   "component-id" +> component model noop $ \\m ->
 --     div_ [ id_ "foo" ] [ text (ms m) ]
 -- @
 --
 -- @since 1.9.0.0
 (+>)
   :: forall child model action a . Eq child
-  => ([View model a] -> View model a)
+  => MisoString
   -> Component model child action
   -> View model a
 infixr 0 +>
-(+>) mkNode vcomp =
-  case mkNode [] of
-    VNode ns tag attrs _ ->
-      VComp ns tag attrs
-        (SomeComponent vcomp)
-    VComp ns tag attrs vcomp_ ->
-      VComp ns tag attrs vcomp_
-    _ ->
-      error "Impossible: cannot mount on a Text node"
+key +> vcomp = VComp [ Property "key" (toJSON key) ] (SomeComponent vcomp)
+-----------------------------------------------------------------------------
+-- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
+--
+-- @
+--   mount [ key_ "foo", onMounted Mounted ] $ component model noop $ \\m ->
+--     div_ [ id_ "foo" ] [ text (ms m) ]
+-- @
+--
+-- @since 1.9.0.0
+mount
+  :: Eq m
+  => [Attribute a]
+  -> Component p m a
+  -> View p a
+mount attrs vcomp = VComp attrs (SomeComponent vcomp)
+-----------------------------------------------------------------------------
+-- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
+--
+-- Note: only use this if you're certain you won't be diffing two 'Component'
+-- against each other. Otherwise, you will need a key to distinguish between
+-- the two 'Component', to ensure unmounting and mounting occurs.
+--
+-- @
+--   mount_ $ component model noop $ \\m ->
+--     div_ [ id_ "foo" ] [ text (ms m) ]
+-- @
+--
+-- @since 1.9.0.0
+mount_
+  :: Eq m
+  => Component p m a
+  -> View p a
+mount_ = mount []
 -----------------------------------------------------------------------------
 -- | DOM element namespace.
 data NS
@@ -537,4 +564,4 @@ instance ToJSVal VTreeType where
     VCompType -> toJSVal (0 :: Int)
     VNodeType -> toJSVal (1 :: Int)
     VTextType -> toJSVal (2 :: Int)
------------------------------------------------------------------------------
\ No newline at end of file
+-----------------------------------------------------------------------------
diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index f45a779ca..27ad08e08 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -28,14 +28,6 @@ export type VComp<T> = {
   componentId: ComponentId;
   key: string;
 
-  // domRef: T;
-  // ns: 'html';
-  // tag: string;
-  // props: Props;
-  // css: CSS;
-  // classList: Class;
-  // events: Events<T>;
-
   parent: Parent<T>;
   nextSibling: VTree<T>;
   children: Array<VTree<T>>;

From a48d2db19a48cccbf74d237b3ce638093f0ab4be Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Wed, 10 Dec 2025 15:10:18 -0600
Subject: [PATCH 06/76] Update `mount()` and `unmount()` layers.

---
 js/miso.js          |  3 ++-
 js/miso.prod.js     |  2 +-
 src/Miso/Runtime.hs | 12 +++++-------
 ts/miso/dom.ts      |  3 ++-
 ts/miso/types.ts    |  2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index b2c800a21..2c4754dbd 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -311,12 +311,13 @@ function drawCanvas(c) {
 function unmountComponent(c) {
   if (c.onUnmounted)
     c.onUnmounted(drill(c));
-  c.unmount(drill(c));
+  c.unmount(c.componentId);
 }
 function mountComponent(op, parent, n, replacing, context) {
   n.mount(parent, (componentId, componentTree) => {
     n.componentId = componentId;
     n.child = componentTree;
+    componentTree.parent = n;
     if (n.onMounted)
       n.onMounted(drill(n));
     switch (op) {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 3f0ddd272..24eb33f32 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}L(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,S(G,K,U);else L(G,K,Q,U);else L(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function L(G,K,Q,U){switch(G.type){case 2:break;default:O(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:I(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:O(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:I(G);break}}function I(G){YG(G);for(let K of G.children)if(K.type===1||K.type===0)I(K)}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function O(G){ZG(G);for(let K of G.children)if(K.type===1||K.type===0)O(K)}function S(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))EG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(S(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(z(G))}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function E(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function RG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function EG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,M,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),E(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)RG(J,W,Q,U),NG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)E(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)E(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{M=!1,H=X;while(H<=Y){if(G[H].key===q.key){M=!0,p=G[H];break}H++}if(M)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),E(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function NG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function R(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(R(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(R([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function f(G,K){if(G.type===0)f(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:S(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:f(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;f(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:C,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:T,callSetSelectionRange:h,eventJSON:R,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}L(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,S(G,K,U);else L(G,K,Q,U);else L(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function L(G,K,Q,U){switch(G.type){case 2:break;default:O(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:I(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:O(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:I(G);break}}function I(G){YG(G);for(let K of G.children)if(K.type===1||K.type===0)I(K)}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function O(G){ZG(G);for(let K of G.children)if(K.type===1||K.type===0)O(K)}function S(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))EG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(S(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function E(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function RG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function EG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,M,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),E(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)RG(J,W,Q,U),NG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)E(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)E(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{M=!1,H=X;while(H<=Y){if(G[H].key===q.key){M=!0,p=G[H];break}H++}if(M)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),E(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function NG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function R(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(R(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(R([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function f(G,K){if(G.type===0)f(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:S(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:f(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;f(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:C,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:R,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index b99bb09a7..14e1ceee1 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -828,17 +828,15 @@ buildVTree
   -> JSM VTree
 buildVTree hydrate (VComp attrs (SomeComponent app)) snk _ _ = do
   mountCallback <- do
-    FFI.syncCallback2 $ \vcomp continuation -> do
-      domRef <- vcomp ! ("domRef" :: MisoString)
-      ComponentState {..} <- initialize hydrate False app (pure domRef)
+    FFI.syncCallback2 $ \parent_ continuation -> do
+      ComponentState {..} <- initialize hydrate False app (pure parent_)
       vtree <- toJSVal =<< liftIO (readIORef componentVTree)
-      FFI.set "parent" vcomp (Object vtree)
       vcompId <- toJSVal componentId
-      FFI.set "componentId" vcompId (Object domRef)
+      FFI.set "componentId" vcompId (Object parent_)
       void $ call continuation global [vcompId, vtree]
   unmountCallback <- toJSVal =<< do
-    FFI.syncCallback1 $ \domRef -> do
-      componentId <- liftJSM (FFI.getComponentId domRef)
+    FFI.syncCallback1 $ \vcompId -> do
+      componentId <- liftJSM (fromJSValUnchecked vcompId)
       IM.lookup componentId <$> liftIO (readIORef components) >>= \case
         Nothing -> pure ()
         Just componentState ->
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 3565dbea9..fd4c43234 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -344,7 +344,7 @@ function drawCanvas<T> (c: VNode<T>) {
 // unmount components
 function unmountComponent<T>(c: VComp<T>): void {
   if (c.onUnmounted) c.onUnmounted((drill(c)));
-  c.unmount(drill(c));
+  c.unmount(c.componentId);
 }
 
 // mounts vcomp by calling into Haskell side.
@@ -355,6 +355,7 @@ function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, contex
     // to tie the knot (attach to both vdom and real dom).
     n.componentId = componentId;
     n.child = componentTree;
+    componentTree.parent = n;
       if (n.onMounted) n.onMounted(drill(n));          
       switch (op) { 
         case OP.INSERT_BEFORE:
diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index 27ad08e08..e29706468 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -37,7 +37,7 @@ export type VComp<T> = {
   onBeforeUnmounted: () => void;
   onUnmounted: (domRef: T) => void;
   mount: (parent: T, callback: ((componentId : ComponentId, component: VTree<T>) => void)) => void;
-  unmount: (e: T) => void;
+  unmount: (componentId: ComponentId) => void;
 };
 
 export type VNode<T> = {

From b969defec3db80bda237a9ef067538e79f6add5d Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Wed, 10 Dec 2025 15:31:40 -0600
Subject: [PATCH 07/76] Adjust action type

---
 src/Miso/Types.hs | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index 12760814e..09b4bd436 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -300,9 +300,9 @@ key +> vcomp = VComp [ Property "key" (toJSON key) ] (SomeComponent vcomp)
 -- @since 1.9.0.0
 mount
   :: Eq m
-  => [Attribute a]
+  => [Attribute action]
   -> Component p m a
-  -> View p a
+  -> View p action
 mount attrs vcomp = VComp attrs (SomeComponent vcomp)
 -----------------------------------------------------------------------------
 -- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
@@ -320,7 +320,7 @@ mount attrs vcomp = VComp attrs (SomeComponent vcomp)
 mount_
   :: Eq m
   => Component p m a
-  -> View p a
+  -> View p action
 mount_ = mount []
 -----------------------------------------------------------------------------
 -- | DOM element namespace.

From a5589384de65d2466c9e373cdb9cf47c53bcf6ad Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Wed, 10 Dec 2025 15:33:12 -0600
Subject: [PATCH 08/76] Update test

---
 tests/app/Main.hs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/app/Main.hs b/tests/app/Main.hs
index 5be6836eb..00c804617 100644
--- a/tests/app/Main.hs
+++ b/tests/app/Main.hs
@@ -91,7 +91,7 @@ main = do
         _ <- jsm $ do
           startApp $
             component (0 :: Int) noop $ \_ ->
-              div_ [] (replicate 9999 (div_ [] +> testComponent))
+              div_ [] (replicate 9999 (mount_ testComponent))
         mountedComponents >>= (`shouldBe` 10000)
 #endif
 -----------------------------------------------------------------------------

From c7e87f7a57810475e08695d37d71e77f99e0178a Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 20:31:20 -0600
Subject: [PATCH 09/76] remove children field

---
 js/miso.js                | 36 +++++++++++++++++++++++++++++-------
 js/miso.prod.js           |  2 +-
 ts/miso/dom.ts            | 35 ++++++++++++++++++++++++++++-------
 ts/miso/types.ts          |  1 -
 ts/spec/component.spec.ts |  9 ++++-----
 ts/spec/event.spec.ts     | 14 +++++---------
 6 files changed, 67 insertions(+), 30 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 2c4754dbd..8d2941796 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -116,10 +116,20 @@ function destroy(c, parent, context) {
 }
 function callDestroyedRecursive(c) {
   callDestroyed(c);
-  for (const child of c.children) {
-    if (child.type === 1 /* VNode */ || child.type === 0 /* VComp */) {
-      callDestroyedRecursive(child);
-    }
+  switch (c.type) {
+    case 1 /* VNode */:
+      for (const child of c.children) {
+        if (child.type === 1 /* VNode */ || child.type === 0 /* VComp */) {
+          callDestroyedRecursive(child);
+        }
+      }
+      break;
+    case 0 /* VComp */:
+      if (c.child) {
+        if (c.child.type === 1 /* VNode */ || c.child.type === 0 /* VComp */)
+          callDestroyedRecursive(c.child);
+      }
+      break;
   }
 }
 function callDestroyed(c) {
@@ -144,9 +154,21 @@ function callBeforeDestroyed(c) {
 }
 function callBeforeDestroyedRecursive(c) {
   callBeforeDestroyed(c);
-  for (const child of c.children)
-    if (child.type === 1 /* VNode */ || child.type === 0 /* VComp */)
-      callBeforeDestroyedRecursive(child);
+  switch (c.type) {
+    case 1 /* VNode */:
+      for (const child of c.children) {
+        if (child.type === 2 /* VText */)
+          continue;
+        callBeforeDestroyedRecursive(child);
+      }
+      break;
+    case 0 /* VComp */:
+      if (c.child) {
+        if (c.child.type === 1 /* VNode */ || c.child.type === 0 /* VComp */)
+          callBeforeDestroyedRecursive(c.child);
+      }
+      break;
+  }
 }
 function diffAttrs(c, n, context) {
   diffProps(c ? c.props : {}, n.props, n.domRef, n.ns === "svg", context);
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 24eb33f32..3e9954e08 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}L(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,S(G,K,U);else L(G,K,Q,U);else L(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function L(G,K,Q,U){switch(G.type){case 2:break;default:O(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:I(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:O(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:I(G);break}}function I(G){YG(G);for(let K of G.children)if(K.type===1||K.type===0)I(K)}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function O(G){ZG(G);for(let K of G.children)if(K.type===1||K.type===0)O(K)}function S(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))EG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(S(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function E(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function RG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function EG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,M,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),E(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)RG(J,W,Q,U),NG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)E(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)E(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{M=!1,H=X;while(H<=Y){if(G[H].key===q.key){M=!0,p=G[H];break}H++}if(M)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),E(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function NG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function R(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(R(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(R([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function f(G,K){if(G.type===0)f(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:S(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:f(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;f(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:C,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:R,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{I=!1,H=X;while(H<=Y){if(G[H].key===q.key){I=!0,p=G[H];break}H++}if(I)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function C(G,K){if(G.type===0)C(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:C(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;C(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index fd4c43234..6af02f84b 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -131,10 +131,20 @@ function destroy<T>(c: VTree<T>, parent: T, context: DrawingContext<T>): void {
 // ** recursive calls to hooks
 function callDestroyedRecursive<T>(c: VNode<T> | VComp<T>): void {
   callDestroyed(c);
-  for (const child of c.children) {
-    if (child.type === VTreeType.VNode || child.type === VTreeType.VComp) {
-       callDestroyedRecursive(child);
-    }
+  switch (c.type) {
+    case VTreeType.VNode:
+      for (const child of c.children) {
+        if (child.type === VTreeType.VNode || child.type === VTreeType.VComp) {
+           callDestroyedRecursive(child);
+        }
+      }
+      break;
+    case VTreeType.VComp:
+      if (c.child) {
+        if (c.child.type === VTreeType.VNode || c.child.type === VTreeType.VComp)
+          callDestroyedRecursive(c.child);
+      }
+      break;
   }
 }
 
@@ -158,9 +168,20 @@ function callBeforeDestroyed<T>(c: VNode<T> | VComp<T>): void {
 
 function callBeforeDestroyedRecursive<T>(c: VNode<T> | VComp<T>): void {
   callBeforeDestroyed(c);
-  for (const child of c.children)
-    if (child.type === VTreeType.VNode || child.type === VTreeType.VComp)
-       callBeforeDestroyedRecursive(child);
+  switch (c.type) {
+    case VTreeType.VNode:
+      for (const child of c.children) {
+         if (child.type === VTreeType.VText) continue;
+         callBeforeDestroyedRecursive(child);
+      }
+      break;
+    case VTreeType.VComp:
+      if (c.child) { 
+        if (c.child.type === VTreeType.VNode || c.child.type === VTreeType.VComp)
+          callBeforeDestroyedRecursive(c.child);
+      }
+      break;
+  }
 }
 
 export function diffAttrs<T>(c: VNode<T> | null, n: VNode<T>, context: DrawingContext<T>): void {
diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index e29706468..e4861c196 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -30,7 +30,6 @@ export type VComp<T> = {
 
   parent: Parent<T>;
   nextSibling: VTree<T>;
-  children: Array<VTree<T>>;
   eventPropagation: boolean;
   onBeforeMounted: () => void;
   onMounted: (domRef: T) => void;
diff --git a/ts/spec/component.spec.ts b/ts/spec/component.spec.ts
index 314b60808..d8c1fb488 100644
--- a/ts/spec/component.spec.ts
+++ b/ts/spec/component.spec.ts
@@ -23,12 +23,11 @@ describe ('Component tests', () => {
     test('Should unmount recursively in order', () => {
     let unmounts = [];
     const build = (name, children) => {
-        return vcomp<DOMRef> ({
-          children: children,
+        return vcomp<DOMRef> ({ 
           mount: (domRef, callback) => {
-            const child = vnode<DOMRef>({ tag: 'div' });
-            diff<DOMRef>(null, child, domRef, drawingContext);
-            callback(0, child);
+            const childVNode = vnode<DOMRef>({ tag: 'div', children });
+            diff<DOMRef>(null, childVNode, domRef, drawingContext);
+            callback(0, childVNode);
           },
           unmount: () => {
             unmounts.push(name);
diff --git a/ts/spec/event.spec.ts b/ts/spec/event.spec.ts
index 52c690a45..022f092a0 100644
--- a/ts/spec/event.spec.ts
+++ b/ts/spec/event.spec.ts
@@ -1,6 +1,6 @@
 import { diff } from '../miso/dom';
 import { delegate, undelegate } from '../miso/event';
-import { DOMRef, EventCapture } from '../miso/types';
+import { DOMRef, EventCapture, VNode } from '../miso/types';
 import { vnode, vcomp } from '../miso/smart';
 import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { eventContext, drawingContext } from '../miso/context/dom';
@@ -166,7 +166,6 @@ describe ('Event tests', () => {
     });
 
     var childVComp = vcomp({
-      children: [child],
       eventPropagation: false,
       mount : function (vcomp, f) {
         diff(null, child, vcomp, drawingContext);
@@ -180,10 +179,9 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      children: [parent],
       mount : function (vcomp, f) {
         diff(null, parent, vcomp, drawingContext);
-        return f(1, child);
+        return f(1, parent);
       }
     });
 
@@ -235,11 +233,10 @@ describe ('Event tests', () => {
     });
 
     var childVComp = vcomp({
-      children: [child],
       eventPropagation: true,
       mount : function (p: DOMRef, f) {
         diff(null, child, p, drawingContext);
-        return f(0, child);
+        return f(0, child as VNode<DOMRef>);
       }
     });
 
@@ -249,16 +246,15 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      children: [parent],
       mount : function (p: DOMRef, f) {
         diff(null, parent, p, drawingContext);
-        return f(1, child);
+        return f(1, parent as VNode<DOMRef>);
       }
     });
 
     /* create hierarchy */
     child.parent = childVComp;
-    childVComp.parent = parent;
+    childVComp.parent = parent as VNode<DOMRef>;
     parent.parent = parentVComp;
 
     /* initial page draw */

From ef8b1cc144ddbb88a99b120856d6f4167df10b2b Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 21:26:41 -0600
Subject: [PATCH 10/76] return null in drill

---
 js/miso.js      | 1 +
 js/miso.prod.js | 2 +-
 ts/miso/dom.ts  | 1 +
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/js/miso.js b/js/miso.js
index 8d2941796..9e170a5d4 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -40,6 +40,7 @@ function drill(c) {
         return c.child.domRef;
     }
   }
+  return null;
 }
 function replace(c, n, parent, context) {
   switch (c.type) {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 3e9954e08..9138e5fd6 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{I=!1,H=X;while(H<=Y){if(G[H].key===q.key){I=!0,p=G[H];break}H++}if(I)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function C(G,K){if(G.type===0)C(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:C(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;C(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{I=!1,H=X;while(H<=Y){if(G[H].key===q.key){I=!0,p=G[H];break}H++}if(I)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function C(G,K){if(G.type===0)C(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:C(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;C(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 6af02f84b..148bd5d80 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -43,6 +43,7 @@ export function drill<T>(c: VComp<T>): T {
         return c.child.domRef;
     }
   }
+  return null;
 }
 
 // replace everything function

From f361609adb9493472e0233d605da01a0c8d4a323 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 21:37:17 -0600
Subject: [PATCH 11/76] use parent field

---
 ts/spec/event.spec.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ts/spec/event.spec.ts b/ts/spec/event.spec.ts
index 022f092a0..76240e0a2 100644
--- a/ts/spec/event.spec.ts
+++ b/ts/spec/event.spec.ts
@@ -100,8 +100,8 @@ describe ('Event tests', () => {
 
     var childVComp = vcomp({
       eventPropagation: true,
-      mount : function (vcomp, f) {
-        diff(null, child, vcomp, drawingContext);
+      mount : function (parent, f) {
+        diff(null, child, parent, drawingContext);
         return f(0, child);
       }
     });

From ac356d68325adf95cc76a389cf05ae488e35908b Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Wed, 10 Dec 2025 21:38:38 -0600
Subject: [PATCH 12/76] drop redundant comment

---
 ts/miso/dom.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 148bd5d80..a385cc06f 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -118,7 +118,6 @@ function destroy<T>(c: VTree<T>, parent: T, context: DrawingContext<T>): void {
         context.removeChild(parent, c.domRef);
         break;
   }
-  // step 2: destroy
   // step 3: invoke post-hooks for vnode and vcomp
   switch (c.type) {
       case VTreeType.VText:

From e65d30c28f8626eab31f7f810e931cce9ef23841 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 01:46:50 -0600
Subject: [PATCH 13/76] Check if drilled successfully

---
 ts/miso/context/dom.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index 9147ba7ec..ba777a8fb 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -7,8 +7,8 @@ import
   , HydrationContext
   , DOMRef
   , ComponentContext
-  , VTree,
-  VTreeType
+  , VTree
+  , VTreeType
   } from '../types';
 
 import { drill } from '../dom'; 
@@ -73,7 +73,8 @@ export const drawingContext : DrawingContext<DOMRef> = {
   nextSibling : (node: VTree<DOMRef>) => {
     switch (node.type) {
       case VTreeType.VComp:
-        return drill(node).nextSibling as DOMRef;
+        const drilled = drill(node);
+        return drilled ? drilled.nextSibling as DOMRef : null;
       default:
         return node.domRef.nextSibling as DOMRef;
     }

From 3bc87505f6494a7a6da1c0ac935a6da7793c2585 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 01:49:08 -0600
Subject: [PATCH 14/76] Check if `child` exists.

---
 ts/miso/hydrate.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index c73197d64..11dc557c5 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -16,7 +16,7 @@ function collapseSiblingTextNodes(vs: Array<VTree<DOMRef>>): Array<VTree<DOMRef>
 
 function setVCompRef(vtree: VTree<DOMRef>, node: Node): void {
   if (vtree.type === VTreeType.VComp) {
-    setVCompRef(vtree.child, node);
+    if (vtree.child) setVCompRef(vtree.child, node);
   } else {
     vtree.domRef = node as DOMRef;
   }

From 94c07003426ef557260c62de6aeb6af23839dcea Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 01:56:30 -0600
Subject: [PATCH 15/76] Add `drilled` check.

---
 ts/miso/context/patch.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/ts/miso/context/patch.ts b/ts/miso/context/patch.ts
index 5acdc79f6..9a683c3c7 100644
--- a/ts/miso/context/patch.ts
+++ b/ts/miso/context/patch.ts
@@ -9,7 +9,7 @@ import {
   VTreeType,
 } from '../types';
 
-import { drill } from '../dom'; 
+import { drill } from '../dom';
 
 /*
 
@@ -99,7 +99,8 @@ export const patchDrawingContext : DrawingContext<NodeId> = {
   nextSibling : (node: VTree<NodeId>) => {
     switch (node.nextSibling.type) {
       case VTreeType.VComp:
-        return drill(node.nextSibling) as NodeId;
+        const drilled = drill (node.nextSibling);
+        return drilled ? drilled : null;
       default:
         return node.nextSibling.domRef as NodeId;
     }

From bbb85dcd6adf64a11cd3840a34ed28a06f189be7 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 01:58:51 -0600
Subject: [PATCH 16/76] Naming conventions

---
 ts/spec/event.spec.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/ts/spec/event.spec.ts b/ts/spec/event.spec.ts
index 76240e0a2..506acb114 100644
--- a/ts/spec/event.spec.ts
+++ b/ts/spec/event.spec.ts
@@ -100,8 +100,8 @@ describe ('Event tests', () => {
 
     var childVComp = vcomp({
       eventPropagation: true,
-      mount : function (parent, f) {
-        diff(null, child, parent, drawingContext);
+      mount : function (p, f) {
+        diff(null, child, p, drawingContext);
         return f(0, child);
       }
     });
@@ -167,8 +167,8 @@ describe ('Event tests', () => {
 
     var childVComp = vcomp({
       eventPropagation: false,
-      mount : function (vcomp, f) {
-        diff(null, child, vcomp, drawingContext);
+      mount : function (p, f) {
+        diff(null, child, p, drawingContext);
         return f(0, child);
       }
     });
@@ -179,8 +179,8 @@ describe ('Event tests', () => {
     });
 
     var parentVComp = vcomp({
-      mount : function (vcomp, f) {
-        diff(null, parent, vcomp, drawingContext);
+      mount : function (p, f) {
+        diff(null, parent, p, drawingContext);
         return f(1, parent);
       }
     });

From 1d84f1b2348988023ba609530ddbc62c2479f309 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 02:09:07 -0600
Subject: [PATCH 17/76] Call `setVCompRef`

---
 ts/miso/hydrate.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 11dc557c5..cb0caa45c 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -78,7 +78,7 @@ export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTr
             (vtree.domRef as Node) = node;
             break;
          default:
-            // drill(vtree) = node as DOMRef; (dmj: set vcomp here)
+            setVCompRef(vtree, node as DOMRef);
             break;
      }
 

From 684c11c4d79041f9127b6b6cea65062392a04f76 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 02:15:18 -0600
Subject: [PATCH 18/76] Add `VText` case in `createElement`

---
 ts/miso/dom.ts | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index a385cc06f..f6a35da45 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -330,8 +330,22 @@ export function callCreated<T>(parent: T, n: VComp<T> | VNode<T>, context: Drawi
   }
 }
 
-function createElement<T>(parent : T, op: OP, replacing : T | null, n: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
+function createElement<T>(parent : T, op: OP, replacing : T | null, n: VTree<T>, context: DrawingContext<T>): void {
   switch (n.type) {
+    case VTreeType.VText:
+      n.domRef = context.createTextNode(n.text);
+      switch (op) {
+        case OP.INSERT_BEFORE:
+          context.insertBefore(parent, n.domRef, replacing);
+          break;
+        case OP.APPEND:
+          context.appendChild(parent, n.domRef);
+          break;
+        case OP.REPLACE:
+          context.replaceChild(parent, n.domRef, replacing);
+          break;
+      }
+      break;
     case VTreeType.VComp:
       if (n.onBeforeMounted) n.onBeforeMounted();
       mountComponent(op, parent, n, replacing, context);
@@ -639,7 +653,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
                   case VTreeType.VComp:
                     createElement(parent, OP.INSERT_BEFORE, drill(oFirst), nFirst, context);
                     break;
-                  case VTreeType.VNode:
+                  default:
                     createElement(parent, OP.INSERT_BEFORE, oFirst.domRef, nFirst, context);
                     break;
             }

From 172b88696eda80aacc5b3e23ec34cde66f12986e Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 03:52:33 -0600
Subject: [PATCH 19/76] Regen JS

---
 js/miso.js      | 23 ++++++++++++++++++++---
 js/miso.prod.js |  2 +-
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 9e170a5d4..c256cfe65 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -301,6 +301,20 @@ function callCreated(parent, n, context) {
 }
 function createElement(parent, op, replacing, n, context) {
   switch (n.type) {
+    case 2 /* VText */:
+      n.domRef = context.createTextNode(n.text);
+      switch (op) {
+        case 2 /* INSERT_BEFORE */:
+          context.insertBefore(parent, n.domRef, replacing);
+          break;
+        case 0 /* APPEND */:
+          context.appendChild(parent, n.domRef);
+          break;
+        case 1 /* REPLACE */:
+          context.replaceChild(parent, n.domRef, replacing);
+          break;
+      }
+      break;
     case 0 /* VComp */:
       if (n.onBeforeMounted)
         n.onBeforeMounted();
@@ -503,7 +517,7 @@ function syncChildren(os, ns, parent, context) {
               case 0 /* VComp */:
                 createElement(parent, 2 /* INSERT_BEFORE */, drill(oFirst), nFirst, context);
                 break;
-              case 1 /* VNode */:
+              default:
                 createElement(parent, 2 /* INSERT_BEFORE */, oFirst.domRef, nFirst, context);
                 break;
             }
@@ -729,7 +743,8 @@ function collapseSiblingTextNodes(vs) {
 }
 function setVCompRef(vtree, node) {
   if (vtree.type === 0 /* VComp */) {
-    setVCompRef(vtree.child, node);
+    if (vtree.child)
+      setVCompRef(vtree.child, node);
   } else {
     vtree.domRef = node;
   }
@@ -774,6 +789,7 @@ function hydrate(logLevel, mountPoint, vtree, context, drawingContext) {
         vtree.domRef = node;
         break;
       default:
+        setVCompRef(vtree, node);
         break;
     }
     return false;
@@ -1160,7 +1176,8 @@ var drawingContext = {
   nextSibling: (node) => {
     switch (node.type) {
       case 0 /* VComp */:
-        return drill(node).nextSibling;
+        const drilled = drill(node);
+        return drilled ? drilled.nextSibling : null;
       default:
         return node.domRef.nextSibling;
     }
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 9138e5fd6..0fa4813ba 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{I=!1,H=X;while(H<=Y){if(G[H].key===q.key){I=!0,p=G[H];break}H++}if(I)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;case 1:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function F(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function C(G,K){if(G.type===0)C(G.child,K);else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:C(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;C(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:return z(G).nextSibling;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:w,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:F,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:let K=z(G);return K?K.nextSibling:null;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From 2019d8d4420257437771dcd3fdc7a0de9c4bcdc8 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 04:06:03 -0600
Subject: [PATCH 20/76] Check .nextSibling existence

---
 js/miso.js             | 14 ++++++++------
 js/miso.prod.js        |  2 +-
 ts/miso/context/dom.ts | 14 ++++++++------
 3 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index c256cfe65..08394f4e8 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -1174,12 +1174,14 @@ var componentContext = {
 };
 var drawingContext = {
   nextSibling: (node) => {
-    switch (node.type) {
-      case 0 /* VComp */:
-        const drilled = drill(node);
-        return drilled ? drilled.nextSibling : null;
-      default:
-        return node.domRef.nextSibling;
+    if (node.nextSibling) {
+      switch (node.type) {
+        case 0 /* VComp */:
+          const drilled = drill(node);
+          return drilled ? drilled.nextSibling : null;
+        default:
+          return node.domRef.nextSibling;
+      }
     }
   },
   createTextNode: (s) => {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 0fa4813ba..7375f8e1a 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{switch(G.type){case 0:let K=z(G);return K?K.nextSibling:null;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.type){case 0:let K=z(G);return K?K.nextSibling:null;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index ba777a8fb..518c81bf4 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -71,12 +71,14 @@ export const componentContext : ComponentContext = {
 
 export const drawingContext : DrawingContext<DOMRef> = {
   nextSibling : (node: VTree<DOMRef>) => {
-    switch (node.type) {
-      case VTreeType.VComp:
-        const drilled = drill(node);
-        return drilled ? drilled.nextSibling as DOMRef : null;
-      default:
-        return node.domRef.nextSibling as DOMRef;
+    if (node.nextSibling) {
+      switch (node.type) {
+        case VTreeType.VComp:
+          const drilled = drill(node);
+          return drilled ? drilled.nextSibling as DOMRef : null;
+        default:
+          return node.domRef.nextSibling as DOMRef;
+      }
     }
   },
   createTextNode : (s: string) => {

From 452e860920bd1abe90b5ed9eb9128343fa791eeb Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 04:08:12 -0600
Subject: [PATCH 21/76] Check `.nextSibling`

---
 ts/miso/context/patch.ts | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/ts/miso/context/patch.ts b/ts/miso/context/patch.ts
index 9a683c3c7..43b4d6a25 100644
--- a/ts/miso/context/patch.ts
+++ b/ts/miso/context/patch.ts
@@ -97,12 +97,14 @@ export const componentContext : ComponentContext = {
 
 export const patchDrawingContext : DrawingContext<NodeId> = {
   nextSibling : (node: VTree<NodeId>) => {
-    switch (node.nextSibling.type) {
-      case VTreeType.VComp:
-        const drilled = drill (node.nextSibling);
-        return drilled ? drilled : null;
-      default:
-        return node.nextSibling.domRef as NodeId;
+    if (node.nextSibling) {
+      switch (node.nextSibling.type) {
+        case VTreeType.VComp:
+          const drilled = drill (node.nextSibling);
+          return drilled ? drilled : null;
+        default:
+          return node.nextSibling.domRef as NodeId;
+      }
     }
   },
   createTextNode : (value : string) => {

From 00c8bcad67fad9cfd34ff385b1c33240a12ee819 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 04:42:27 -0600
Subject: [PATCH 22/76] Flip mounting combinators

---
 src/Miso/Types.hs | 12 ++++++------
 tests/app/Main.hs |  2 +-
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index f88a26147..d4d8f99cf 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -295,17 +295,17 @@ key +> vcomp = VComp [ Property "key" (toJSON key) ] (SomeComponent vcomp)
 -- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
 --
 -- @
---   mount [ key_ "foo", onMounted Mounted ] $ component model noop $ \\m ->
+--   mount_ [ key_ "foo", onMounted Mounted ] $ component model noop $ \\m ->
 --     div_ [ id_ "foo" ] [ text (ms m) ]
 -- @
 --
 -- @since 1.9.0.0
-mount
+mount_
   :: Eq m
   => [Attribute action]
   -> Component p m a
   -> View p action
-mount attrs vcomp = VComp attrs (SomeComponent vcomp)
+mount_ attrs vcomp = VComp attrs (SomeComponent vcomp)
 -----------------------------------------------------------------------------
 -- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
 --
@@ -314,16 +314,16 @@ mount attrs vcomp = VComp attrs (SomeComponent vcomp)
 -- the two 'Component', to ensure unmounting and mounting occurs.
 --
 -- @
---   mount_ $ component model noop $ \\m ->
+--   mount $ component model noop $ \\m ->
 --     div_ [ id_ "foo" ] [ text (ms m) ]
 -- @
 --
 -- @since 1.9.0.0
-mount_
+mount
   :: Eq m
   => Component p m a
   -> View p action
-mount_ = mount []
+mount = mount_ []
 -----------------------------------------------------------------------------
 -- | DOM element namespace.
 data NS
diff --git a/tests/app/Main.hs b/tests/app/Main.hs
index 00c804617..af2ad989d 100644
--- a/tests/app/Main.hs
+++ b/tests/app/Main.hs
@@ -91,7 +91,7 @@ main = do
         _ <- jsm $ do
           startApp $
             component (0 :: Int) noop $ \_ ->
-              div_ [] (replicate 9999 (mount_ testComponent))
+              div_ [] (replicate 9999 (mount testComponent))
         mountedComponents >>= (`shouldBe` 10000)
 #endif
 -----------------------------------------------------------------------------

From 7acc77cd9ca925df5dbb64c37a0542e2eb42b3ee Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 06:58:13 -0600
Subject: [PATCH 23/76] Update `nextSibling`

---
 js/miso.js             |  5 ++---
 js/miso.prod.js        |  2 +-
 ts/miso/context/dom.ts | 11 +++++------
 3 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 08394f4e8..5696c8b4c 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -1175,10 +1175,9 @@ var componentContext = {
 var drawingContext = {
   nextSibling: (node) => {
     if (node.nextSibling) {
-      switch (node.type) {
+      switch (node.nextSibling.type) {
         case 0 /* VComp */:
-          const drilled = drill(node);
-          return drilled ? drilled.nextSibling : null;
+          return drill(node.nextSibling);
         default:
           return node.domRef.nextSibling;
       }
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 7375f8e1a..8f434141b 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.type){case 0:let K=z(G);return K?K.nextSibling:null;default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index 518c81bf4..eb7689b14 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -42,9 +42,9 @@ export const hydrationContext : HydrationContext<DOMRef> = {
     return node.lastChild as DOMRef;
   },
   getAttribute: (node: DOMRef, key: string) => {
-      if (key === 'class') return node.className;
-      if (key in node) return node[key];
-      return node.getAttribute(key);
+    if (key === 'class') return node.className;
+    if (key in node) return node[key];
+    return node.getAttribute(key);
   },
   getTag: (node: DOMRef) => {
     return node.nodeName;
@@ -72,10 +72,9 @@ export const componentContext : ComponentContext = {
 export const drawingContext : DrawingContext<DOMRef> = {
   nextSibling : (node: VTree<DOMRef>) => {
     if (node.nextSibling) {
-      switch (node.type) {
+      switch (node.nextSibling.type) {
         case VTreeType.VComp:
-          const drilled = drill(node);
-          return drilled ? drilled.nextSibling as DOMRef : null;
+          return drill(node.nextSibling) as DOMRef;
         default:
           return node.domRef.nextSibling as DOMRef;
       }

From 8f97f894a9749aadc2c4d2d7bc1e57d0f00ec966 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 07:09:20 -0600
Subject: [PATCH 24/76] Use onMounted callback

---
 ts/spec/dom.spec.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index 7a5fc28ad..3e2643b71 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -438,9 +438,11 @@ describe('DOM tests', () => {
       onBeforeMounted: () => {
         beforeMounted++;
       },
+      onMounted : () => {
+        mounted++;
+      },
       mount: (domRef, callback) => {
         mount++;
-        mounted++; //dmj : 'onMounted' is called inside of 'mount' callback in dom.ts
         const child = vnode<DOMRef>({ tag: 'div' });
         diff<DOMRef>(null, child, domRef, drawingContext);
         callback(0, child);

From 0d97ea88cd97e14991463a5696a4d30d2b88fa4b Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 07:16:57 -0600
Subject: [PATCH 25/76] Get nextSibling first.

---
 ts/miso/context/dom.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index eb7689b14..484d3d9a2 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -76,7 +76,7 @@ export const drawingContext : DrawingContext<DOMRef> = {
         case VTreeType.VComp:
           return drill(node.nextSibling) as DOMRef;
         default:
-          return node.domRef.nextSibling as DOMRef;
+          return node.nextSibling.domRef as DOMRef;
       }
     }
   },

From 5356da33500ed0e57737aeeca783dde42f4dc670 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 07:17:12 -0600
Subject: [PATCH 26/76] Make fields optional

---
 ts/miso/types.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index e4861c196..0b0d6899d 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -24,8 +24,8 @@ export enum OP {
 
 export type VComp<T> = {
   type: VTreeType.VComp;
-  child: VTree<T>;
-  componentId: ComponentId;
+  child?: VTree<T>;
+  componentId?: ComponentId;
   key: string;
 
   parent: Parent<T>;

From 2bfc6f523cf209fddd452a6eb9fafb0de60cf73b Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 07:17:31 -0600
Subject: [PATCH 27/76] Regen JS

---
 js/miso.js      | 2 +-
 js/miso.prod.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 5696c8b4c..aaa2ded53 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -1179,7 +1179,7 @@ var drawingContext = {
         case 0 /* VComp */:
           return drill(node.nextSibling);
         default:
-          return node.domRef.nextSibling;
+          return node.nextSibling.domRef;
       }
     }
   },
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 8f434141b..832686c4d 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.domRef.nextSibling}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From ae9b3814755ec02f7eb7e0cc2f7d8a712cab82b9 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 14:19:46 -0600
Subject: [PATCH 28/76] Add comments

---
 js/miso.js       | 1 -
 js/miso.prod.js  | 2 +-
 ts/miso/dom.ts   | 5 ++++-
 ts/miso/types.ts | 4 +++-
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index aaa2ded53..cbd0f2062 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -40,7 +40,6 @@ function drill(c) {
         return c.child.domRef;
     }
   }
-  return null;
 }
 function replace(c, n, parent, context) {
   switch (c.type) {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 832686c4d..b7d7d9685 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}return null}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index f6a35da45..0b2d60640 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -33,6 +33,8 @@ function diffVText<T>(c: VText<T>, n: VText<T>, context : DrawingContext<T>): vo
   return;
 }
 
+// should only be called on a mounted component
+// c.child should never be null
 export function drill<T>(c: VComp<T>): T {
   while (c.type === VTreeType.VComp && c.child) {
     switch (c.child.type) {
@@ -43,7 +45,8 @@ export function drill<T>(c: VComp<T>): T {
         return c.child.domRef;
     }
   }
-  return null;
+  /* impossible condition */
+  // return null;
 }
 
 // replace everything function
diff --git a/ts/miso/types.ts b/ts/miso/types.ts
index 0b0d6899d..89e414551 100644
--- a/ts/miso/types.ts
+++ b/ts/miso/types.ts
@@ -24,8 +24,10 @@ export enum OP {
 
 export type VComp<T> = {
   type: VTreeType.VComp;
-  child?: VTree<T>;
+  child: VTree<T>;
+  // used w/ drill to get domRef.
   componentId?: ComponentId;
+  // ^ set post-mounting
   key: string;
 
   parent: Parent<T>;

From 81b5d3c304e1f6f6c50779929be0487096db1917 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 18:42:01 -0600
Subject: [PATCH 29/76] Handle recursive component mounting.

- [x] Add test for recursive component mounting
- [x] Add explicit `throw new Error(msg)` for impossible cases
- [x] Consolidate component lifecycle hooks to `mountComponent`
---
 js/miso.js                | 44 +++++++++++++++------------------
 js/miso.prod.js           |  2 +-
 ts/miso/dom.ts            | 51 +++++++++++++++++----------------------
 ts/miso/event.ts          |  4 ++-
 ts/spec/component.spec.ts | 24 ++++++++++++++++++
 5 files changed, 69 insertions(+), 56 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index cbd0f2062..795a90ea4 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -31,14 +31,14 @@ function diffVText(c, n, context) {
   return;
 }
 function drill(c) {
-  while (c.type === 0 /* VComp */ && c.child) {
-    switch (c.child.type) {
-      case 0 /* VComp */:
-        c = c.child;
-        break;
-      default:
-        return c.child.domRef;
-    }
+  if (!c.child)
+    throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");
+  switch (c.child.type) {
+    case 0 /* VComp */:
+      drill(c.child);
+      break;
+    default:
+      return c.child.domRef;
   }
 }
 function replace(c, n, parent, context) {
@@ -286,11 +286,7 @@ function populateDomRef(c, context) {
 function callCreated(parent, n, context) {
   switch (n.type) {
     case 0 /* VComp */:
-      if (n.onBeforeMounted)
-        n.onBeforeMounted();
       mountComponent(0 /* APPEND */, parent, n, null, context);
-      if (n.onMounted)
-        n.onMounted(drill(n));
       break;
     case 1 /* VNode */:
       if (n.onCreated)
@@ -315,8 +311,6 @@ function createElement(parent, op, replacing, n, context) {
       }
       break;
     case 0 /* VComp */:
-      if (n.onBeforeMounted)
-        n.onBeforeMounted();
       mountComponent(op, parent, n, replacing, context);
       break;
     case 1 /* VNode */:
@@ -350,24 +344,22 @@ function unmountComponent(c) {
   c.unmount(c.componentId);
 }
 function mountComponent(op, parent, n, replacing, context) {
+  if (n.onBeforeMounted)
+    n.onBeforeMounted();
   n.mount(parent, (componentId, componentTree) => {
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-    if (n.onMounted)
-      n.onMounted(drill(n));
-    switch (op) {
-      case 2 /* INSERT_BEFORE */:
-        context.insertBefore(parent, drill(n), replacing);
-        break;
-      case 0 /* APPEND */:
-        context.appendChild(parent, drill(n));
+    switch (componentTree.type) {
+      case 0 /* VComp */:
+        mountComponent(op, parent, componentTree, replacing, context);
         break;
-      case 1 /* REPLACE */:
-        context.replaceChild(parent, drill(n), replacing);
+      default:
         break;
     }
   });
+  if (n.onMounted)
+    n.onMounted(drill(n));
 }
 function create(n, parent, context) {
   if (n.type === 2 /* VText */) {
@@ -592,7 +584,9 @@ function delegateEvent(event, obj, stack, debug, context) {
     } else if (obj.type === 0 /* VComp */) {
       if (!obj.child) {
         if (debug) {
-          console.warn("VComp has no child property set during event delegation", obj);
+          console.error("VComp has no child property set during event delegation", obj);
+          console.error("This means the Component has not been fully mounted, this should never happen");
+          throw new Error("VComp has no .child property set during event delegation");
         }
         return;
       }
diff --git a/js/miso.prod.js b/js/miso.prod.js
index b7d7d9685..9b63b17d1 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){while(G.type===0&&G.child)switch(G.child.type){case 0:G=G.child;break;default:return G.child.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:if(K.onBeforeMounted)K.onBeforeMounted();if(a(0,G,K,null,Q),K.onMounted)K.onMounted(z(K));break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:if(U.onBeforeMounted)U.onBeforeMounted();a(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Q.onMounted)Q.onMounted(z(Q));switch(G){case 2:X.insertBefore(K,z(Q),U);break;case 0:X.appendChild(K,z(Q));break;case 1:X.replaceChild(K,z(Q),U);break}})}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,p=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,p,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function F(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)console.warn("VComp has no child property set during event delegation",K);return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function V(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:V,version:k,delegate:F,callBlur:g,callFocus:b,callSelect:h,callSetSelectionRange:T,eventJSON:E,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:f,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:z(G.child);break;default:return G.child.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function w(G,K,Q){switch(K.type){case 0:F(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:F(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function F(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{switch(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type){case 0:F(G,K,Y,U,X);break;default:break}}),Q.onMounted)Q.onMounted(z(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,a=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,a,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function f(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),w(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),w(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:j,version:b,delegate:f,callBlur:h,callFocus:g,callSelect:T,callSetSelectionRange:u,eventJSON:E,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:C,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 0b2d60640..ff7e4d4ce 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -33,22 +33,19 @@ function diffVText<T>(c: VText<T>, n: VText<T>, context : DrawingContext<T>): vo
   return;
 }
 
-// should only be called on a mounted component
 // c.child should never be null
 export function drill<T>(c: VComp<T>): T {
-  while (c.type === VTreeType.VComp && c.child) {
-    switch (c.child.type) {
-      case VTreeType.VComp:
-        c = c.child;
-        break;
-      default:
-        return c.child.domRef;
-    }
+  if (!c.child) throw new Error ("'drill' called on an unmounted Component. This should never happen, please make an issue.");
+  switch (c.child.type) {
+    case VTreeType.VComp:
+      drill (c.child)
+      break;
+    default:
+      return c.child.domRef;
   }
-  /* impossible condition */
-  // return null;
 }
 
+
 // replace everything function
 function replace<T>(c: VTree<T>, n: VTree<T>, parent: T, context : DrawingContext<T>): void {
   // step1 : prepare to delete, unmount things
@@ -323,9 +320,7 @@ function populateDomRef<T>(c: VNode<T>, context: DrawingContext<T>): void {
 export function callCreated<T>(parent: T, n: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
   switch (n.type) {
       case VTreeType.VComp:
-          if (n.onBeforeMounted) n.onBeforeMounted();
           mountComponent(OP.APPEND, parent, n, null, context);
-          if (n.onMounted) n.onMounted(drill(n));          
           break;
       case VTreeType.VNode:
           if (n.onCreated) n.onCreated(n.domRef);
@@ -350,7 +345,6 @@ function createElement<T>(parent : T, op: OP, replacing : T | null, n: VTree<T>,
       }
       break;
     case VTreeType.VComp:
-      if (n.onBeforeMounted) n.onBeforeMounted();
       mountComponent(op, parent, n, replacing, context);
       break;
     case VTreeType.VNode:
@@ -388,25 +382,24 @@ function unmountComponent<T>(c: VComp<T>): void {
 // mounts vcomp by calling into Haskell side.
 // unmount is handled with pre-destroy recursive hooks
 function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, context: DrawingContext<T>): void {
-  n.mount(parent, (componentId: ComponentId, componentTree: VNode<T>) => {
-    // mount() gives us the VTree from the Haskell side, so we just attach it here
-    // to tie the knot (attach to both vdom and real dom).
+  if (n.onBeforeMounted) n.onBeforeMounted();
+
+  // 'mount()' should be executed synchronously, including its callback function argumnet.
+  n.mount(parent, (componentId: ComponentId, componentTree: VTree<T>) => {
+    // mount() gives us the VTree from the Haskell side
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-      if (n.onMounted) n.onMounted(drill(n));          
-      switch (op) { 
-        case OP.INSERT_BEFORE:
-          context.insertBefore(parent, drill(n), replacing);
-          break;
-        case OP.APPEND:
-          context.appendChild(parent, drill(n));
-          break;
-        case OP.REPLACE:
-          context.replaceChild(parent, drill(n), replacing);
-          break;
-      }
+    switch (componentTree.type) {
+      case VTreeType.VComp:
+        // dmj: Recursive mounting case
+        mountComponent (op, parent, componentTree, replacing, context);
+        break;
+      default:
+        break;
+    }
   });
+  if (n.onMounted) n.onMounted(drill(n));
 }
 
 // Creates nodes on virtual dom (vtext, vcomp, vnode)
diff --git a/ts/miso/event.ts b/ts/miso/event.ts
index fbff6ba56..eebb3a9cc 100644
--- a/ts/miso/event.ts
+++ b/ts/miso/event.ts
@@ -102,7 +102,9 @@ function delegateEvent <T>(
       else if (obj.type === VTreeType.VComp) {
         if (!obj.child) {
           if (debug) {
-            console.warn('VComp has no child property set during event delegation', obj);
+            console.error('VComp has no child property set during event delegation', obj);
+            console.error('This means the Component has not been fully mounted, this should never happen');
+            throw new Error('VComp has no .child property set during event delegation');
           }
           return;
         }
diff --git a/ts/spec/component.spec.ts b/ts/spec/component.spec.ts
index d8c1fb488..a06bef441 100644
--- a/ts/spec/component.spec.ts
+++ b/ts/spec/component.spec.ts
@@ -312,9 +312,33 @@ describe ('Component tests', () => {
 
     // Test node is removed from DOM
     expect(document.body.children[0].tagName).toBe('DIV');
+    expect(document.body.children.length).toBe(1);
     expect(unmountCount).toBe(0);
     expect(mountCount).toBe(1);
   });
 
+  test('Should allow recursive Component mounting', () => {
+    // populate DOM
+    let component = vcomp<DOMRef>({
+      mount: (domRef, callback) => {
+        const childVComp = vcomp<DOMRef>({
+          mount: (ref, cb) => {
+            const child1 = vnode<DOMRef>({ tag: 'div' });
+            diff<DOMRef>(null, child1, ref, drawingContext);
+            cb(1, child1);
+          }
+        });
+        diff<DOMRef>(null, childVComp, domRef, drawingContext);
+        callback(0, childVComp);
+      }
+    });
+
+    diff<DOMRef>(null, component, document.body, drawingContext);
+
+    // Test component was populated
+    expect(document.childNodes.length).toBe(1);
+    expect(document.childNodes.length).toBe(1);
+    expect(document.body.children[0].tagName).toBe('DIV');
+  });
 
 })

From 6aa54282064e504b92fbf43e773fac50bf703cb4 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 19:46:44 -0600
Subject: [PATCH 30/76] Simplify not found case in syncChildren.

---
 js/miso.js      | 23 ++++-------------------
 js/miso.prod.js |  2 +-
 ts/miso/dom.ts  | 36 +++++++++++-------------------------
 3 files changed, 16 insertions(+), 45 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 795a90ea4..aed78996c 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -491,27 +491,12 @@ function syncChildren(os, ns, parent, context) {
         insertBefore(parent, node, os[oldFirstIndex], context);
         newFirstIndex++;
       } else {
-        switch (nFirst.type) {
-          case 2 /* VText */:
-            nFirst.domRef = context.createTextNode(nFirst.text);
-            switch (oFirst.type) {
-              case 0 /* VComp */:
-                context.insertBefore(parent, nFirst.domRef, drill(oFirst));
-                break;
-              default:
-                context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
-                break;
-            }
+        switch (oFirst.type) {
+          case 0 /* VComp */:
+            createElement(parent, 2 /* INSERT_BEFORE */, drill(oFirst), nFirst, context);
             break;
           default:
-            switch (oFirst.type) {
-              case 0 /* VComp */:
-                createElement(parent, 2 /* INSERT_BEFORE */, drill(oFirst), nFirst, context);
-                break;
-              default:
-                createElement(parent, 2 /* INSERT_BEFORE */, oFirst.domRef, nFirst, context);
-                break;
-            }
+            createElement(parent, 2 /* INSERT_BEFORE */, oFirst.domRef, nFirst, context);
             break;
         }
         os.splice(oldFirstIndex++, 0, nFirst);
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 9b63b17d1..cd146f470 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:z(G.child);break;default:return G.child.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function w(G,K,Q){switch(K.type){case 0:F(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:F(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function F(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{switch(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type){case 0:F(G,K,Y,U,X);break;default:break}}),Q.onMounted)Q.onMounted(z(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,J,W,O,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],W=G[X],J=G[Y],X>Y)A(null,q,Q,U),N(Q,q,W,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(W.key===q.key)A(G[X++],K[Z++],Q,U);else if(J.key===$.key)A(G[Y--],K[_--],Q,U);else if(W.key===$.key&&q.key===J.key)EG(J,W,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(W.key===$.key)N(Q,W,J.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(J.key===q.key)N(Q,J,W,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{O=!1,H=X;while(H<=Y){if(G[H].key===q.key){O=!0,a=G[H];break}H++}if(O)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,a,G[X],U),Z++;else{switch(q.type){case 2:switch(q.domRef=U.createTextNode(q.text),W.type){case 0:U.insertBefore(Q,q.domRef,z(W));break;default:U.insertBefore(Q,q.domRef,W.domRef);break}break;default:switch(W.type){case 0:D(Q,2,z(W),q,U);break;default:D(Q,2,W.domRef,q,U);break}break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function f(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),w(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),w(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return V(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return V(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[J,W]of $.headers)H[J]=W;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let J=JSON.parse($.data);if(X)X(J)}catch(J){if(H&&U)U($.data);else _(J.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:j,version:b,delegate:f,callBlur:h,callFocus:g,callSelect:T,callSetSelectionRange:u,eventJSON:E,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:C,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:z(G.child);break;default:return G.child.domRef}}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:w(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:w(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function w(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{switch(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type){case 0:w(G,K,Y,U,X);break;default:break}}),Q.onMounted)Q.onMounted(z(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,W,J,F,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],W=G[Y],X>Y)A(null,q,Q,U),N(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(J.key===q.key)A(G[X++],K[Z++],Q,U);else if(W.key===$.key)A(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===W.key)EG(W,J,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(J.key===$.key)N(Q,J,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(W.key===q.key)N(Q,W,J,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{F=!1,H=X;while(H<=Y){if(G[H].key===q.key){F=!0,a=G[H];break}H++}if(F)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,a,G[X],U),Z++;else{switch(J.type){case 0:D(Q,2,z(J),q,U);break;default:D(Q,2,J.domRef,q,U);break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function f(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,J]of $.headers)H[W]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(H&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:j,version:b,delegate:f,callBlur:h,callFocus:g,callSelect:T,callSetSelectionRange:u,eventJSON:E,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:V,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index ff7e4d4ce..ca595c3aa 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -399,6 +399,7 @@ function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, contex
         break;
     }
   });
+
   if (n.onMounted) n.onMounted(drill(n));
 }
 
@@ -632,32 +633,17 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
         -> [ b e a j   ] <- new children
              ^
         */ else {
-            switch (nFirst.type) {
-              case VTreeType.VText:
-                nFirst.domRef = context.createTextNode(nFirst.text);
-                switch (oFirst.type) {
-                  case VTreeType.VComp:
-                    context.insertBefore(parent, nFirst.domRef, drill(oFirst));
-                    break;
-                  default:
-                    context.insertBefore(parent, nFirst.domRef, oFirst.domRef);
-                    break;
-                }
-                break;
-              default:
-                switch (oFirst.type) {
-                  case VTreeType.VComp:
-                    createElement(parent, OP.INSERT_BEFORE, drill(oFirst), nFirst, context);
-                    break;
-                  default:
-                    createElement(parent, OP.INSERT_BEFORE, oFirst.domRef, nFirst, context);
-                    break;
+            switch (oFirst.type) {
+               case VTreeType.VComp:
+                 createElement(parent, OP.INSERT_BEFORE, drill(oFirst), nFirst, context);
+                 break;
+               default:
+                 createElement(parent, OP.INSERT_BEFORE, oFirst.domRef, nFirst, context);
+                 break;
             }
-            break;
-          }
-        os.splice(oldFirstIndex++, 0, nFirst);
-        newFirstIndex++;
-        oldLastIndex++;
+            os.splice(oldFirstIndex++, 0, nFirst);
+            newFirstIndex++;
+            oldLastIndex++;
       }
     }
   }

From 8a0385cc9439466d13c1f46943118d07f6ac3347 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:01:52 -0600
Subject: [PATCH 31/76] Handle DOM operations in `mount()`.

---
 ts/miso/dom.ts | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index ca595c3aa..376fd3614 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -396,6 +396,13 @@ function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, contex
         mountComponent (op, parent, componentTree, replacing, context);
         break;
       default:
+        // Handle DOM placement for non-VComp child nodes
+        if (op === OP.REPLACE && replacing) {
+          context.replaceChild(parent, componentTree.domRef, replacing);
+        } else if (op === OP.INSERT_BEFORE) {
+          context.insertBefore(parent, componentTree.domRef, replacing);
+        }
+        // For OP.APPEND, the mount function should have already appended
         break;
     }
   });

From 608a928224a5f38ef5a84c8a75043e2aaa5cc044 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:07:55 -0600
Subject: [PATCH 32/76] Add getDOMRef helper

---
 ts/miso/dom.ts | 111 +++++++++++++------------------------------------
 1 file changed, 28 insertions(+), 83 deletions(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 376fd3614..fe02422e7 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -33,7 +33,7 @@ function diffVText<T>(c: VText<T>, n: VText<T>, context : DrawingContext<T>): vo
   return;
 }
 
-// c.child should never be null
+//c.child should never be null
 export function drill<T>(c: VComp<T>): T {
   if (!c.child) throw new Error ("'drill' called on an unmounted Component. This should never happen, please make an issue.");
   switch (c.child.type) {
@@ -45,6 +45,16 @@ export function drill<T>(c: VComp<T>): T {
   }
 }
 
+// Extract DOM reference from any VTree (handles VComp drilling)
+function getDOMRef<T>(tree: VTree<T>): T {
+  switch (tree.type) {
+    case VTreeType.VComp:
+      return drill(tree);
+    default:
+      return tree.domRef;
+  }
+}
+
 
 // replace everything function
 function replace<T>(c: VTree<T>, n: VTree<T>, parent: T, context : DrawingContext<T>): void {
@@ -390,20 +400,18 @@ function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, contex
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-    switch (componentTree.type) {
-      case VTreeType.VComp:
-        // dmj: Recursive mounting case
-        mountComponent (op, parent, componentTree, replacing, context);
-        break;
-      default:
-        // Handle DOM placement for non-VComp child nodes
-        if (op === OP.REPLACE && replacing) {
-          context.replaceChild(parent, componentTree.domRef, replacing);
-        } else if (op === OP.INSERT_BEFORE) {
-          context.insertBefore(parent, componentTree.domRef, replacing);
-        }
-        // For OP.APPEND, the mount function should have already appended
-        break;
+    if (componentTree.type === VTreeType.VComp) {
+      // Recursive mounting case
+      mountComponent(op, parent, componentTree, replacing, context);
+    } else {
+      // Handle DOM placement for non-VComp child nodes
+      const childDomRef = getDOMRef(componentTree);
+      if (op === OP.REPLACE && replacing) {
+        context.replaceChild(parent, childDomRef, replacing);
+      } else if (op === OP.INSERT_BEFORE) {
+        context.insertBefore(parent, childDomRef, replacing);
+      }
+      // For OP.APPEND, the mount function should have already appended
     }
   });
 
@@ -421,72 +429,16 @@ function create<T>(n: VTree<T>, parent: T, context: DrawingContext<T>): void {
 }
 
 function insertBefore<T>(parent: T, n: VTree<T>, o: VTree<T> | null, context: DrawingContext<T>): void {
-  switch (n.type) {
-    case VTreeType.VComp:
-      if (!o) {
-        context.insertBefore(parent, drill(n), null);
-      } else {
-        switch (o.type) {
-          case VTreeType.VComp:
-            context.insertBefore(parent, drill(n), drill(o));
-            break;
-          default:
-            context.insertBefore(parent, drill(n), o.domRef);
-            break;
-        }
-      }
-      break;
-    default:
-      if (!o) {
-        context.insertBefore(parent, n.domRef, null);
-      } else {
-        switch (o.type) {
-          case VTreeType.VComp:
-            context.insertBefore(parent, n.domRef, drill(o));
-            break;
-          default:
-            context.insertBefore(parent, n.domRef, o.domRef);
-            break;
-        }
-      }
-   }
+  context.insertBefore(parent, getDOMRef(n), o ? getDOMRef(o) : null);
 } 
 
 function removeChild<T>(parent: T, n: VTree<T>, context: DrawingContext<T>): void {
-  switch (n.type) {
-    case VTreeType.VComp:
-      context.removeChild(parent, drill(n));
-      break;
-    default:
-      context.removeChild(parent, n.domRef);
-      break;
-  }
+  context.removeChild(parent, getDOMRef(n));
 }
 
 function swapDOMRef<T>(oFirst: VTree<T>, oLast: VTree<T>, parent: T, context: DrawingContext<T>): void {
-   switch (oLast.type) {
-       case VTreeType.VComp:
-          switch (oFirst.type) {
-            case VTreeType.VComp:
-              context.swapDOMRefs(drill(oLast), drill(oFirst), parent);
-              break;
-            default:
-              context.swapDOMRefs(drill(oLast), oFirst.domRef, parent);
-              break;              
-          } 
-          break;
-        default:
-          switch (oFirst.type) {
-            case VTreeType.VComp:
-              context.swapDOMRefs(oLast.domRef, drill(oFirst), parent);
-              break;
-            default:
-              context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
-              break;              
-          }
-          break;  
-      }
-  }
+  context.swapDOMRefs(getDOMRef(oLast), getDOMRef(oFirst), parent);
+}
 
 /* Child reconciliation algorithm, inspired by kivi and Bobril */
 function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, context: DrawingContext<T>): void {
@@ -640,14 +592,7 @@ function syncChildren<T>(os: Array<VTree<T>>, ns: Array<VTree<T>>, parent: T, co
         -> [ b e a j   ] <- new children
              ^
         */ else {
-            switch (oFirst.type) {
-               case VTreeType.VComp:
-                 createElement(parent, OP.INSERT_BEFORE, drill(oFirst), nFirst, context);
-                 break;
-               default:
-                 createElement(parent, OP.INSERT_BEFORE, oFirst.domRef, nFirst, context);
-                 break;
-            }
+            createElement(parent, OP.INSERT_BEFORE, getDOMRef(oFirst), nFirst, context);
             os.splice(oldFirstIndex++, 0, nFirst);
             newFirstIndex++;
             oldLastIndex++;

From 8cb8b47459e7e6a2672e499ee05ac4051e6551c8 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:16:32 -0600
Subject: [PATCH 33/76] Add recursive vcomp mounting delegation test case

---
 ts/spec/event.spec.ts | 78 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 78 insertions(+)

diff --git a/ts/spec/event.spec.ts b/ts/spec/event.spec.ts
index 506acb114..8cb90a8f6 100644
--- a/ts/spec/event.spec.ts
+++ b/ts/spec/event.spec.ts
@@ -458,4 +458,82 @@ describe ('Event tests', () => {
     undelegate(document.body, delegatedEvents, getVTree, true, eventContext);
   });
 
+  test('Should delegate events through recursively mounted components (vcomp -> vcomp -> vnode)', () => {
+    var body = document.body;
+    var count = 0;
+    var events = {
+      captures: {},
+      bubbles: {
+        click: {
+          runEvent: (e: Event, o: Node) => {
+            count++;
+          },
+          options: {
+            preventDefault: true,
+            stopPropagation: false,
+          },
+        }
+      }
+    };
+
+    // Innermost vnode with button that has click event
+    var innerNode = vnode({
+      tag: 'div',
+      children: [vnode({ tag: 'button', events })],
+      events
+    });
+
+    // Middle vcomp wrapping the vnode
+    var middleVComp = vcomp({
+      eventPropagation: true,
+      mount: function (p, f) {
+        diff(null, innerNode, p, drawingContext);
+        return f(1, innerNode);
+      }
+    });
+
+    // Outer vcomp wrapping the middle vcomp
+    var outerVComp = vcomp({
+      eventPropagation: true,
+      mount: function (p, f) {
+        diff(null, middleVComp, p, drawingContext);
+        return f(0, middleVComp);
+      }
+    });
+
+    // Set up parent hierarchy
+    const buttonNode = innerNode.children[0] as VNode<DOMRef>;
+    (buttonNode as any).parent = innerNode;
+    (innerNode as any).parent = middleVComp;
+    (middleVComp as any).parent = outerVComp;
+
+    /* initial page draw */
+    diff(null, outerVComp, document.body, drawingContext);
+
+    /* verify DOM structure is correct - recursively mounted components create the inner div */
+    expect(document.body.childNodes.length).toBeGreaterThanOrEqual(1);
+    const divElement = Array.from(document.body.childNodes).find(
+      node => (node as Element).tagName === 'DIV'
+    ) as Element;
+    expect(divElement).toBeDefined();
+    expect(divElement.tagName).toBe('DIV');
+
+    /* setup event delegation */
+    var getVTree = (cb: any) => {
+      cb(outerVComp);
+    };
+    const delegatedEvents: Array<EventCapture> = [{ name: 'click', capture: true }];
+    delegate(body, delegatedEvents, getVTree, true, eventContext);
+
+    /* initiate click event on the button inside nested components */
+    const button = buttonNode.domRef as HTMLElement;
+    button.click();
+
+    /* check results - event should propagate through the component hierarchy */
+    expect(count).toEqual(2);
+
+    /* unmount delegation */
+    undelegate(document.body, delegatedEvents, getVTree, true, eventContext);
+  });
+
 });

From c195fc1250f02dbb543b038d07d116608781de4d Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:17:55 -0600
Subject: [PATCH 34/76] Regen JS

---
 js/miso.js      | 94 +++++++++++--------------------------------------
 js/miso.prod.js |  2 +-
 2 files changed, 22 insertions(+), 74 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index aed78996c..bdf0702ab 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -41,6 +41,14 @@ function drill(c) {
       return c.child.domRef;
   }
 }
+function getDOMRef(tree) {
+  switch (tree.type) {
+    case 0 /* VComp */:
+      return drill(tree);
+    default:
+      return tree.domRef;
+  }
+}
 function replace(c, n, parent, context) {
   switch (c.type) {
     case 2 /* VText */:
@@ -350,12 +358,15 @@ function mountComponent(op, parent, n, replacing, context) {
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-    switch (componentTree.type) {
-      case 0 /* VComp */:
-        mountComponent(op, parent, componentTree, replacing, context);
-        break;
-      default:
-        break;
+    if (componentTree.type === 0 /* VComp */) {
+      mountComponent(op, parent, componentTree, replacing, context);
+    } else {
+      const childDomRef = getDOMRef(componentTree);
+      if (op === 1 /* REPLACE */ && replacing) {
+        context.replaceChild(parent, childDomRef, replacing);
+      } else if (op === 2 /* INSERT_BEFORE */) {
+        context.insertBefore(parent, childDomRef, replacing);
+      }
     }
   });
   if (n.onMounted)
@@ -370,69 +381,13 @@ function create(n, parent, context) {
   }
 }
 function insertBefore(parent, n, o, context) {
-  switch (n.type) {
-    case 0 /* VComp */:
-      if (!o) {
-        context.insertBefore(parent, drill(n), null);
-      } else {
-        switch (o.type) {
-          case 0 /* VComp */:
-            context.insertBefore(parent, drill(n), drill(o));
-            break;
-          default:
-            context.insertBefore(parent, drill(n), o.domRef);
-            break;
-        }
-      }
-      break;
-    default:
-      if (!o) {
-        context.insertBefore(parent, n.domRef, null);
-      } else {
-        switch (o.type) {
-          case 0 /* VComp */:
-            context.insertBefore(parent, n.domRef, drill(o));
-            break;
-          default:
-            context.insertBefore(parent, n.domRef, o.domRef);
-            break;
-        }
-      }
-  }
+  context.insertBefore(parent, getDOMRef(n), o ? getDOMRef(o) : null);
 }
 function removeChild(parent, n, context) {
-  switch (n.type) {
-    case 0 /* VComp */:
-      context.removeChild(parent, drill(n));
-      break;
-    default:
-      context.removeChild(parent, n.domRef);
-      break;
-  }
+  context.removeChild(parent, getDOMRef(n));
 }
 function swapDOMRef(oFirst, oLast, parent, context) {
-  switch (oLast.type) {
-    case 0 /* VComp */:
-      switch (oFirst.type) {
-        case 0 /* VComp */:
-          context.swapDOMRefs(drill(oLast), drill(oFirst), parent);
-          break;
-        default:
-          context.swapDOMRefs(drill(oLast), oFirst.domRef, parent);
-          break;
-      }
-      break;
-    default:
-      switch (oFirst.type) {
-        case 0 /* VComp */:
-          context.swapDOMRefs(oLast.domRef, drill(oFirst), parent);
-          break;
-        default:
-          context.swapDOMRefs(oLast.domRef, oFirst.domRef, parent);
-          break;
-      }
-      break;
-  }
+  context.swapDOMRefs(getDOMRef(oLast), getDOMRef(oFirst), parent);
 }
 function syncChildren(os, ns, parent, context) {
   var oldFirstIndex = 0, newFirstIndex = 0, oldLastIndex = os.length - 1, newLastIndex = ns.length - 1, tmp, nFirst, nLast, oLast, oFirst, found, node;
@@ -491,14 +446,7 @@ function syncChildren(os, ns, parent, context) {
         insertBefore(parent, node, os[oldFirstIndex], context);
         newFirstIndex++;
       } else {
-        switch (oFirst.type) {
-          case 0 /* VComp */:
-            createElement(parent, 2 /* INSERT_BEFORE */, drill(oFirst), nFirst, context);
-            break;
-          default:
-            createElement(parent, 2 /* INSERT_BEFORE */, oFirst.domRef, nFirst, context);
-            break;
-        }
+        createElement(parent, 2 /* INSERT_BEFORE */, getDOMRef(oFirst), nFirst, context);
         os.splice(oldFirstIndex++, 0, nFirst);
         newFirstIndex++;
         oldLastIndex++;
diff --git a/js/miso.prod.js b/js/miso.prod.js
index cd146f470..0982609bf 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function A(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}O(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else O(G,K,Q,U);else O(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function z(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:z(G.child);break;default:return G.child.domRef}}function O(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),z(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,z(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(G.type){case 0:Q.removeChild(K,z(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function L(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)A(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:w(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:w(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(z(G));G.unmount(G.componentId)}function w(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{switch(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type){case 0:w(G,K,Y,U,X);break;default:break}}),Q.onMounted)Q.onMounted(z(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function N(G,K,Q,U){switch(K.type){case 0:if(!Q)U.insertBefore(G,z(K),null);else switch(Q.type){case 0:U.insertBefore(G,z(K),z(Q));break;default:U.insertBefore(G,z(K),Q.domRef);break}break;default:if(!Q)U.insertBefore(G,K.domRef,null);else switch(Q.type){case 0:U.insertBefore(G,K.domRef,z(Q));break;default:U.insertBefore(G,K.domRef,Q.domRef);break}}}function BG(G,K,Q){switch(K.type){case 0:Q.removeChild(G,z(K));break;default:Q.removeChild(G,K.domRef);break}}function EG(G,K,Q,U){switch(K.type){case 0:switch(G.type){case 0:U.swapDOMRefs(z(K),z(G),Q);break;default:U.swapDOMRefs(z(K),G.domRef,Q);break}break;default:switch(G.type){case 0:U.swapDOMRefs(K.domRef,z(G),Q);break;default:U.swapDOMRefs(K.domRef,G.domRef,Q);break}break}}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,H,q,$,W,J,F,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],W=G[Y],X>Y)A(null,q,Q,U),N(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){H=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,H-X+1);break}else if(J.key===q.key)A(G[X++],K[Z++],Q,U);else if(W.key===$.key)A(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===W.key)EG(W,J,Q,U),RG(G,X,Y),A(G[X++],K[Z++],Q,U),A(G[Y--],K[_--],Q,U);else if(J.key===$.key)N(Q,J,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),A(G[Y--],K[_--],Q,U);else if(W.key===q.key)N(Q,W,J,U),G.splice(X,0,G.splice(Y,1)[0]),A(G[X++],q,Q,U),Z++;else{F=!1,H=X;while(H<=Y){if(G[H].key===q.key){F=!0,a=G[H];break}H++}if(F)G.splice(X,0,G.splice(H,1)[0]),A(G[X++],q,Q,U),N(Q,a,G[X],U),Z++;else{switch(J.type){case 0:D(Q,2,z(J),q,U);break;default:D(Q,2,J.domRef,q,U);break}G.splice(X++,0,q),Z++,Y++}}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function f(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);B(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function B(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return B(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=z(Z);if(Y&&X.isEqual(Y,Q[0]))B(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))B(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)B(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function E(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(E(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(E([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return C(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return C(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),t(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let H={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,J]of $.headers)H[W]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:H,status:q})}).then(($)=>X({error:null,body:$,headers:H,status:q})).catch(($)=>Z({error:null,body:$,headers:H,status:q}))}catch($){Z({body:null,error:$.message,headers:H,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,H){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(H){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(H&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let H=JSON.parse(_.data);if(U)U(H)}catch(H){if(Z&&Q)Q(_.data);else X(H.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return z(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:A,hydrate:j,version:b,delegate:f,callBlur:h,callFocus:g,callSelect:T,callSetSelectionRange:u,eventJSON:E,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:V,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function J(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:J(G.child);break;default:return G.child.domRef}}function B(G){switch(G.type){case 0:return J(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:M(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),J(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,J(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,J(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:M(G);break}switch(G.type){case 0:Q.removeChild(K,J(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function M(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;M(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)M(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(J(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type===0)V(G,K,Y,U,X);else{let _=B(Y);if(G===1&&U)X.replaceChild(K,_,U);else if(G===2)X.insertBefore(K,_,U)}}),Q.onMounted)Q.onMounted(J(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function S(G,K,Q,U){U.insertBefore(G,B(K),Q?B(Q):null)}function EG(G,K,Q){Q.removeChild(G,B(K))}function NG(G,K,Q,U){U.swapDOMRefs(B(K),B(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),S(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)S(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)S(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),S(Q,s,G[X],U),Z++;else D(Q,2,B(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=J(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var h="1.9.0.0";function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return J(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:h,delegate:C,callBlur:g,callFocus:T,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From 58f49e8c0160bfe51f9d36dd616e7f0e63718be3 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:26:52 -0600
Subject: [PATCH 35/76] Add more DOMRef

---
 ts/miso/dom.ts | 40 ++++++----------------------------------
 1 file changed, 6 insertions(+), 34 deletions(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index fe02422e7..9ed96e81d 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -68,36 +68,15 @@ function replace<T>(c: VTree<T>, n: VTree<T>, parent: T, context : DrawingContex
   }
   switch (n.type) {
       case VTreeType.VText:
-          switch (c.type) {
-              case VTreeType.VComp:
-                context.replaceChild(parent, context.createTextNode(n.text), drill(c));
-                break;
-              default:
-                n.domRef = context.createTextNode(n.text);
-                context.replaceChild(parent, n.domRef, c.domRef);
-                break;
-          }
+          n.domRef = context.createTextNode(n.text);
+          context.replaceChild(parent, n.domRef, getDOMRef(c));
           break;
       case VTreeType.VComp:
-          switch (c.type) {
-            case VTreeType.VComp:
-              createElement(parent, OP.REPLACE, drill(c), n, context);
-              break;
-           default:
-             createElement(parent, OP.REPLACE, c.domRef, n, context);
-             break;
-          }
+          createElement(parent, OP.REPLACE, getDOMRef(c), n, context);
           break;
       case VTreeType.VNode:
-        switch (c.type) {
-          case VTreeType.VComp:
-            createElement(parent, OP.REPLACE, drill(c), n, context);
-            break;
-          default:
-            createElement(parent, OP.REPLACE, c.domRef, n, context);
-            break;
-        }
-        break;    
+          createElement(parent, OP.REPLACE, getDOMRef(c), n, context);
+          break;    
   }
   // step 3: call destroyed hooks, call created hooks
   switch (c.type) {
@@ -120,14 +99,7 @@ function destroy<T>(c: VTree<T>, parent: T, context: DrawingContext<T>): void {
           break;
   }
   // step 2: destroy
-  switch (c.type) {
-      case VTreeType.VComp:
-          context.removeChild(parent, drill(c));
-          break;
-      default:
-        context.removeChild(parent, c.domRef);
-        break;
-  }
+  context.removeChild(parent, getDOMRef(c));
   // step 3: invoke post-hooks for vnode and vcomp
   switch (c.type) {
       case VTreeType.VText:

From 0b4b30ebe6166a9d819d95a7a752339537761d49 Mon Sep 17 00:00:00 2001
From: "David M. Johnson" <875324+dmjio@users.noreply.github.com>
Date: Thu, 11 Dec 2025 20:28:21 -0600
Subject: [PATCH 36/76] Revise comments for 'mount_' function

Update documentation for 'mount_' function in Types.hs
---
 src/Miso/Types.hs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index d4d8f99cf..33d049da0 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -307,7 +307,7 @@ mount_
   -> View p action
 mount_ attrs vcomp = VComp attrs (SomeComponent vcomp)
 -----------------------------------------------------------------------------
--- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
+-- | 'Component' mounting combinator.
 --
 -- Note: only use this if you're certain you won't be diffing two 'Component'
 -- against each other. Otherwise, you will need a key to distinguish between

From 18c68bdeef1ca86d707a4c95766ddd0a5d1400e7 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:30:20 -0600
Subject: [PATCH 37/76] Regen JS

---
 js/miso.js      | 38 +++++---------------------------------
 js/miso.prod.js |  2 +-
 2 files changed, 6 insertions(+), 34 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index bdf0702ab..37fe5aec5 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -59,35 +59,14 @@ function replace(c, n, parent, context) {
   }
   switch (n.type) {
     case 2 /* VText */:
-      switch (c.type) {
-        case 0 /* VComp */:
-          context.replaceChild(parent, context.createTextNode(n.text), drill(c));
-          break;
-        default:
-          n.domRef = context.createTextNode(n.text);
-          context.replaceChild(parent, n.domRef, c.domRef);
-          break;
-      }
+      n.domRef = context.createTextNode(n.text);
+      context.replaceChild(parent, n.domRef, getDOMRef(c));
       break;
     case 0 /* VComp */:
-      switch (c.type) {
-        case 0 /* VComp */:
-          createElement(parent, 1 /* REPLACE */, drill(c), n, context);
-          break;
-        default:
-          createElement(parent, 1 /* REPLACE */, c.domRef, n, context);
-          break;
-      }
+      createElement(parent, 1 /* REPLACE */, getDOMRef(c), n, context);
       break;
     case 1 /* VNode */:
-      switch (c.type) {
-        case 0 /* VComp */:
-          createElement(parent, 1 /* REPLACE */, drill(c), n, context);
-          break;
-        default:
-          createElement(parent, 1 /* REPLACE */, c.domRef, n, context);
-          break;
-      }
+      createElement(parent, 1 /* REPLACE */, getDOMRef(c), n, context);
       break;
   }
   switch (c.type) {
@@ -106,14 +85,7 @@ function destroy(c, parent, context) {
       callBeforeDestroyedRecursive(c);
       break;
   }
-  switch (c.type) {
-    case 0 /* VComp */:
-      context.removeChild(parent, drill(c));
-      break;
-    default:
-      context.removeChild(parent, c.domRef);
-      break;
-  }
+  context.removeChild(parent, getDOMRef(c));
   switch (c.type) {
     case 2 /* VText */:
       break;
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 0982609bf..98e57ec6a 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)DG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function J(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:J(G.child);break;default:return G.child.domRef}}function B(G){switch(G.type){case 0:return J(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:M(G);break}switch(K.type){case 2:switch(G.type){case 0:U.replaceChild(Q,U.createTextNode(K.text),J(G));break;default:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,G.domRef);break}break;case 0:switch(G.type){case 0:D(Q,1,J(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break;case 1:switch(G.type){case 0:D(Q,1,J(G),K,U);break;default:D(Q,1,G.domRef,K,U);break}break}switch(G.type){case 2:break;default:R(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:M(G);break}switch(G.type){case 0:Q.removeChild(K,J(G));break;default:Q.removeChild(K,G.domRef);break}switch(G.type){case 2:break;default:R(G);break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)R(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function M(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;M(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)M(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function D(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(J(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type===0)V(G,K,Y,U,X);else{let _=B(Y);if(G===1&&U)X.replaceChild(K,_,U);else if(G===2)X.insertBefore(K,_,U)}}),Q.onMounted)Q.onMounted(J(Q))}function DG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else D(K,0,null,G,Q)}function S(G,K,Q,U){U.insertBefore(G,B(K),Q?B(Q):null)}function EG(G,K,Q){Q.removeChild(G,B(K))}function NG(G,K,Q,U){U.swapDOMRefs(B(K),B(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),S(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)S(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)S(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),S(Q,s,G[X],U),Z++;else D(Q,2,B(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=J(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var h="1.9.0.0";function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return J(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:h,delegate:C,callBlur:g,callFocus:T,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:B(G.child);break;default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type===0)V(G,K,Y,U,X);else{let _=A(Y);if(G===1&&U)X.replaceChild(K,_,U);else if(G===2)X.insertBefore(K,_,U)}}),Q.onMounted)Q.onMounted(B(Q))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From 8d1e2ac4c767aab96e6012096f0094ba64a0c4ae Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:46:05 -0600
Subject: [PATCH 38/76] Shuffle argument order

---
 js/miso.js      | 8 ++++----
 js/miso.prod.js | 2 +-
 ts/miso/dom.ts  | 8 ++++----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 37fe5aec5..1e795011b 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -266,7 +266,7 @@ function populateDomRef(c, context) {
 function callCreated(parent, n, context) {
   switch (n.type) {
     case 0 /* VComp */:
-      mountComponent(0 /* APPEND */, parent, n, null, context);
+      mountComponent(parent, 0 /* APPEND */, null, n, context);
       break;
     case 1 /* VNode */:
       if (n.onCreated)
@@ -291,7 +291,7 @@ function createElement(parent, op, replacing, n, context) {
       }
       break;
     case 0 /* VComp */:
-      mountComponent(op, parent, n, replacing, context);
+      mountComponent(parent, op, replacing, n, context);
       break;
     case 1 /* VNode */:
       if (n.onBeforeCreated)
@@ -323,7 +323,7 @@ function unmountComponent(c) {
     c.onUnmounted(drill(c));
   c.unmount(c.componentId);
 }
-function mountComponent(op, parent, n, replacing, context) {
+function mountComponent(parent, op, replacing, n, context) {
   if (n.onBeforeMounted)
     n.onBeforeMounted();
   n.mount(parent, (componentId, componentTree) => {
@@ -331,7 +331,7 @@ function mountComponent(op, parent, n, replacing, context) {
     n.child = componentTree;
     componentTree.parent = n;
     if (componentTree.type === 0 /* VComp */) {
-      mountComponent(op, parent, componentTree, replacing, context);
+      mountComponent(parent, op, replacing, componentTree, context);
     } else {
       const childDomRef = getDOMRef(componentTree);
       if (op === 1 /* REPLACE */ && replacing) {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 98e57ec6a..76156a40c 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:B(G.child);break;default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(0,G,K,null,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(K,G,U,Q,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(Q.onBeforeMounted)Q.onBeforeMounted();if(Q.mount(K,(Z,Y)=>{if(Q.componentId=Z,Q.child=Y,Y.parent=Q,Y.type===0)V(G,K,Y,U,X);else{let _=A(Y);if(G===1&&U)X.replaceChild(K,_,U);else if(G===2)X.insertBefore(K,_,U)}}),Q.onMounted)Q.onMounted(B(Q))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:B(G.child);break;default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type===0)V(G,K,Q,Y,X);else{let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 9ed96e81d..962942c11 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -302,7 +302,7 @@ function populateDomRef<T>(c: VNode<T>, context: DrawingContext<T>): void {
 export function callCreated<T>(parent: T, n: VComp<T> | VNode<T>, context: DrawingContext<T>): void {
   switch (n.type) {
       case VTreeType.VComp:
-          mountComponent(OP.APPEND, parent, n, null, context);
+          mountComponent(parent, OP.APPEND, null, n, context);
           break;
       case VTreeType.VNode:
           if (n.onCreated) n.onCreated(n.domRef);
@@ -327,7 +327,7 @@ function createElement<T>(parent : T, op: OP, replacing : T | null, n: VTree<T>,
       }
       break;
     case VTreeType.VComp:
-      mountComponent(op, parent, n, replacing, context);
+      mountComponent(parent, op, replacing, n as VComp<T>, context);
       break;
     case VTreeType.VNode:
       if (n.onBeforeCreated) n.onBeforeCreated();
@@ -363,7 +363,7 @@ function unmountComponent<T>(c: VComp<T>): void {
 
 // mounts vcomp by calling into Haskell side.
 // unmount is handled with pre-destroy recursive hooks
-function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, context: DrawingContext<T>): void {
+function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>, context: DrawingContext<T>): void {
   if (n.onBeforeMounted) n.onBeforeMounted();
 
   // 'mount()' should be executed synchronously, including its callback function argumnet.
@@ -374,7 +374,7 @@ function mountComponent<T>(op : OP, parent: T, n: VComp<T>, replacing: T, contex
     componentTree.parent = n;
     if (componentTree.type === VTreeType.VComp) {
       // Recursive mounting case
-      mountComponent(op, parent, componentTree, replacing, context);
+      mountComponent(parent, op, replacing, componentTree, context);
     } else {
       // Handle DOM placement for non-VComp child nodes
       const childDomRef = getDOMRef(componentTree);

From 416e8733cd68749888f8254e356020a3c65d97d7 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 20:52:42 -0600
Subject: [PATCH 39/76] return drill

---
 js/miso.js      | 2 +-
 js/miso.prod.js | 2 +-
 ts/miso/dom.ts  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 1e795011b..198037c66 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -35,7 +35,7 @@ function drill(c) {
     throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");
   switch (c.child.type) {
     case 0 /* VComp */:
-      drill(c.child);
+      return drill(c.child);
       break;
     default:
       return c.child.domRef;
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 76156a40c..90b419110 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:B(G.child);break;default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type===0)V(G,K,Q,Y,X);else{let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type===0)V(G,K,Q,Y,X);else{let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 962942c11..088bc223e 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -38,7 +38,7 @@ export function drill<T>(c: VComp<T>): T {
   if (!c.child) throw new Error ("'drill' called on an unmounted Component. This should never happen, please make an issue.");
   switch (c.child.type) {
     case VTreeType.VComp:
-      drill (c.child)
+      return drill (c.child)
       break;
     default:
       return c.child.domRef;

From 645aee965ed642534e9e40698c8f5a73c3b0b1c6 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 21:00:07 -0600
Subject: [PATCH 40/76] Update recursive component mounting

---
 js/miso.js                | 4 +---
 js/miso.prod.js           | 2 +-
 ts/miso/dom.ts            | 5 +----
 ts/spec/component.spec.ts | 3 +--
 4 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 198037c66..62b96cf51 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -330,9 +330,7 @@ function mountComponent(parent, op, replacing, n, context) {
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-    if (componentTree.type === 0 /* VComp */) {
-      mountComponent(parent, op, replacing, componentTree, context);
-    } else {
+    if (componentTree.type !== 0 /* VComp */) {
       const childDomRef = getDOMRef(componentTree);
       if (op === 1 /* REPLACE */ && replacing) {
         context.replaceChild(parent, childDomRef, replacing);
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 90b419110..9b784cb41 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:V(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:V(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function V(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type===0)V(G,K,Q,Y,X);else{let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,s;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,s=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,s,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function C(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function f(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function k(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function j(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function b(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return j(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return j(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return j(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var T="1.9.0.0";function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function u(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function y(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function m(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function v(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function i(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function d(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function p(G){if(G)G.close(),G=null}function a(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:k,version:T,delegate:C,callBlur:g,callFocus:h,callSelect:u,callSetSelectionRange:y,eventJSON:N,fetchCore:m,eventSourceConnect:d,eventSourceClose:p,websocketConnect:i,websocketClose:l,websocketSend:x,undelegate:f,populateClass:a,getParentComponentId:v,integrityCheck:b,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,a=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,a,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:j,version:b,delegate:V,callBlur:h,callFocus:T,callSelect:g,callSetSelectionRange:u,eventJSON:N,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:C,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 088bc223e..a2e896a97 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -372,10 +372,7 @@ function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>,
     n.componentId = componentId;
     n.child = componentTree;
     componentTree.parent = n;
-    if (componentTree.type === VTreeType.VComp) {
-      // Recursive mounting case
-      mountComponent(parent, op, replacing, componentTree, context);
-    } else {
+    if (componentTree.type !== VTreeType.VComp) {
       // Handle DOM placement for non-VComp child nodes
       const childDomRef = getDOMRef(componentTree);
       if (op === OP.REPLACE && replacing) {
diff --git a/ts/spec/component.spec.ts b/ts/spec/component.spec.ts
index a06bef441..d98b05f52 100644
--- a/ts/spec/component.spec.ts
+++ b/ts/spec/component.spec.ts
@@ -336,8 +336,7 @@ describe ('Component tests', () => {
     diff<DOMRef>(null, component, document.body, drawingContext);
 
     // Test component was populated
-    expect(document.childNodes.length).toBe(1);
-    expect(document.childNodes.length).toBe(1);
+    expect(document.body.childNodes.length).toBe(1);
     expect(document.body.children[0].tagName).toBe('DIV');
   });
 

From 7b3c86e8c5f0993ec1a8bb74cb53a6053232efd0 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Thu, 11 Dec 2025 21:38:05 -0600
Subject: [PATCH 41/76] Update test

---
 ts/spec/component.spec.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ts/spec/component.spec.ts b/ts/spec/component.spec.ts
index d98b05f52..d0ebf190c 100644
--- a/ts/spec/component.spec.ts
+++ b/ts/spec/component.spec.ts
@@ -270,7 +270,7 @@ describe ('Component tests', () => {
     diff<DOMRef>(null, component, document.body, drawingContext);
 
     // Test component was populated
-    expect(document.childNodes.length).toBe(1);
+    expect(document.body.childNodes.length).toBe(1);
     expect(mountCount).toBe(1);
     expect(unmountCount).toBe(0);
 
@@ -303,7 +303,7 @@ describe ('Component tests', () => {
     diff<DOMRef>(null, node, document.body, drawingContext);
 
     // Test component was populated
-    expect(document.childNodes.length).toBe(1);
+    expect(document.body.childNodes.length).toBe(1);
     expect(mountCount).toBe(0);
     expect(unmountCount).toBe(0);
 

From c39883f89045253ca4e873a541d0e8fbef838dce Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 22:24:18 -0600
Subject: [PATCH 42/76] Drop break;

---
 js/miso.js     | 1 -
 ts/miso/dom.ts | 1 -
 2 files changed, 2 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 62b96cf51..b84bf0391 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -36,7 +36,6 @@ function drill(c) {
   switch (c.child.type) {
     case 0 /* VComp */:
       return drill(c.child);
-      break;
     default:
       return c.child.domRef;
   }
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index a2e896a97..a45b6b430 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -39,7 +39,6 @@ export function drill<T>(c: VComp<T>): T {
   switch (c.child.type) {
     case VTreeType.VComp:
       return drill (c.child)
-      break;
     default:
       return c.child.domRef;
   }

From 10cb58e360ee2098bf1ebd877b036369952b25c1 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Thu, 11 Dec 2025 22:25:39 -0600
Subject: [PATCH 43/76] sp

---
 ts/miso/dom.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index a45b6b430..c8b248c08 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -365,7 +365,7 @@ function unmountComponent<T>(c: VComp<T>): void {
 function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>, context: DrawingContext<T>): void {
   if (n.onBeforeMounted) n.onBeforeMounted();
 
-  // 'mount()' should be executed synchronously, including its callback function argumnet.
+  // 'mount()' should be executed synchronously, including its callback function argument.
   n.mount(parent, (componentId: ComponentId, componentTree: VTree<T>) => {
     // mount() gives us the VTree from the Haskell side
     n.componentId = componentId;

From 0e8ff776ba331cd5dc215293893c565b81c01441 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Fri, 12 Dec 2025 06:30:54 -0600
Subject: [PATCH 44/76] add test cases

---
 ts/spec/dom.spec.ts | 542 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 542 insertions(+)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index 3e2643b71..ffb8877ed 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -903,4 +903,546 @@ describe('DOM tests', () => {
     }
   });
 
+  test('Should destroy VText nodes', () => {
+    var currentNode = vtext<DOMRef>('foo');
+    diff<DOMRef>(null, currentNode, document.body, drawingContext);
+    expect(document.body.childNodes.length).toBe(1);
+    diff<DOMRef>(currentNode, null, document.body, drawingContext);
+    expect(document.body.childNodes.length).toBe(0);
+  });
+
+  test('Should add classes when none existed', () => {
+    var node = vnode<DOMRef>({
+      classList: new Set(['foo', 'bar'])
+    });
+    diff<DOMRef>(null, node, document.body, drawingContext);
+    expect(node.domRef.classList.contains('foo')).toBe(true);
+    expect(node.domRef.classList.contains('bar')).toBe(true);
+  });
+
+  test('Should remove classes when going from classes to no classes', () => {
+    var currentNode = vnode<DOMRef>({
+      classList: new Set(['foo', 'bar'])
+    });
+    diff<DOMRef>(null, currentNode, document.body, drawingContext);
+    expect(currentNode.domRef.classList.contains('foo')).toBe(true);
+    expect(currentNode.domRef.classList.contains('bar')).toBe(true);
+    
+    var newNode = vnode<DOMRef>({});
+    (newNode as any).domRef = currentNode.domRef;
+    diff<DOMRef>(currentNode, newNode, document.body, drawingContext);
+    expect(newNode.domRef.classList.contains('foo')).toBe(false);
+    expect(newNode.domRef.classList.contains('bar')).toBe(false);
+  });
+
+  test('Should handle class updates with removals and additions', () => {
+    var currentNode = vnode<DOMRef>({
+      classList: new Set(['foo', 'bar', 'baz'])
+    });
+    diff<DOMRef>(null, currentNode, document.body, drawingContext);
+    
+    var newNode = vnode<DOMRef>({
+      classList: new Set(['bar', 'qux'])
+    });
+    (newNode as any).domRef = currentNode.domRef;
+    diff<DOMRef>(currentNode, newNode, document.body, drawingContext);
+    
+    expect(newNode.domRef.classList.contains('foo')).toBe(false);
+    expect(newNode.domRef.classList.contains('bar')).toBe(true);
+    expect(newNode.domRef.classList.contains('baz')).toBe(false);
+    expect(newNode.domRef.classList.contains('qux')).toBe(true);
+  });
+
+  test('Should create VText with INSERT_BEFORE operation', () => {
+    var first = vnode<DOMRef>({});
+    diff<DOMRef>(null, first, document.body, drawingContext);
+    
+    var textNode = vtext<DOMRef>('hello');
+    var second = vnode<DOMRef>({});
+    diff<DOMRef>(null, second, document.body, drawingContext);
+    
+    // Create a tree that will use INSERT_BEFORE for a text node
+    var container = vnode<DOMRef>({
+      children: [vtext<DOMRef>('a')]
+    });
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, container, document.body, drawingContext);
+    
+    var updated = vnode<DOMRef>({
+      children: [vtext<DOMRef>('x'), vtext<DOMRef>('a')]
+    });
+    (updated as any).domRef = container.domRef;
+    updated.children[1].domRef = container.children[0].domRef;
+    diff<DOMRef>(container, updated, document.body, drawingContext);
+    
+    expect(document.body.children[0].childNodes.length).toBe(2);
+  });
+
+  test('Should create VText with REPLACE operation', () => {
+    var first = vtext<DOMRef>('foo');
+    diff<DOMRef>(null, first, document.body, drawingContext);
+    expect(first.domRef.textContent).toBe('foo');
+    
+    var second = vtext<DOMRef>('bar');
+    diff<DOMRef>(first, second, document.body, drawingContext);
+    expect(second.domRef.textContent).toBe('bar');
+  });
+
+  test('Should create VNode with INSERT_BEFORE operation', () => {
+    var first = vnode<DOMRef>({ tag: 'span' });
+    diff<DOMRef>(null, first, document.body, drawingContext);
+    
+    var container = vnode<DOMRef>({
+      children: [first]
+    });
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, container, document.body, drawingContext);
+    
+    var newFirst = vnode<DOMRef>({ tag: 'div' });
+    var updated = vnode<DOMRef>({
+      children: [newFirst, first]
+    });
+    (updated as any).domRef = container.domRef;
+    updated.children[1].domRef = container.children[0].domRef;
+    diff<DOMRef>(container, updated, document.body, drawingContext);
+    
+    expect(document.body.children[0].children.length).toBe(2);
+  });
+
+  test('Should create VNode with onBeforeCreated hook', () => {
+    let beforeCreatedCalled = false;
+    var node = vnode<DOMRef>({
+      onBeforeCreated: () => {
+        beforeCreatedCalled = true;
+      }
+    });
+    diff<DOMRef>(null, node, document.body, drawingContext);
+    expect(beforeCreatedCalled).toBe(true);
+  });
+
+  test('Should handle shouldSync with arrays having null/undefined keys', () => {
+    var currentNode = vnode<DOMRef>({
+      children: [
+        vnodeKeyed('div', 'a'),
+        vnodeKeyed('div', null as any)
+      ]
+    });
+    diff<DOMRef>(null, currentNode, document.body, drawingContext);
+    
+    var newNode = vnode<DOMRef>({
+      children: [
+        vnodeKeyed('div', 'a'),
+        vnodeKeyed('div', 'b')
+      ]
+    });
+    diff<DOMRef>(currentNode, newNode, document.body, drawingContext);
+    // Should not use sync algorithm and just diff normally
+    expect(newNode.children.length).toBe(2);
+  });
+
+  test('Should handle shouldSync with new array having undefined keys', () => {
+    var currentNode = vnode<DOMRef>({
+      children: [
+        vnodeKeyed('div', 'a')
+      ]
+    });
+    diff<DOMRef>(null, currentNode, document.body, drawingContext);
+    
+    var newNode = vnode<DOMRef>({
+      children: [
+        vnodeKeyed('div', 'a'),
+        vnodeKeyed('div', undefined as any)
+      ]
+    });
+    diff<DOMRef>(currentNode, newNode, document.body, drawingContext);
+    // Should not use sync algorithm
+    expect(newNode.children.length).toBe(2);
+  });
+
+  test('Should preserve VComp child when keys match', () => {
+    let componentMounted = false;
+    let componentMounted2 = false;
+    
+    const comp1 = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        componentMounted = true;
+        const tree = vnode<DOMRef>({});
+        callback(1 as any, tree);
+      },
+      unmount: () => {}
+    });
+    comp1.key = 'test-comp';
+    
+    diff<DOMRef>(null, comp1, document.body, drawingContext);
+    expect(componentMounted).toBe(true);
+    
+    const comp2 = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        componentMounted2 = true;
+        const tree = vnode<DOMRef>({});
+        callback(2 as any, tree);
+      },
+      unmount: () => {}
+    });
+    comp2.key = 'test-comp';
+    
+    diff<DOMRef>(comp1, comp2, document.body, drawingContext);
+    // Should not have called mount2 because keys matched
+    expect(componentMounted2).toBe(false);
+    // Should have preserved child from comp1
+    expect(comp2.child).toBe(comp1.child);
+  });
+
+  test('Should handle recursive drill for nested components', () => {
+    let outerComponentMounted = false;
+    const outerComp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        outerComponentMounted = true;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    diff<DOMRef>(null, outerComp, document.body, drawingContext);
+    expect(outerComponentMounted).toBe(true);
+    expect(outerComp.child).toBeTruthy();
+  });
+
+  test('Should handle component with same key not remounting', () => {
+    let mountCount = 0;
+    
+    const comp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        mountCount++;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    comp.key = 'same-key';
+    
+    diff<DOMRef>(null, comp, document.body, drawingContext);
+    expect(mountCount).toBe(1);
+    
+    const comp2 = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        mountCount++;
+        const vn = vnode<DOMRef>({ tag: 'span' });
+        callback(2 as any, vn);
+      },
+      unmount: () => {}
+    });
+    comp2.key = 'same-key';
+    
+    // Should preserve child and not mount again
+    diff<DOMRef>(comp, comp2, document.body, drawingContext);
+    expect(mountCount).toBe(1);
+    expect(comp2.child).toBe(comp.child);
+  });
+
+  test('Should call VNode onCreated hook in callCreated', () => {
+    let onCreatedCalled = false;
+    const node = vnode<DOMRef>({
+      onCreated: () => {
+        onCreatedCalled = true;
+      }
+    });
+    
+    // Use callCreated directly
+    const { callCreated } = require('../miso/dom');
+    callCreated(document.body, node, drawingContext);
+    expect(onCreatedCalled).toBe(true);
+  });
+
+  test('Should handle VNode createElement with APPEND operation', () => {
+    var node = vnode<DOMRef>({ tag: 'div' });
+    var container = vnode<DOMRef>({
+      children: [node]
+    });
+    
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, container, document.body, drawingContext);
+    
+    expect(document.body.children[0].children.length).toBe(1);
+    expect(document.body.children[0].children[0]).toBe(node.domRef);
+  });
+
+  test('Should handle VNode createElement with REPLACE operation', () => {
+    var oldNode = vnode<DOMRef>({ tag: 'span' });
+    diff<DOMRef>(null, oldNode, document.body, drawingContext);
+    
+    var newNode = vnode<DOMRef>({ tag: 'div' });
+    diff<DOMRef>(oldNode, newNode, document.body, drawingContext);
+    
+    expect(document.body.children[0]).toBe(newNode.domRef);
+    expect(newNode.domRef.tagName).toBe('DIV');
+  });
+
+  test('Should call onBeforeCreated hook for VNode', () => {
+    let beforeCreatedCalled = false;
+    let createdCalled = false;
+    
+    const node = vnode<DOMRef>({
+      tag: 'div',
+      onBeforeCreated: () => {
+        beforeCreatedCalled = true;
+        expect(createdCalled).toBe(false);
+      },
+      onCreated: () => {
+        createdCalled = true;
+      }
+    });
+    
+    diff<DOMRef>(null, node, document.body, drawingContext);
+    
+    expect(beforeCreatedCalled).toBe(true);
+    expect(createdCalled).toBe(true);
+  });
+
+  test('Should mount VComp in callCreated', () => {
+    let mounted = false;
+    const comp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        mounted = true;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    const { callCreated } = require('../miso/dom');
+    callCreated(document.body, comp, drawingContext);
+    expect(mounted).toBe(true);
+  });
+
+  test('Should handle VNode createElement with INSERT_BEFORE', () => {
+    // Create a parent with first child
+    const first = vnode<DOMRef>({ tag: 'span', key: 'first' });
+    const parent = vnode<DOMRef>({
+      children: [first]
+    });
+    
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, parent, document.body, drawingContext);
+    const parentDom = parent.domRef;
+    
+    // Now create a parent with new first child inserted before existing
+    const newFirst = vnode<DOMRef>({ tag: 'div', key: 'new' });
+    const updated = vnode<DOMRef>({
+      children: [newFirst, first]
+    });
+    (updated as any).domRef = parentDom;
+    updated.children[1].domRef = first.domRef;
+    updated.children[1].key = first.key;
+    
+    diff<DOMRef>(parent, updated, document.body, drawingContext);
+    
+    expect(parentDom.children.length).toBe(2);
+    expect(parentDom.children[0]).toBe(newFirst.domRef);
+    expect(parentDom.children[1]).toBe(first.domRef);
+  });
+
+  test('Should handle VComp creation with OP.APPEND', () => {
+    let mountCalled = false;
+    const comp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        mountCalled = true;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    diff<DOMRef>(null, comp, document.body, drawingContext);
+    
+    expect(mountCalled).toBe(true);
+    expect(comp.child).toBeTruthy();
+  });
+
+  test('Should handle nested VComp with final VNode', () => {
+    let innerMounted = false;
+    let outerMounted = false;
+    
+    const outerComp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        outerMounted = true;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    diff<DOMRef>(null, outerComp, document.body, drawingContext);
+    
+    expect(outerMounted).toBe(true);
+    expect(outerComp.child).toBeTruthy();
+    expect(outerComp.child.type).toBe(1); // VNode type
+  });
+
+  test('Should handle canvas draw callback', () => {
+    let drawCalled = false;
+    const canvas = vnode<DOMRef>({
+      tag: 'canvas',
+      draw: (domRef) => {
+        drawCalled = true;
+        expect(domRef).toBe(canvas.domRef);
+      }
+    });
+    
+    diff<DOMRef>(null, canvas, document.body, drawingContext);
+    expect(drawCalled).toBe(true);
+  });
+
+  test('Should replace VComp with another VComp', () => {
+    let firstUnmounted = false;
+    let secondMounted = false;
+    
+    const first = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        const vn = vnode<DOMRef>({ tag: 'span' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {
+        firstUnmounted = true;
+      }
+    });
+    
+    diff<DOMRef>(null, first, document.body, drawingContext);
+    const firstChild = first.child;
+    
+    const second = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        secondMounted = true;
+        const vn = vnode<DOMRef>({ tag: 'div' });
+        callback(2 as any, vn);
+      },
+      unmount: () => {}
+    });
+    second.key = 'different-key';
+    
+    diff<DOMRef>(first, second, document.body, drawingContext);
+    expect(firstUnmounted).toBe(true);
+    expect(secondMounted).toBe(true);
+  });
+
+  test('Should replace VNode with another VNode via replace', () => {
+    const first = vnode<DOMRef>({ tag: 'span' });
+    diff<DOMRef>(null, first, document.body, drawingContext);
+    
+    const second = vnode<DOMRef>({ tag: 'div', key: 'different' });
+    diff<DOMRef>(first, second, document.body, drawingContext);
+    
+    expect(document.body.children[0]).toBe(second.domRef);
+    expect(second.domRef.tagName).toBe('DIV');
+  });
+
+  test('Should handle mountComponent callback with non-VComp child', () => {
+    let mounted = false;
+    const comp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        mounted = true;
+        const vn = vnode<DOMRef>({ tag: 'article' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    diff<DOMRef>(null, comp, document.body, drawingContext);
+    expect(mounted).toBe(true);
+    expect(comp.child.type).toBe(1);  // VNode
+  });
+
+  test('Should get DOM reference from drilled VComp', () => {
+    const comp = vcomp<DOMRef>({
+      mount: (parent, callback) => {
+        const vn = vnode<DOMRef>({ tag: 'section' });
+        callback(1 as any, vn);
+      },
+      unmount: () => {}
+    });
+    
+    diff<DOMRef>(null, comp, document.body, drawingContext);
+    
+    // Verify that mount callback was invoked and child was set
+    expect(comp.child).toBeTruthy();
+    expect(comp.componentId).toBe(1);
+  });
+
+  test('Should create VText with INSERT_BEFORE in createElement', () => {
+    // Create initial text nodes
+    const first = vtext<DOMRef>('first');
+    const second = vtext<DOMRef>('second');
+    
+    const parent = vnode<DOMRef>({
+      children: [first, second]
+    });
+    
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, parent, document.body, drawingContext);
+    
+    // Insert new text before second
+    const newFirst = vtext<DOMRef>('new');
+    const updated = vnode<DOMRef>({
+      children: [newFirst, first, second]
+    });
+    (updated as any).domRef = parent.domRef;
+    updated.children[1].domRef = first.domRef;
+    updated.children[2].domRef = second.domRef;
+    
+    diff<DOMRef>(parent, updated, document.body, drawingContext);
+    
+    expect(parent.domRef.childNodes.length).toBe(3);
+    expect((parent.domRef.childNodes[0] as any).textContent).toBe('new');
+  });
+
+  test('Should create VText with REPLACE in createElement', () => {
+    const first = vtext<DOMRef>('foo');
+    const second = vtext<DOMRef>('bar');
+    
+    const parent = vnode<DOMRef>({
+      children: [first, second]
+    });
+    
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, parent, document.body, drawingContext);
+    
+    // Replace first text
+    const updated = vnode<DOMRef>({
+      children: [vtext<DOMRef>('replaced'), second]
+    });
+    (updated as any).domRef = parent.domRef;
+    updated.children[1].domRef = second.domRef;
+    
+    diff<DOMRef>(parent, updated, document.body, drawingContext);
+    
+    expect(parent.domRef.childNodes.length).toBe(2);
+    expect((parent.domRef.childNodes[0] as any).textContent).toBe('replaced');
+  });
+
+  test('Should create VNode with REPLACE in createElement', () => {
+    const first = vnode<DOMRef>({ tag: 'span' });
+    const second = vnode<DOMRef>({ tag: 'p' });
+    
+    const parent = vnode<DOMRef>({
+      children: [first, second]
+    });
+    
+    document.body.innerHTML = '';
+    diff<DOMRef>(null, parent, document.body, drawingContext);
+    
+    // Replace first node
+    const newFirst = vnode<DOMRef>({ tag: 'div' });
+    const updated = vnode<DOMRef>({
+      children: [newFirst, second]
+    });
+    (updated as any).domRef = parent.domRef;
+    updated.children[1].domRef = second.domRef;
+    
+    diff<DOMRef>(parent, updated, document.body, drawingContext);
+    
+    expect(parent.domRef.children[0]).toBe(newFirst.domRef);
+    expect(parent.domRef.children[0].tagName).toBe('DIV');
+  });
+
 });

From 618fdfc350c788495fce85a614c02162ff93164f Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Fri, 12 Dec 2025 09:24:29 -0600
Subject: [PATCH 45/76] add proper test cases

---
 ts/spec/dom.spec.ts | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index ffb8877ed..05cd6b324 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -1,6 +1,6 @@
 import { diff } from '../miso/dom';
 import { vnode, vcomp, vtext, vnodeKeyed, vtextKeyed } from '../miso/smart';
-import { VNode, VTree, DOMRef } from '../miso/types';
+import { VNode, VText, VTree, DOMRef } from '../miso/types';
 import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { drawingContext } from '../miso/context/dom';
 
@@ -971,8 +971,8 @@ describe('DOM tests', () => {
     var updated = vnode<DOMRef>({
       children: [vtext<DOMRef>('x'), vtext<DOMRef>('a')]
     });
-    (updated as any).domRef = container.domRef;
-    updated.children[1].domRef = container.children[0].domRef;
+    (updated as VNode<DOMRef>).domRef = (container as VNode<DOMRef>).domRef;
+    (updated.children[1] as VText<DOMRef>).domRef = ((container as VNode<DOMRef>).children[0] as VText<DOMRef>).domRef;
     diff<DOMRef>(container, updated, document.body, drawingContext);
     
     expect(document.body.children[0].childNodes.length).toBe(2);
@@ -1002,8 +1002,8 @@ describe('DOM tests', () => {
     var updated = vnode<DOMRef>({
       children: [newFirst, first]
     });
-    (updated as any).domRef = container.domRef;
-    updated.children[1].domRef = container.children[0].domRef;
+    (updated as VNode<DOMRef>).domRef = (container as VNode<DOMRef>).domRef;
+    (updated.children[1] as VNode<DOMRef>).domRef = ((container as VNode<DOMRef>).children[0] as VNode<DOMRef>).domRef;
     diff<DOMRef>(container, updated, document.body, drawingContext);
     
     expect(document.body.children[0].children.length).toBe(2);
@@ -1232,9 +1232,9 @@ describe('DOM tests', () => {
     const updated = vnode<DOMRef>({
       children: [newFirst, first]
     });
-    (updated as any).domRef = parentDom;
-    updated.children[1].domRef = first.domRef;
-    updated.children[1].key = first.key;
+    (updated as VNode<DOMRef>).domRef = parentDom;
+    (updated.children[1] as VNode<DOMRef>).domRef = (first as VNode<DOMRef>).domRef;
+    (updated.children[1] as VNode<DOMRef>).key = (first as VNode<DOMRef>).key;
     
     diff<DOMRef>(parent, updated, document.body, drawingContext);
     
@@ -1386,9 +1386,9 @@ describe('DOM tests', () => {
     const updated = vnode<DOMRef>({
       children: [newFirst, first, second]
     });
-    (updated as any).domRef = parent.domRef;
-    updated.children[1].domRef = first.domRef;
-    updated.children[2].domRef = second.domRef;
+    (updated as VNode<DOMRef>).domRef = parent.domRef;
+    (updated.children[1] as VText<DOMRef>).domRef = (first as VText<DOMRef>).domRef;
+    (updated.children[2] as VText<DOMRef>).domRef = (second as VText<DOMRef>).domRef;
     
     diff<DOMRef>(parent, updated, document.body, drawingContext);
     
@@ -1411,8 +1411,8 @@ describe('DOM tests', () => {
     const updated = vnode<DOMRef>({
       children: [vtext<DOMRef>('replaced'), second]
     });
-    (updated as any).domRef = parent.domRef;
-    updated.children[1].domRef = second.domRef;
+    (updated as VNode<DOMRef>).domRef = parent.domRef;
+    (updated.children[1] as VText<DOMRef>).domRef = (second as VText<DOMRef>).domRef;
     
     diff<DOMRef>(parent, updated, document.body, drawingContext);
     
@@ -1436,8 +1436,8 @@ describe('DOM tests', () => {
     const updated = vnode<DOMRef>({
       children: [newFirst, second]
     });
-    (updated as any).domRef = parent.domRef;
-    updated.children[1].domRef = second.domRef;
+    (updated as VNode<DOMRef>).domRef = parent.domRef;
+    (updated.children[1] as VNode<DOMRef>).domRef = (second as VNode<DOMRef>).domRef;
     
     diff<DOMRef>(parent, updated, document.body, drawingContext);
     

From fb6b27083ebe0421c01664f639800fc609d697b1 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Fri, 12 Dec 2025 11:38:50 -0600
Subject: [PATCH 46/76] Update hydrate, add tests

- [x] Use `diff` in fallback
- [x] Add additional tests
---
 ts/miso/hydrate.ts      |  19 +--
 ts/spec/hydrate.spec.ts | 253 ++++++++++++++++++++++++++++++++++++++--
 2 files changed, 249 insertions(+), 23 deletions(-)

diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index cb0caa45c..6e1a8f4b2 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -1,4 +1,4 @@
-import { callCreated, diffAttrs } from './dom';
+import { callCreated, diff } from './dom';
 import { DrawingContext, HydrationContext, VTree, VText, DOMRef, VTreeType } from './types';
 
 /* prerendering / hydration / isomorphic support */
@@ -59,7 +59,7 @@ export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTr
   const node: Node = preamble(mountPoint, drawingContext);
 
   // begin walking the DOM, report the result
-    if (!walk(logLevel, vtree, node, context, drawingContext)) {
+  if (!walk(logLevel, vtree, node, context, drawingContext)) {
     // If we failed to prerender because the structures were different, fallback to drawing
     if (logLevel) {
       console.warn('[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff');
@@ -69,19 +69,7 @@ export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTr
     while (context.firstChild(node as DOMRef))
       drawingContext.removeChild(node as DOMRef, context.lastChild(node as DOMRef));
 
-     switch (vtree.type) {
-         case VTreeType.VNode:
-            diffAttrs(null, vtree, drawingContext);
-            (vtree.domRef as Node) = node;
-            break;
-         case VTreeType.VText:
-            (vtree.domRef as Node) = node;
-            break;
-         default:
-            setVCompRef(vtree, node as DOMRef);
-            break;
-     }
-
+    diff (null, vtree, node, drawingContext);
     return false;
   } else {
     if (logLevel) {
@@ -209,7 +197,6 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   // We handle this in collapseSiblingTextNodes
   switch (vtree.type) {
     case VTreeType.VComp:
-      setVCompRef(vtree, node);
       callCreated(node, vtree, drawingContext);
       break;
     case VTreeType.VText:
diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index fd7e15ffe..bd3820cb4 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -1,8 +1,8 @@
 /* imports */
 import { hydrate, integrityCheck } from '../miso/hydrate';
-import { vnode, vtext, vnodeKids } from '../miso/smart';
-import { VText, VNode, DOMRef } from '../miso/types';
-import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
+import { vnode, vtext, vcomp, vnodeKids } from '../miso/smart';
+import { VText, VNode, DOMRef, VComp } from '../miso/types';
+import { test, expect, describe, afterEach, beforeAll, mock } from 'bun:test';
 import { hydrationContext, drawingContext } from '../miso/context/dom';
 
 /* silence */
@@ -81,15 +81,20 @@ describe ("Hydration tests", () => {
     var currentNode = vnode<DOMRef>({
       children: [vtext('foo'), vtext('bar'), vtext('baz')],
     });
-    hydrate(false, document.body, currentNode, hydrationContext, drawingContext);
+    const result = hydrate(false, document.body, currentNode, hydrationContext, drawingContext);
+    expect(result).toBe(true);
     expect(div.childNodes[0].textContent).toEqual('foobarbaz');
   });
 
   test('Should copy DOM into VTree with multiple consecutive text nodes and collapse them without mount point', () => {
     const div = document.createElement('div');
     document.body.appendChild(div);
-    const txt = document.createTextNode('foobarbaz');
-    div.appendChild(txt);
+    const txt1 = document.createTextNode('foobarbaz');
+    div.appendChild(txt1);
+    const mid = document.createElement('div');
+    div.appendChild(mid);
+    const txt2 = document.createTextNode('foobarbaz');
+    div.appendChild(txt2);
     const currentNode = vnode<DOMRef>({
       children: [
         vtext('foo'),
@@ -101,8 +106,9 @@ describe ("Hydration tests", () => {
         vtext('baz'),
       ],
     });
-    hydrate(false, null, currentNode, hydrationContext, drawingContext);
+    const result = hydrate(false, null, currentNode, hydrationContext, drawingContext);
     //Expect "foobarbaz" to be split up into three nodes in the DOM
+    expect(result).toBe(true);
     expect(div.childNodes[0].textContent).toEqual('foobarbaz');
     expect(div.childNodes[2].textContent).toEqual('foobarbaz');
   });
@@ -367,4 +373,237 @@ describe ("Hydration tests", () => {
     expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(false);
   });
 
+  test('Should call mountComponent when hydrating VComp', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    let mountCalled = false;
+    let componentId: any = null;
+    let componentTree: any = null;
+
+    const comp = vcomp<DOMRef>({
+      key: 'test-comp',
+      mount: (parent: any, callback: any) => {
+        mountCalled = true;
+        componentId = 1;
+        componentTree = vtext<DOMRef>('component content');
+        callback(componentId, componentTree);
+      },
+      unmount: () => {},
+    }) as VComp<DOMRef>;
+
+    const tree = vnode<DOMRef>({
+      children: [comp],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(false); // Hydration fails, falls back to mounting
+    expect(mountCalled).toBe(true);
+    expect(componentId).toBe(1);
+    expect(comp.componentId).toBe(1);
+    expect(comp.child).toBe(componentTree);
+  });
+
+  test('Should call mountComponent with onBeforeMounted hook', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    let beforeMountedCalled = false;
+    let onMountedCalled = false;
+
+    const comp = vcomp<DOMRef>({
+      key: 'test-comp-hooks',
+      onBeforeMounted: () => {
+        beforeMountedCalled = true;
+      },
+      onMounted: (domRef: any) => {
+        onMountedCalled = true;
+      },
+      mount: (parent: any, callback: any) => {
+        callback(2, vtext<DOMRef>('mounted component'));
+      },
+      unmount: () => {},
+    }) as VComp<DOMRef>;
+
+    const tree = vnode<DOMRef>({
+      children: [comp],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(false); // Hydration fails, falls back to mounting
+    expect(beforeMountedCalled).toBe(true);
+    expect(onMountedCalled).toBe(true);
+  });
+
+  test('Should handle VComp with nested child VTree', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    let childComponentTree: any = null;
+
+    const comp = vcomp<DOMRef>({
+      key: 'nested-comp',
+      mount: (parent: any, callback: any) => {
+        childComponentTree = vnode<DOMRef>({
+          tag: 'span',
+          children: [vtext<DOMRef>('nested child')],
+        });
+        callback(3, childComponentTree);
+      },
+      unmount: () => {},
+    }) as VComp<DOMRef>;
+
+    const tree = vnode<DOMRef>({
+      children: [comp],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(false); // Hydration fails, falls back to mounting
+    expect(comp.child).toBe(childComponentTree);
+    expect((comp.child as VNode<DOMRef>).tag).toBe('span');
+  });
+
+  test('Should handle VComp child recursive setVCompRef', () => {
+    const div = document.createElement('div');
+    const span = document.createElement('span');
+    div.appendChild(span);
+    document.body.appendChild(div);
+
+    const comp = vcomp<DOMRef>({
+      key: 'parent-comp',
+      mount: (parent: any, callback: any) => {
+        const childNode = vnode<DOMRef>({ tag: 'span' });
+        callback(4, childNode);
+      },
+      unmount: () => {},
+    }) as VComp<DOMRef>;
+
+    const tree = vnode<DOMRef>({
+      children: [comp],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    // setVCompRef was called and child is set
+    expect(comp.child).toBeDefined();
+    expect((comp.child as VNode<DOMRef>).tag).toBe('span');
+  });
+
+  test('Should log warning when hydration fails with logLevel enabled', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    // Create mismatched structure - DOM has div, VTree expects span
+    const tree = vnode<DOMRef>({ tag: 'span', children: [vtext<DOMRef>('mismatch')] });
+
+    const result = hydrate(true, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(false);
+  });
+
+  test('Should log success when hydration succeeds with logLevel enabled', () => {
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+    const txt = document.createTextNode('test');
+    div.appendChild(txt);
+
+    const tree = vnode<DOMRef>({
+      children: [vtext<DOMRef>('test')],
+    });
+
+    const result = hydrate(true, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(true);
+  });
+
+  test('Should handle VText in fallback path when hydration fails', () => {
+    // Create a DOM structure that will fail hydration for VText
+    const div = document.createElement('div');
+    document.body.appendChild(div);
+
+    const tree = vtext<DOMRef>('fallback text');
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    // Hydration should fail because DOM structure doesn't match
+    // VText fallback case (line 81) is executed
+    expect((tree as VText<DOMRef>).domRef).toBeDefined();
+  });
+
+  test('Should handle preamble with no mount point children after scripts', () => {
+    // Create mount point with only script tags
+    const mountDiv = document.createElement('div');
+    const script1 = document.createElement('script');
+    const script2 = document.createElement('script');
+    mountDiv.appendChild(script1);
+    mountDiv.appendChild(script2);
+    document.body.appendChild(mountDiv);
+
+    const tree = vnode<DOMRef>({
+      children: [vtext<DOMRef>('content')],
+    });
+
+    const result = hydrate(false, mountDiv as any, tree, hydrationContext, drawingContext);
+
+    // Should create a new div since only scripts are present
+    expect(result).toBe(false);
+  });
+
+  test('Should parse RGB color correctly', () => {
+    const div = document.createElement('div');
+    div.style.color = 'rgb(255, 128, 64)';
+    document.body.appendChild(div);
+
+    const tree = vnode<DOMRef>({
+      css: { color: 'rgb(255, 128, 64)' },
+    });
+
+    hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(true);
+  });
+
+  test('Should successfully walk and hydrate VComp in DOM', () => {
+    const div = document.createElement('div');
+    const span = document.createElement('span');
+    div.appendChild(span);
+    document.body.appendChild(div);
+
+    const comp = vcomp<DOMRef>({
+      key: 'walk-comp',
+      mount: (parent: any, callback: any) => {
+        callback(6, vnode<DOMRef>({ tag: 'span' }));
+      },
+      unmount: () => {},
+    }) as VComp<DOMRef>;
+
+    const tree = vnode<DOMRef>({
+      children: [comp],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(comp.componentId).toBe(6);
+    expect(comp.child).toBeDefined();
+  });
+
+  test('Should handle VNode with VNode child in walk function', () => {
+    const div = document.createElement('div');
+    const child = document.createElement('span');
+    div.appendChild(child);
+    document.body.appendChild(div);
+
+    const tree = vnode<DOMRef>({
+      children: [vnode<DOMRef>({ tag: 'span' })],
+    });
+
+    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+
+    expect(result).toBe(true);
+    expect(tree.domRef).toBeDefined();
+  });
+
 });

From a31c3351b55741160c979aaecae592b2f59f637a Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Fri, 12 Dec 2025 12:26:56 -0600
Subject: [PATCH 47/76] Merge branch 'master' into drop-vcomp-domref


From 3ecf145aa3b87e3eb6fd9f813cc7377705b8a08f Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Fri, 12 Dec 2025 12:27:44 -0600
Subject: [PATCH 48/76] lint

---
 ts/spec/hydrate.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index bd3820cb4..c03529b85 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -2,7 +2,7 @@
 import { hydrate, integrityCheck } from '../miso/hydrate';
 import { vnode, vtext, vcomp, vnodeKids } from '../miso/smart';
 import { VText, VNode, DOMRef, VComp } from '../miso/types';
-import { test, expect, describe, afterEach, beforeAll, mock } from 'bun:test';
+import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { hydrationContext, drawingContext } from '../miso/context/dom';
 
 /* silence */

From b667841ed8f7d0620728caf1defc06ca5cb38c3b Mon Sep 17 00:00:00 2001
From: "David M. Johnson" <875324+dmjio@users.noreply.github.com>
Date: Fri, 12 Dec 2025 14:40:11 -0600
Subject: [PATCH 49/76] Add `context-dom.spec.ts`. (#1279)

* Add `context-dom.spec.ts`.

Add tests for inversion of control objects (`EventContext`, `HydrationContext`).

* Add additional specs in `util.spec.ts`. (#1278)

* Add additional specs in `util.spec.ts`.

Increase coverage using mocks.

* `bun run watch-test` clean

* Update nextSibling tests
---
 ts/spec/context-dom.spec.ts | 433 ++++++++++++++++++++++++++++++++++++
 1 file changed, 433 insertions(+)
 create mode 100644 ts/spec/context-dom.spec.ts

diff --git a/ts/spec/context-dom.spec.ts b/ts/spec/context-dom.spec.ts
new file mode 100644
index 000000000..464a96b28
--- /dev/null
+++ b/ts/spec/context-dom.spec.ts
@@ -0,0 +1,433 @@
+import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
+import { eventContext, hydrationContext, componentContext, drawingContext } from '../miso/context/dom';
+import { vnode, vcomp } from '../miso/smart';
+import { DOMRef } from '../miso/types';
+
+/* silence */
+beforeAll(() => {
+  console.log = () => {};
+  console.info = () => {};
+  console.warn = () => {};
+  console.error = () => {};
+});
+
+/* reset DOM */
+afterEach(() => {
+  document.body.innerHTML = '';
+});
+
+describe('EventContext tests', () => {
+  test('Should add event listener', () => {
+    let clicked = false;
+    const listener = () => { clicked = true; };
+    const div = document.createElement('div');
+
+    eventContext.addEventListener(div as DOMRef, 'click', listener, false);
+    div.click();
+
+    expect(clicked).toBe(true);
+  });
+
+  test('Should remove event listener', () => {
+    let clickCount = 0;
+    const listener = () => { clickCount++; };
+    const div = document.createElement('div');
+
+    eventContext.addEventListener(div as DOMRef, 'click', listener, false);
+    div.click();
+    expect(clickCount).toBe(1);
+
+    eventContext.removeEventListener(div as DOMRef, 'click', listener, false);
+    div.click();
+    expect(clickCount).toBe(1); // Should not increment
+  });
+
+  test('Should check node equality', () => {
+    const div1 = document.createElement('div');
+    const div2 = document.createElement('div');
+
+    expect(eventContext.isEqual(div1 as DOMRef, div1 as DOMRef)).toBe(true);
+    expect(eventContext.isEqual(div1 as DOMRef, div2 as DOMRef)).toBe(false);
+  });
+
+  test('Should get event target', () => {
+    const div = document.createElement('div');
+    const event = new Event('click');
+    Object.defineProperty(event, 'target', { value: div, enumerable: true });
+
+    const target = eventContext.getTarget(event);
+    expect(target).toBe(div);
+  });
+
+  test('Should get parent node', () => {
+    const parent = document.createElement('div');
+    const child = document.createElement('span');
+    parent.appendChild(child);
+
+    const result = eventContext.parentNode(child as DOMRef);
+    expect(result).toBe(parent);
+  });
+});
+
+describe('HydrationContext tests', () => {
+  test('Should get inline style', () => {
+    const div = document.createElement('div');
+    div.style.color = 'red';
+
+    const color = hydrationContext.getInlineStyle(div as DOMRef, 'color');
+    expect(color).toBe('red');
+  });
+
+  test('Should get first child', () => {
+    const parent = document.createElement('div');
+    const child1 = document.createElement('span');
+    const child2 = document.createElement('p');
+    parent.appendChild(child1);
+    parent.appendChild(child2);
+
+    const first = hydrationContext.firstChild(parent as DOMRef);
+    expect(first).toBe(child1);
+  });
+
+  test('Should get last child', () => {
+    const parent = document.createElement('div');
+    const child1 = document.createElement('span');
+    const child2 = document.createElement('p');
+    parent.appendChild(child1);
+    parent.appendChild(child2);
+
+    const last = hydrationContext.lastChild(parent as DOMRef);
+    expect(last).toBe(child2);
+  });
+
+  test('Should get class attribute', () => {
+    const div = document.createElement('div');
+    div.className = 'foo bar';
+
+    const className = hydrationContext.getAttribute(div as DOMRef, 'class');
+    expect(className).toBe('foo bar');
+  });
+
+  test('Should get property attribute when key is in node', () => {
+    const input = document.createElement('input');
+    input.value = 'test';
+
+    const value = hydrationContext.getAttribute(input as DOMRef, 'value');
+    expect(value).toBe('test');
+  });
+
+  test('Should get attribute using getAttribute', () => {
+    const div = document.createElement('div');
+    div.setAttribute('data-test', 'value');
+
+    const attr = hydrationContext.getAttribute(div as DOMRef, 'data-test');
+    expect(attr).toBe('value');
+  });
+
+  test('Should get tag name', () => {
+    const div = document.createElement('div');
+    const tag = hydrationContext.getTag(div as DOMRef);
+    expect(tag).toBe('DIV');
+  });
+
+  test('Should get text content', () => {
+    const div = document.createElement('div');
+    div.textContent = 'hello world';
+
+    const text = hydrationContext.getTextContent(div as DOMRef);
+    expect(text).toBe('hello world');
+  });
+
+  test('Should get children', () => {
+    const parent = document.createElement('div');
+    const child1 = document.createElement('span');
+    const child2 = document.createElement('p');
+    parent.appendChild(child1);
+    parent.appendChild(child2);
+
+    const children = hydrationContext.children(parent as DOMRef);
+    expect(children.length).toBe(2);
+    expect(children[0]).toBe(child1);
+    expect(children[1]).toBe(child2);
+  });
+});
+
+describe('ComponentContext tests', () => {
+  test('Should call mountComponent without errors', () => {
+    expect(() => {
+      componentContext.mountComponent([], 1, {});
+    }).not.toThrow();
+  });
+
+  test('Should call unmountComponent without errors', () => {
+    expect(() => {
+      componentContext.unmountComponent(1);
+    }).not.toThrow();
+  });
+
+  test('Should call modelHydration without errors', () => {
+    expect(() => {
+      componentContext.modelHydration({});
+    }).not.toThrow();
+  });
+});
+
+describe('DrawingContext tests', () => {
+  test('Should get next sibling for VNode', () => {
+    const parent = document.createElement('div');
+    const child1 = document.createElement('div');
+    const child2 = document.createElement('span');
+    parent.append(child1, child2);
+
+    const node1 = vnode<DOMRef>({ tag: 'div' });
+    const node2 = vnode<DOMRef>({ tag: 'span' });
+    node1.domRef = child1 as DOMRef;
+    node2.domRef = child2 as DOMRef;
+    node1.nextSibling = node2;
+
+    const next = drawingContext.nextSibling(node1);
+    expect(next).toBe(child2 as DOMRef);
+  });
+
+  test('Should get next sibling for VComp by drilling', () => {
+    const parent = document.createElement('div');
+    const child1 = document.createElement('span');
+    const child2 = document.createElement('div');
+    parent.append(child1, child2);
+
+    const node = vnode<DOMRef>({ tag: 'span' });
+    node.domRef = child1 as DOMRef;
+
+    const comp = vcomp<DOMRef>({ mount: () => {}, unmount: () => {} });
+    (comp as any).domRef = child2 as DOMRef;
+    node.nextSibling = comp;
+
+    const next = drawingContext.nextSibling(node);
+    expect(next).toBe(child2 as DOMRef);
+  });
+
+  test('Should return undefined when no next sibling', () => {
+    const parent = document.createElement('div');
+    const only = document.createElement('div');
+    parent.appendChild(only);
+
+    const node = vnode<DOMRef>({ tag: 'div' });
+    node.domRef = only as DOMRef;
+
+    const next = drawingContext.nextSibling(node);
+    expect(next).toBeNull();
+  });
+
+  test('Should create text node', () => {
+    const textNode = drawingContext.createTextNode('hello');
+    expect(textNode.textContent).toBe('hello');
+    expect(textNode.nodeType).toBe(3); // TEXT_NODE
+  });
+
+  test('Should create element with namespace', () => {
+    const svgElement = drawingContext.createElementNS('http://www.w3.org/2000/svg', 'circle');
+    expect(svgElement.namespaceURI).toBe('http://www.w3.org/2000/svg');
+    expect(svgElement.tagName).toBe('circle');
+  });
+
+  test('Should append child', () => {
+    const parent = document.createElement('div');
+    const child = document.createElement('span');
+
+    drawingContext.appendChild(parent as DOMRef, child as DOMRef);
+    expect(parent.children.length).toBe(1);
+    expect(parent.children[0]).toBe(child);
+  });
+
+  test('Should replace child', () => {
+    const parent = document.createElement('div');
+    const oldChild = document.createElement('span');
+    const newChild = document.createElement('p');
+    parent.appendChild(oldChild);
+
+    drawingContext.replaceChild(parent as DOMRef, newChild as DOMRef, oldChild as DOMRef);
+    expect(parent.children.length).toBe(1);
+    expect(parent.children[0]).toBe(newChild);
+  });
+
+  test('Should remove child', () => {
+    const parent = document.createElement('div');
+    const child = document.createElement('span');
+    parent.appendChild(child);
+
+    drawingContext.removeChild(parent as DOMRef, child as DOMRef);
+    expect(parent.children.length).toBe(0);
+  });
+
+  test('Should create element', () => {
+    const div = drawingContext.createElement('div');
+    expect(div.tagName).toBe('DIV');
+  });
+
+  test('Should add class', () => {
+    const div = document.createElement('div');
+    drawingContext.addClass('foo', div as DOMRef);
+    expect(div.classList.contains('foo')).toBe(true);
+  });
+
+  test('Should not add empty class', () => {
+    const div = document.createElement('div');
+    drawingContext.addClass('', div as DOMRef);
+    expect(div.classList.length).toBe(0);
+  });
+
+  test('Should remove class', () => {
+    const div = document.createElement('div');
+    div.classList.add('foo');
+
+    drawingContext.removeClass('foo', div as DOMRef);
+    expect(div.classList.contains('foo')).toBe(false);
+  });
+
+  test('Should not remove empty class', () => {
+    const div = document.createElement('div');
+    div.classList.add('foo');
+
+    drawingContext.removeClass('', div as DOMRef);
+    expect(div.classList.contains('foo')).toBe(true);
+  });
+
+  test('Should insert before', () => {
+    const parent = document.createElement('div');
+    const existing = document.createElement('span');
+    const newNode = document.createElement('p');
+    parent.appendChild(existing);
+
+    drawingContext.insertBefore(parent as DOMRef, newNode as DOMRef, existing as DOMRef);
+    expect(parent.children.length).toBe(2);
+    expect(parent.children[0]).toBe(newNode);
+    expect(parent.children[1]).toBe(existing);
+  });
+
+  test('Should swap DOM refs', () => {
+    const parent = document.createElement('div');
+    const a = document.createElement('span');
+    const b = document.createElement('p');
+    const c = document.createElement('div');
+    parent.appendChild(a);
+    parent.appendChild(b);
+    parent.appendChild(c);
+
+    // Just verify the function executes without error
+    expect(() => {
+      drawingContext.swapDOMRefs(a as DOMRef, b as DOMRef, parent as DOMRef);
+    }).not.toThrow();
+
+    // Verify all children are still in parent
+    expect(parent.children.length).toBe(3);
+  });
+
+  test('Should set inline style - remove style when not in new CSS', () => {
+    const div = document.createElement('div');
+    div.style.color = 'red';
+    div.style.fontSize = '12px';
+
+    const currentCss = { color: 'red', fontSize: '12px' };
+    const newCss = { color: 'blue' };
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.color).toBe('blue');
+    expect(div.style.fontSize).toBe('');
+  });
+
+  test('Should set inline style - update existing style', () => {
+    const div = document.createElement('div');
+    div.style.color = 'red';
+
+    const currentCss = { color: 'red' };
+    const newCss = { color: 'blue' };
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.color).toBe('blue');
+  });
+
+  test('Should set inline style - add new styles', () => {
+    const div = document.createElement('div');
+
+    const currentCss = {};
+    const newCss = { color: 'red', fontSize: '14px' };
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.color).toBe('red');
+    expect(div.style.fontSize).toBe('14px');
+  });
+
+  test('Should set inline style - using setProperty for custom properties', () => {
+    const div = document.createElement('div');
+
+    const currentCss = {};
+    const newCss = { '--custom-color': 'blue' };
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.getPropertyValue('--custom-color')).toBe('blue');
+  });
+
+  test('Should set inline style - remove custom property', () => {
+    const div = document.createElement('div');
+    div.style.setProperty('--custom-color', 'red');
+
+    const currentCss = { '--custom-color': 'red' };
+    const newCss = {};
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.getPropertyValue('--custom-color')).toBe('');
+  });
+
+  test('Should set inline style - update custom property', () => {
+    const div = document.createElement('div');
+    div.style.setProperty('--custom-color', 'red');
+
+    const currentCss = { '--custom-color': 'red' };
+    const newCss = { '--custom-color': 'blue' };
+
+    drawingContext.setInlineStyle(currentCss, newCss, div as DOMRef);
+    expect(div.style.getPropertyValue('--custom-color')).toBe('blue');
+  });
+
+  test('Should set attribute', () => {
+    const div = document.createElement('div');
+    drawingContext.setAttribute(div as DOMRef, 'data-test', 'value');
+    expect(div.getAttribute('data-test')).toBe('value');
+  });
+
+  test('Should set attribute with namespace', () => {
+    const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    drawingContext.setAttributeNS(
+      svg as DOMRef,
+      'http://www.w3.org/1999/xlink',
+      'href',
+      'test.svg'
+    );
+    expect(svg.getAttributeNS('http://www.w3.org/1999/xlink', 'href')).toBe('test.svg');
+  });
+
+  test('Should remove attribute', () => {
+    const div = document.createElement('div');
+    div.setAttribute('data-test', 'value');
+
+    drawingContext.removeAttribute(div as DOMRef, 'data-test');
+    expect(div.hasAttribute('data-test')).toBe(false);
+  });
+
+  test('Should set text content', () => {
+    const div = document.createElement('div');
+    drawingContext.setTextContent(div as DOMRef, 'hello');
+    expect(div.textContent).toBe('hello');
+  });
+
+  test('Should call flush without errors', () => {
+    expect(() => {
+      drawingContext.flush();
+    }).not.toThrow();
+  });
+
+  test('Should get root as document body', () => {
+    const root = drawingContext.getRoot();
+    expect(root).toBe(document.body);
+  });
+});

From 9b29691c595195ff96a359302f9a97df8c482ec9 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Fri, 12 Dec 2025 19:59:46 -0600
Subject: [PATCH 50/76] Update nextSibling tests.

---
 js/miso.js                  | 15 ++-------
 js/miso.prod.js             |  2 +-
 ts/miso/context/dom.ts      |  1 +
 ts/spec/context-dom.spec.ts | 62 +++++++++++++++++++++++--------------
 4 files changed, 43 insertions(+), 37 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index b84bf0391..09e5a16bf 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -675,18 +675,7 @@ function hydrate(logLevel, mountPoint, vtree, context, drawingContext) {
     }
     while (context.firstChild(node))
       drawingContext.removeChild(node, context.lastChild(node));
-    switch (vtree.type) {
-      case 1 /* VNode */:
-        diffAttrs(null, vtree, drawingContext);
-        vtree.domRef = node;
-        break;
-      case 2 /* VText */:
-        vtree.domRef = node;
-        break;
-      default:
-        setVCompRef(vtree, node);
-        break;
-    }
+    diff(null, vtree, node, drawingContext);
     return false;
   } else {
     if (logLevel) {
@@ -777,7 +766,6 @@ function check(result, vtree, context, drawingContext) {
 function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
-      setVCompRef(vtree, node);
       callCreated(node, vtree, drawingContext);
       break;
     case 2 /* VText */:
@@ -1077,6 +1065,7 @@ var drawingContext = {
           return node.nextSibling.domRef;
       }
     }
+    return null;
   },
   createTextNode: (s) => {
     return document.createTextNode(s);
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 9b784cb41..212765271 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}w(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,L(G,K,U);else w(G,K,Q,U);else w(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function A(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function w(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,A(G));break;case 0:M(Q,1,A(G),K,U);break;case 1:M(Q,1,A(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,A(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function L(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function JG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function O(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(JG(U,X),U.onCreated)U.onCreated(U.domRef);switch(L(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=A(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,A(K),Q?A(Q):null)}function NG(G,K,Q){Q.removeChild(G,A(K))}function DG(G,K,Q,U){U.swapDOMRefs(A(K),A(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,J,P,a;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],J=G[X],H=G[Y],X>Y)W(null,q,Q,U),D(Q,q,J,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(J.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(J.key===$.key&&q.key===H.key)DG(H,J,Q,U),RG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(J.key===$.key)D(Q,J,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)D(Q,H,J,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,a=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),D(Q,a,G[X],U),Z++;else M(Q,2,A(J),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function I(G,K){if(G.type===0){if(G.child)I(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function j(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));switch(Q.type){case 1:L(null,Q,X),Q.domRef=Z;break;case 2:Q.domRef=Z;break;default:I(Q,Z);break}return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function f(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function k(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:I(K,Q),O(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),O(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return f(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return f(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return f(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;I(Y,_),e(G,Y,_,U,X);break}}}return!0}var b="1.9.0.0";function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function g(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function u(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function y(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,J]of $.headers)z[H]=J;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function m(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function v(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function i(G){if(G)G.close(),G=null}function l(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function x(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function d(G){if(G)G.close(),G=null}function p(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:W,hydrate:j,version:b,delegate:V,callBlur:h,callFocus:T,callSelect:g,callSetSelectionRange:u,eventJSON:N,fetchCore:y,eventSourceConnect:x,eventSourceClose:d,websocketConnect:v,websocketClose:i,websocketSend:l,undelegate:C,populateClass:p,getParentComponentId:m,integrityCheck:k,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function AG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(AG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function NG(G,K,Q){Q.removeChild(G,J(K))}function DG(G,K,Q,U){U.swapDOMRefs(J(K),J(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)DG(W,A,Q,U),RG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function n(G,K){if(G.type===0){if(G.child)n(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;n(Y,_),e(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index 484d3d9a2..4a73d7eac 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -79,6 +79,7 @@ export const drawingContext : DrawingContext<DOMRef> = {
           return node.nextSibling.domRef as DOMRef;
       }
     }
+    return null;
   },
   createTextNode : (s: string) => {
     return document.createTextNode(s) as any; // dmj: hrm
diff --git a/ts/spec/context-dom.spec.ts b/ts/spec/context-dom.spec.ts
index 464a96b28..d3ff8d497 100644
--- a/ts/spec/context-dom.spec.ts
+++ b/ts/spec/context-dom.spec.ts
@@ -2,6 +2,7 @@ import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { eventContext, hydrationContext, componentContext, drawingContext } from '../miso/context/dom';
 import { vnode, vcomp } from '../miso/smart';
 import { DOMRef } from '../miso/types';
+import { diff } from '../miso/dom';
 
 /* silence */
 beforeAll(() => {
@@ -174,39 +175,34 @@ describe('ComponentContext tests', () => {
 
 describe('DrawingContext tests', () => {
   test('Should get next sibling for VNode', () => {
-    const parent = document.createElement('div');
-    const child1 = document.createElement('div');
-    const child2 = document.createElement('span');
-    parent.append(child1, child2);
-
     const node1 = vnode<DOMRef>({ tag: 'div' });
     const node2 = vnode<DOMRef>({ tag: 'span' });
-    node1.domRef = child1 as DOMRef;
-    node2.domRef = child2 as DOMRef;
     node1.nextSibling = node2;
-
-    const next = drawingContext.nextSibling(node1);
-    expect(next).toBe(child2 as DOMRef);
+    const p = vnode<DOMRef>({ tag: 'span', children: [ node1, node2] });
+    diff (null, p, document.body, drawingContext);
+    expect(drawingContext.nextSibling(node1)).toBe(node2.domRef);
   });
 
   test('Should get next sibling for VComp by drilling', () => {
-    const parent = document.createElement('div');
-    const child1 = document.createElement('span');
-    const child2 = document.createElement('div');
-    parent.append(child1, child2);
-
-    const node = vnode<DOMRef>({ tag: 'span' });
-    node.domRef = child1 as DOMRef;
+    const comp = vcomp<DOMRef>({ tag: 'div', mount : (p, cb) => {
+      const node1 = vnode<DOMRef>({ tag: 'div' });
+      diff (null, node1, p, drawingContext);
+      cb (0, node1);
+    }});
 
-    const comp = vcomp<DOMRef>({ mount: () => {}, unmount: () => {} });
-    (comp as any).domRef = child2 as DOMRef;
-    node.nextSibling = comp;
+    const node1 = vnode<DOMRef>({ tag: 'div' });
+    comp.nextSibling = node1;
+    let p = vnode<DOMRef>({ tag: 'span', children: [ comp, node1 ] });
+    diff (null, p, document.body, drawingContext);
+    expect(drawingContext.nextSibling(comp)).toBe(node1.domRef);
 
-    const next = drawingContext.nextSibling(node);
-    expect(next).toBe(child2 as DOMRef);
+    node1.nextSibling = comp;
+    p = vnode<DOMRef>({ tag: 'span', children: [ node1, comp ] });
+    diff (null, p, document.body, drawingContext);
+    expect(drawingContext.nextSibling(node1)).toBe(comp.child.domRef);
   });
 
-  test('Should return undefined when no next sibling', () => {
+   test('Should return undefined when no next sibling', () => {
     const parent = document.createElement('div');
     const only = document.createElement('div');
     parent.appendChild(only);
@@ -216,6 +212,26 @@ describe('DrawingContext tests', () => {
 
     const next = drawingContext.nextSibling(node);
     expect(next).toBeNull();
+   });
+
+  test('Should return undefined when no next sibling', () => {
+    const comp = vcomp<DOMRef>({ tag: 'div', mount : (p, cb) => {
+      const node1 = vnode<DOMRef>({ tag: 'div' });
+      diff (null, node1, p, drawingContext);
+      cb (0, node1);
+    }});
+
+    const node1 = vnode<DOMRef>({ tag: 'div' });
+    // comp.nextSibling = node1; -- dmj: intentional
+    let p = vnode<DOMRef>({ tag: 'span', children: [ comp, node1 ] });
+    diff (null, p, document.body, drawingContext);
+
+    expect(drawingContext.nextSibling(comp)).toBe(null);
+
+    p = vnode<DOMRef>({ tag: 'span', children: [ node1, comp ] });
+    diff (null, p, document.body, drawingContext);
+
+    expect(drawingContext.nextSibling(comp)).toBe(null);
   });
 
   test('Should create text node', () => {

From c486f996d196841afb7bcfb949cc66d83f5a55fe Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 04:04:03 -0600
Subject: [PATCH 51/76] Export mount combinators top-level.

---
 src/Miso.hs | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/Miso.hs b/src/Miso.hs
index fecc76665..9100e07e7 100644
--- a/src/Miso.hs
+++ b/src/Miso.hs
@@ -28,6 +28,8 @@ module Miso
   , startComponent
   , component
   , (+>)
+  , mount
+  , mount_
     -- ** Sink
   , withSink
   , Sink

From 29922eadcac4a214b1d7b57f14c820473d007608 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Sun, 14 Dec 2025 15:34:20 -0600
Subject: [PATCH 52/76] swap args

---
 ts/miso/dom.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index c8b248c08..b24afffb9 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -404,7 +404,7 @@ function removeChild<T>(parent: T, n: VTree<T>, context: DrawingContext<T>): voi
   context.removeChild(parent, getDOMRef(n));
 }
 
-function swapDOMRef<T>(oFirst: VTree<T>, oLast: VTree<T>, parent: T, context: DrawingContext<T>): void {
+function swapDOMRef<T>(oLast: VTree<T>, oFirst: VTree<T>, parent: T, context: DrawingContext<T>): void {
   context.swapDOMRefs(getDOMRef(oLast), getDOMRef(oFirst), parent);
 }
 

From b5306e0d1eb1d7c1297977f9456b9353fc98b0bb Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Sun, 14 Dec 2025 15:57:08 -0600
Subject: [PATCH 53/76] Adjust swapDOMRef test

---
 ts/miso/context/dom.ts      | 8 ++++----
 ts/miso/patch.ts            | 2 +-
 ts/spec/context-dom.spec.ts | 9 +++------
 3 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/ts/miso/context/dom.ts b/ts/miso/context/dom.ts
index 4a73d7eac..c45318fe6 100644
--- a/ts/miso/context/dom.ts
+++ b/ts/miso/context/dom.ts
@@ -108,10 +108,10 @@ export const drawingContext : DrawingContext<DOMRef> = {
   insertBefore : (parent: DOMRef, child: DOMRef, node: DOMRef) => {
     return parent.insertBefore(child, node);
   },
-  swapDOMRefs : (a: DOMRef, b: DOMRef, p: DOMRef) => {
-    const tmp = a.nextSibling;
-    p.insertBefore(a, b);
-    p.insertBefore(b, tmp);
+  swapDOMRefs : (oLast: DOMRef, oFirst: DOMRef, p: DOMRef) => {
+    const tmp = oLast.nextSibling;
+    p.insertBefore(oLast, oFirst);
+    p.insertBefore(oFirst, tmp);
     return;
   },
   setInlineStyle: (cCss: CSS, nCss: CSS, node: DOMRef) => {
diff --git a/ts/miso/patch.ts b/ts/miso/patch.ts
index 11ab47d42..bd8c72d31 100644
--- a/ts/miso/patch.ts
+++ b/ts/miso/patch.ts
@@ -90,7 +90,7 @@ export function patch<T> (context: DrawingContext<T>, patch: PATCH, components:
                 break;
             case "swapDOMRefs":
                 /* dmj: swap it in the component environemnt too */
-                context.swapDOMRefs (component.nodes[patch.nodeA], component.nodes[patch.nodeB], component.nodes[patch.parent]);
+                context.swapDOMRefs (component.nodes[patch.nodeB], component.nodes[patch.nodeA], component.nodes[patch.parent]);
                 break;
             case "replaceChild":
                 context.replaceChild (component.nodes[patch.parent], component.nodes[patch.new], component.nodes[patch.current]);
diff --git a/ts/spec/context-dom.spec.ts b/ts/spec/context-dom.spec.ts
index d3ff8d497..fb90ba831 100644
--- a/ts/spec/context-dom.spec.ts
+++ b/ts/spec/context-dom.spec.ts
@@ -324,18 +324,15 @@ describe('DrawingContext tests', () => {
     const parent = document.createElement('div');
     const a = document.createElement('span');
     const b = document.createElement('p');
-    const c = document.createElement('div');
     parent.appendChild(a);
     parent.appendChild(b);
-    parent.appendChild(c);
 
     // Just verify the function executes without error
-    expect(() => {
-      drawingContext.swapDOMRefs(a as DOMRef, b as DOMRef, parent as DOMRef);
-    }).not.toThrow();
+    drawingContext.swapDOMRefs(b, a as DOMRef, parent as DOMRef);
 
     // Verify all children are still in parent
-    expect(parent.children.length).toBe(3);
+    expect(parent.childNodes[0].tagName).toBe('P');
+    expect(parent.childNodes[1].tagName).toBe('SPAN');
   });
 
   test('Should set inline style - remove style when not in new CSS', () => {

From da6341fc19b1517eefee1191634c6a755d8523bf Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Sun, 14 Dec 2025 17:12:19 -0600
Subject: [PATCH 54/76] regen js

---
 js/miso.js      | 10 +++++-----
 js/miso.prod.js |  2 +-
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 09e5a16bf..c2a2b3fd3 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -355,7 +355,7 @@ function insertBefore(parent, n, o, context) {
 function removeChild(parent, n, context) {
   context.removeChild(parent, getDOMRef(n));
 }
-function swapDOMRef(oFirst, oLast, parent, context) {
+function swapDOMRef(oLast, oFirst, parent, context) {
   context.swapDOMRefs(getDOMRef(oLast), getDOMRef(oFirst), parent);
 }
 function syncChildren(os, ns, parent, context) {
@@ -1096,10 +1096,10 @@ var drawingContext = {
   insertBefore: (parent, child, node) => {
     return parent.insertBefore(child, node);
   },
-  swapDOMRefs: (a, b, p) => {
-    const tmp = a.nextSibling;
-    p.insertBefore(a, b);
-    p.insertBefore(b, tmp);
+  swapDOMRefs: (oLast, oFirst, p) => {
+    const tmp = oLast.nextSibling;
+    p.insertBefore(oLast, oFirst);
+    p.insertBefore(oFirst, tmp);
     return;
   },
   setInlineStyle: (cCss, nCss, node) => {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 212765271..04b6560a3 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function AG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(AG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function NG(G,K,Q){Q.removeChild(G,J(K))}function DG(G,K,Q,U){U.swapDOMRefs(J(K),J(G),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)DG(W,A,Q,U),RG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function n(G,K){if(G.type===0){if(G.child)n(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;n(Y,_),e(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function AG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(AG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function NG(G,K,Q){Q.removeChild(G,J(K))}function DG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)DG(W,A,Q,U),RG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function n(G,K){if(G.type===0){if(G.child)n(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;n(Y,_),e(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From c60e844359e7a606820c0fbf3e8738f4325a0f5d Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 17:55:11 -0600
Subject: [PATCH 55/76] Drop dead code

---
 ts/spec/dom.spec.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index 05cd6b324..7b844dac1 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -956,8 +956,7 @@ describe('DOM tests', () => {
   test('Should create VText with INSERT_BEFORE operation', () => {
     var first = vnode<DOMRef>({});
     diff<DOMRef>(null, first, document.body, drawingContext);
-    
-    var textNode = vtext<DOMRef>('hello');
+
     var second = vnode<DOMRef>({});
     diff<DOMRef>(null, second, document.body, drawingContext);
     

From 9cc8b7064b3688bed32ba7ad39b0536663a159bf Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 17:56:05 -0600
Subject: [PATCH 56/76] Remove dead code

---
 ts/spec/dom.spec.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index 7b844dac1..99422eba1 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -1260,7 +1260,6 @@ describe('DOM tests', () => {
   });
 
   test('Should handle nested VComp with final VNode', () => {
-    let innerMounted = false;
     let outerMounted = false;
     
     const outerComp = vcomp<DOMRef>({

From ab92b58f1c6baba3c0b4e62f59e03d3fff99bc5b Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 17:58:38 -0600
Subject: [PATCH 57/76] Drop firstChild

---
 ts/spec/dom.spec.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ts/spec/dom.spec.ts b/ts/spec/dom.spec.ts
index 99422eba1..38e217cdf 100644
--- a/ts/spec/dom.spec.ts
+++ b/ts/spec/dom.spec.ts
@@ -1307,7 +1307,6 @@ describe('DOM tests', () => {
     });
     
     diff<DOMRef>(null, first, document.body, drawingContext);
-    const firstChild = first.child;
     
     const second = vcomp<DOMRef>({
       mount: (parent, callback) => {

From 9ba5ef01a8a00c31169813dbee28f26bb0461103 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 18:00:16 -0600
Subject: [PATCH 58/76] Add assertion to hydrate.spec.ts.

---
 ts/spec/hydrate.spec.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index c03529b85..3450f7226 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -486,6 +486,7 @@ describe ("Hydration tests", () => {
     });
 
     const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+    expect(result).toBe(true); // Hydration fails, falls back to mounting
 
     // setVCompRef was called and child is set
     expect(comp.child).toBeDefined();

From e030e70bf9c764e5854e2feb54382209bd2bd281 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 18:29:06 -0600
Subject: [PATCH 59/76] haddock nits

---
 src/Miso/Effect.hs       | 4 ++--
 src/Miso/FFI/Internal.hs | 2 +-
 src/Miso/Types.hs        | 8 ++++----
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/Miso/Effect.hs b/src/Miso/Effect.hs
index c5b7f7ac3..b3836dafd 100644
--- a/src/Miso/Effect.hs
+++ b/src/Miso/Effect.hs
@@ -171,9 +171,9 @@ type Effect parent model action = RWS (ComponentInfo parent) [Schedule action] m
 --
 -- All t'IO' is by default asynchronous, use the 'sync' function for synchronous
 -- execution. Beware 'sync' can block the render thread for a specific
--- 'Component'.
+-- t'Miso.Types.Component'.
 --
--- N.B. During 'Miso.Types.Component' unmounting, all effects are evaluated
+-- N.B. During t'Miso.Types.Component' unmounting, all effects are evaluated
 -- synchronously.
 --
 -- @since 1.9.0.0
diff --git a/src/Miso/FFI/Internal.hs b/src/Miso/FFI/Internal.hs
index 8f53fa064..f3c22f5a8 100644
--- a/src/Miso/FFI/Internal.hs
+++ b/src/Miso/FFI/Internal.hs
@@ -393,7 +393,7 @@ eventJSON x y = do
   moduleMiso <- jsg "miso"
   moduleMiso # "eventJSON" $ [x,y]
 -----------------------------------------------------------------------------
--- | Populate the `classList` Set on the virtual DOM.
+-- | Populate the 'Miso.Html.Property.classList' Set on the virtual DOM.
 populateClass
     :: JSVal
     -- ^ Node
diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index 660baad6a..8d5f06a3f 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -292,7 +292,7 @@ data SomeComponent parent
 infixr 0 +>
 key +> vcomp = VComp [ Property "key" (toJSON key) ] (SomeComponent vcomp)
 -----------------------------------------------------------------------------
--- | 'Component' mounting combinator. Takes '[Attribute a]' as arguments.
+-- | t'Miso.Types.Component' mounting combinator. Takes '[Attribute a]' as arguments.
 --
 -- @
 --   mount_ [ key_ "foo", onMounted Mounted ] $ component model noop $ \\m ->
@@ -307,11 +307,11 @@ mount_
   -> View p action
 mount_ attrs vcomp = VComp attrs (SomeComponent vcomp)
 -----------------------------------------------------------------------------
--- | 'Component' mounting combinator.
+-- | t'Miso.Types.Component' mounting combinator.
 --
--- Note: only use this if you're certain you won't be diffing two 'Component'
+-- Note: only use this if you're certain you won't be diffing two t'Miso.Types.Component'
 -- against each other. Otherwise, you will need a key to distinguish between
--- the two 'Component', to ensure unmounting and mounting occurs.
+-- the two t'Miso.Types.Component', to ensure unmounting and mounting occurs.
 --
 -- @
 --   mount $ component model noop $ \\m ->

From 433f0b9bdc8255a6293afef44dfe52b4c335f9c9 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 18:39:07 -0600
Subject: [PATCH 60/76] Drop setVCompRef

---
 js/miso.js         |  9 ---------
 js/miso.prod.js    |  2 +-
 ts/miso/hydrate.ts | 11 +----------
 3 files changed, 2 insertions(+), 20 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index c2a2b3fd3..2b8f40ce1 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -636,14 +636,6 @@ function collapseSiblingTextNodes(vs) {
   }
   return adjusted;
 }
-function setVCompRef(vtree, node) {
-  if (vtree.type === 0 /* VComp */) {
-    if (vtree.child)
-      setVCompRef(vtree.child, node);
-  } else {
-    vtree.domRef = node;
-  }
-}
 function preamble(mountPoint, context) {
   var mountChildIdx = 0, node;
   var root = context.getRoot();
@@ -798,7 +790,6 @@ function walk(logLevel, vtree, node, context, drawingContext) {
           default:
             if (domChild.nodeType !== 1)
               return false;
-            setVCompRef(vdomChild, domChild);
             walk(logLevel, vdomChild, domChild, context, drawingContext);
             break;
         }
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 04b6560a3..464757ccc 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)YG(G,Q,U);else if(G.type===2&&K.type===2)XG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function XG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function YG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function ZG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)BG(G)}function _G(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(_G(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){qG(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),$G(G?G.classList:null,K.classList,K.domRef,Q),zG(G?G.css:{},K.css,K.domRef,Q),WG(G?G.children:[],K.children,K.domRef,Q),JG(K)}function $G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function qG(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function zG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function HG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function WG(G,K,Q,U){if(HG(G,K))SG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function AG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(AG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function JG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function BG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function NG(G,K,Q){Q.removeChild(G,J(K))}function DG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function SG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)NG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)DG(W,A,Q,U),RG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function RG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=MG(Q,Z,X);E(G,K,Y,U,X)}}function MG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in FG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function FG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function LG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function n(G,K){if(G.type===0){if(G.child)n(G.child,K)}else G.domRef=K}function IG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=IG(K,X);if(!e(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function e(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=LG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;n(Y,_),e(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var GG={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},KG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},QG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},UG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:KG,eventContext:GG,drawingContext:UG,componentContext:QG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=LG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;t(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 6e1a8f4b2..143ebd595 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -14,14 +14,6 @@ function collapseSiblingTextNodes(vs: Array<VTree<DOMRef>>): Array<VTree<DOMRef>
   return adjusted;
 }
 
-function setVCompRef(vtree: VTree<DOMRef>, node: Node): void {
-  if (vtree.type === VTreeType.VComp) {
-    if (vtree.child) setVCompRef(vtree.child, node);
-  } else {
-    vtree.domRef = node as DOMRef;
-  }
-}
-
 /* function to determine if <script> tags are present in `body` top-level
    if so we work around them */
 function preamble(mountPoint: DOMRef | Text, context : DrawingContext<DOMRef>): Node {
@@ -230,8 +222,7 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
             break;
           default:
             if (domChild.nodeType !== 1) return false;
-            setVCompRef(vdomChild, domChild);
-             walk(logLevel, vdomChild, domChild, context, drawingContext);
+            walk(logLevel, vdomChild, domChild, context, drawingContext);
             break;
         }
       }

From c85f78f9a590e93de142fdfc070e5436241abfb2 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 18:45:41 -0600
Subject: [PATCH 61/76] watch-test clean

---
 ts/spec/context-dom.spec.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/ts/spec/context-dom.spec.ts b/ts/spec/context-dom.spec.ts
index fb90ba831..0e144e84e 100644
--- a/ts/spec/context-dom.spec.ts
+++ b/ts/spec/context-dom.spec.ts
@@ -1,7 +1,7 @@
 import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { eventContext, hydrationContext, componentContext, drawingContext } from '../miso/context/dom';
 import { vnode, vcomp } from '../miso/smart';
-import { DOMRef } from '../miso/types';
+import { VNode, DOMRef } from '../miso/types';
 import { diff } from '../miso/dom';
 
 /* silence */
@@ -168,7 +168,7 @@ describe('ComponentContext tests', () => {
 
   test('Should call modelHydration without errors', () => {
     expect(() => {
-      componentContext.modelHydration({});
+      componentContext.modelHydration(0, {});
     }).not.toThrow();
   });
 });
@@ -184,7 +184,7 @@ describe('DrawingContext tests', () => {
   });
 
   test('Should get next sibling for VComp by drilling', () => {
-    const comp = vcomp<DOMRef>({ tag: 'div', mount : (p, cb) => {
+    const comp = vcomp<DOMRef>({ mount : (p, cb) => {
       const node1 = vnode<DOMRef>({ tag: 'div' });
       diff (null, node1, p, drawingContext);
       cb (0, node1);
@@ -199,7 +199,7 @@ describe('DrawingContext tests', () => {
     node1.nextSibling = comp;
     p = vnode<DOMRef>({ tag: 'span', children: [ node1, comp ] });
     diff (null, p, document.body, drawingContext);
-    expect(drawingContext.nextSibling(node1)).toBe(comp.child.domRef);
+    expect(drawingContext.nextSibling(node1)).toBe((comp.child as VNode<DOMRef>).domRef);
   });
 
    test('Should return undefined when no next sibling', () => {
@@ -215,7 +215,7 @@ describe('DrawingContext tests', () => {
    });
 
   test('Should return undefined when no next sibling', () => {
-    const comp = vcomp<DOMRef>({ tag: 'div', mount : (p, cb) => {
+    const comp = vcomp<DOMRef>({ mount : (p, cb) => {
       const node1 = vnode<DOMRef>({ tag: 'div' });
       diff (null, node1, p, drawingContext);
       cb (0, node1);
@@ -331,8 +331,8 @@ describe('DrawingContext tests', () => {
     drawingContext.swapDOMRefs(b, a as DOMRef, parent as DOMRef);
 
     // Verify all children are still in parent
-    expect(parent.childNodes[0].tagName).toBe('P');
-    expect(parent.childNodes[1].tagName).toBe('SPAN');
+    expect((parent.childNodes[0] as HTMLElement).tagName).toBe('P');
+    expect((parent.childNodes[1] as HTMLElement).tagName).toBe('SPAN');
   });
 
   test('Should set inline style - remove style when not in new CSS', () => {

From 66fcfd67011d0670f86220f18cc8aa5209dceeed Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 19:47:31 -0600
Subject: [PATCH 62/76] Don't prerender "key"

---
 src/Miso/Html/Render.hs | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Miso/Html/Render.hs b/src/Miso/Html/Render.hs
index 0feb7cb65..6d7f7ae9b 100644
--- a/src/Miso/Html/Render.hs
+++ b/src/Miso/Html/Render.hs
@@ -113,6 +113,7 @@ renderAttrs (ClassList classes) =
   , fromMisoString (MS.unwords classes)
   , stringUtf8 "\""
   ]
+renderAttrs (Property "key" _) = mempty
 renderAttrs (Property key value) =
   mconcat
   [ fromMisoString key

From c5326a1678e685bd5e598ccb518d42b419a8de95 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 20:10:26 -0600
Subject: [PATCH 63/76] Update hydration spec

---
 ts/spec/hydrate.spec.ts | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index 3450f7226..1b8ac7baa 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -374,8 +374,8 @@ describe ("Hydration tests", () => {
   });
 
   test('Should call mountComponent when hydrating VComp', () => {
-    const div = document.createElement('div');
-    document.body.appendChild(div);
+    const txt = document.createTextNode('component content');
+    document.body.appendChild(txt);
 
     let mountCalled = false;
     let componentId: any = null;
@@ -392,13 +392,9 @@ describe ("Hydration tests", () => {
       unmount: () => {},
     }) as VComp<DOMRef>;
 
-    const tree = vnode<DOMRef>({
-      children: [comp],
-    });
+    const result = hydrate(false, document.body, comp, hydrationContext, drawingContext);
 
-    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
-
-    expect(result).toBe(false); // Hydration fails, falls back to mounting
+    expect(result).toBe(true);
     expect(mountCalled).toBe(true);
     expect(componentId).toBe(1);
     expect(comp.componentId).toBe(1);

From 98d0a77cc36f3c7fac964d7102917084831e60a6 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 20:15:35 -0600
Subject: [PATCH 64/76] Expect true in hydrate spec

---
 ts/spec/hydrate.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index 1b8ac7baa..9f331a9b3 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -582,7 +582,7 @@ describe ("Hydration tests", () => {
     });
 
     const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
-
+    expect(result).toBe(true);
     expect(comp.componentId).toBe(6);
     expect(comp.child).toBeDefined();
   });

From 6b816adddf076c096aefd1b299ddefadf9881e7e Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 20:32:42 -0600
Subject: [PATCH 65/76] Drop dead test

---
 ts/spec/hydrate.spec.ts | 27 ---------------------------
 1 file changed, 27 deletions(-)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index 9f331a9b3..f989b98df 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -462,33 +462,6 @@ describe ("Hydration tests", () => {
     expect((comp.child as VNode<DOMRef>).tag).toBe('span');
   });
 
-  test('Should handle VComp child recursive setVCompRef', () => {
-    const div = document.createElement('div');
-    const span = document.createElement('span');
-    div.appendChild(span);
-    document.body.appendChild(div);
-
-    const comp = vcomp<DOMRef>({
-      key: 'parent-comp',
-      mount: (parent: any, callback: any) => {
-        const childNode = vnode<DOMRef>({ tag: 'span' });
-        callback(4, childNode);
-      },
-      unmount: () => {},
-    }) as VComp<DOMRef>;
-
-    const tree = vnode<DOMRef>({
-      children: [comp],
-    });
-
-    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
-    expect(result).toBe(true); // Hydration fails, falls back to mounting
-
-    // setVCompRef was called and child is set
-    expect(comp.child).toBeDefined();
-    expect((comp.child as VNode<DOMRef>).tag).toBe('span');
-  });
-
   test('Should log warning when hydration fails with logLevel enabled', () => {
     const div = document.createElement('div');
     document.body.appendChild(div);

From 924790ce802013a50e5783269eae65ae8f450eef Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 21:29:14 -0600
Subject: [PATCH 66/76] Update hydration and spec.

---
 js/miso.js              | 29 ++++++++++-------------------
 js/miso.prod.js         |  2 +-
 ts/miso/dom.ts          |  2 +-
 ts/miso/hydrate.ts      | 30 +++++++++++-------------------
 ts/spec/hydrate.spec.ts | 24 +++++++-----------------
 5 files changed, 30 insertions(+), 57 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 2b8f40ce1..48543f010 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -759,11 +759,20 @@ function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
       callCreated(node, vtree, drawingContext);
+      return walk(logLevel, vtree.child, node, context, drawingContext);
       break;
     case 2 /* VText */:
+      if (node.nodeType !== 3 || vtree.text !== node.textContent) {
+        diagnoseError(logLevel, vtree, node);
+        return false;
+      }
       vtree.domRef = node;
       break;
     case 1 /* VNode */:
+      if (node.nodeType !== 1) {
+        diagnoseError(logLevel, vtree, node);
+        return false;
+      }
       vtree.domRef = node;
       vtree.children = collapseSiblingTextNodes(vtree.children);
       callCreated(node, vtree, drawingContext);
@@ -774,25 +783,7 @@ function walk(logLevel, vtree, node, context, drawingContext) {
           diagnoseError(logLevel, vdomChild, domChild);
           return false;
         }
-        switch (vdomChild.type) {
-          case 2 /* VText */:
-            if (domChild.nodeType !== 3) {
-              diagnoseError(logLevel, vdomChild, domChild);
-              return false;
-            }
-            if (vdomChild.text === domChild.textContent) {
-              vdomChild.domRef = context.children(node)[i];
-            } else {
-              diagnoseError(logLevel, vdomChild, domChild);
-              return false;
-            }
-            break;
-          default:
-            if (domChild.nodeType !== 1)
-              return false;
-            walk(logLevel, vdomChild, domChild, context, drawingContext);
-            break;
-        }
+        return walk(logLevel, vdomChild, domChild, context, drawingContext);
       }
   }
   return true;
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 464757ccc..7424de159 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function V(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function C(G,K,Q,U,X){let Z=LG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function O(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:K.domRef=Q;break;case 1:K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return O(G,Y,_),!1;switch(Y.type){case 2:if(_.nodeType!==3)return O(G,Y,_),!1;if(Y.text===_.textContent)Y.domRef=U.children(Q)[Z];else return O(G,Y,_),!1;break;default:if(_.nodeType!==1)return!1;t(G,Y,_,U,X);break}}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:C,version:j,delegate:w,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:V,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,a(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function a(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(a(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,p=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,p,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function w(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function f(G,K,Q,U,X){let Z=LG(K,X);if(!O(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function O(G,K,Q,U,X){switch(K.type){case 0:return P(Q,K,X),O(G,K.child,Q,U,X);break;case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return C(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return C(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;return O(G,Y,_,U,X)}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function g(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:f,version:k,delegate:V,callBlur:T,callFocus:b,callSelect:h,callSetSelectionRange:g,eventJSON:N,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:w,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index b24afffb9..009fb1494 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -379,7 +379,7 @@ function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>,
       } else if (op === OP.INSERT_BEFORE) {
         context.insertBefore(parent, childDomRef, replacing);
       }
-      // For OP.APPEND, the mount function should have already appended
+      // For OP.APPEND, this happens naturally in mount()
     }
   });
 
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 143ebd595..68f78e9b2 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -190,11 +190,20 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   switch (vtree.type) {
     case VTreeType.VComp:
       callCreated(node, vtree, drawingContext);
+      return walk (logLevel, vtree.child, node, context, drawingContext);
       break;
     case VTreeType.VText:
-      (vtree as VText<DOMRef>).domRef = node as DOMRef;
+       if (node.nodeType !== 3 || vtree.text !== node.textContent) {
+         diagnoseError(logLevel, vtree, node);
+         return false;
+       }
+      vtree.domRef = node as DOMRef;
       break;
     case VTreeType.VNode:
+      if (node.nodeType !== 1) {
+         diagnoseError(logLevel, vtree, node);
+         return false;
+      }
       vtree.domRef = node as DOMRef;
       vtree.children = collapseSiblingTextNodes(vtree.children);
       // Fire onCreated events as though the elements had just been created.
@@ -207,24 +216,7 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
           diagnoseError(logLevel, vdomChild, domChild);
           return false;
         }
-        switch (vdomChild.type) {
-          case VTreeType.VText:
-            if (domChild.nodeType !== 3) {
-              diagnoseError(logLevel, vdomChild, domChild);
-              return false;
-            }
-            if (vdomChild.text === domChild.textContent) {
-              vdomChild.domRef = context.children(node as DOMRef)[i];
-            } else {
-              diagnoseError(logLevel, vdomChild, domChild);
-              return false;
-            }
-            break;
-          default:
-            if (domChild.nodeType !== 1) return false;
-            walk(logLevel, vdomChild, domChild, context, drawingContext);
-            break;
-        }
+        return walk(logLevel, vdomChild, domChild, context, drawingContext);
       }
   }
   return true;
diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index f989b98df..6829c04a8 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -28,10 +28,12 @@ describe ("Hydration tests", () => {
     div.appendChild(nestedDiv);
     var txt = document.createTextNode('foo');
     nestedDiv.appendChild(txt);
-    var currentNode : any = vnode<DOMRef>({
+
+    const currentNode : VNode<DOMRef> = vnode<DOMRef>({
       children: [vnode<DOMRef>({ children: [vtext('foo')] })],
     });
-    hydrate(false, document.body, currentNode, hydrationContext, drawingContext);
+    const result = hydrate(false, document.body, currentNode, hydrationContext, drawingContext);
+    expect(result).toBe(true);
     expect(currentNode.children[0].children[0].text).toEqual('foo');
   });
 
@@ -387,6 +389,7 @@ describe ("Hydration tests", () => {
         mountCalled = true;
         componentId = 1;
         componentTree = vtext<DOMRef>('component content');
+        hydrate(false, parent, componentTree, hydrationContext, drawingContext);
         callback(componentId, componentTree);
       },
       unmount: () => {},
@@ -489,20 +492,6 @@ describe ("Hydration tests", () => {
     expect(result).toBe(true);
   });
 
-  test('Should handle VText in fallback path when hydration fails', () => {
-    // Create a DOM structure that will fail hydration for VText
-    const div = document.createElement('div');
-    document.body.appendChild(div);
-
-    const tree = vtext<DOMRef>('fallback text');
-
-    const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
-
-    // Hydration should fail because DOM structure doesn't match
-    // VText fallback case (line 81) is executed
-    expect((tree as VText<DOMRef>).domRef).toBeDefined();
-  });
-
   test('Should handle preamble with no mount point children after scripts', () => {
     // Create mount point with only script tags
     const mountDiv = document.createElement('div');
@@ -531,7 +520,8 @@ describe ("Hydration tests", () => {
       css: { color: 'rgb(255, 128, 64)' },
     });
 
-    hydrate(false, document.body, tree, hydrationContext, drawingContext);
+    const hydrated = hydrate(false, document.body, tree, hydrationContext, drawingContext);
+    expect(hydrated).toBe(true);      
 
     expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(true);
   });

From 74cbbab559b1856e46733ebddde653f8739aaba1 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 21:36:21 -0600
Subject: [PATCH 67/76] Update test to hydrate on node

---
 ts/spec/hydrate.spec.ts | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index 6829c04a8..b00b940ff 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -377,7 +377,9 @@ describe ("Hydration tests", () => {
 
   test('Should call mountComponent when hydrating VComp', () => {
     const txt = document.createTextNode('component content');
-    document.body.appendChild(txt);
+    const div = document.createElement('div');
+    div.appendChild(txt);
+    document.body.appendChild(div);
 
     let mountCalled = false;
     let componentId: any = null;
@@ -388,7 +390,7 @@ describe ("Hydration tests", () => {
       mount: (parent: any, callback: any) => {
         mountCalled = true;
         componentId = 1;
-        componentTree = vtext<DOMRef>('component content');
+        componentTree = vnode({ children: [vtext<DOMRef>('component content')] });
         hydrate(false, parent, componentTree, hydrationContext, drawingContext);
         callback(componentId, componentTree);
       },

From 381d09ddba11fdbd2e9fe7ed2eb9b81c914b42da Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Sun, 14 Dec 2025 21:54:56 -0600
Subject: [PATCH 68/76] Don't recurse on vcomp in hydrate.ts

---
 js/miso.js         | 1 -
 js/miso.prod.js    | 2 +-
 ts/miso/hydrate.ts | 1 -
 3 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 48543f010..b6db91a87 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -759,7 +759,6 @@ function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
       callCreated(node, vtree, drawingContext);
-      return walk(logLevel, vtree.child, node, context, drawingContext);
       break;
     case 2 /* VText */:
       if (node.nodeType !== 3 || vtree.text !== node.textContent) {
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 7424de159..29070bb59 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,a(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function a(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(a(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,p=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,p,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function w(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function f(G,K,Q,U,X){let Z=LG(K,X);if(!O(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function O(G,K,Q,U,X){switch(K.type){case 0:return P(Q,K,X),O(G,K.child,Q,U,X);break;case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return C(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return C(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;return O(G,Y,_,U,X)}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function g(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:f,version:k,delegate:V,callBlur:T,callFocus:b,callSelect:h,callSetSelectionRange:g,eventJSON:N,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:w,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function w(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function O(G,K,Q,U,X){let Z=LG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return C(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return C(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;return t(G,Y,_,U,X)}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:O,version:j,delegate:V,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:w,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 68f78e9b2..d2159a466 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -190,7 +190,6 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   switch (vtree.type) {
     case VTreeType.VComp:
       callCreated(node, vtree, drawingContext);
-      return walk (logLevel, vtree.child, node, context, drawingContext);
       break;
     case VTreeType.VText:
        if (node.nodeType !== 3 || vtree.text !== node.textContent) {

From 557eb85a8f2d618c0a5fd2ede9ca8d5cf1a99419 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Mon, 15 Dec 2025 04:01:03 -0600
Subject: [PATCH 69/76] Update hydrate.ts

---
 ts/miso/hydrate.ts | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index d2159a466..6c70ca983 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -190,6 +190,11 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   switch (vtree.type) {
     case VTreeType.VComp:
       callCreated(node, vtree, drawingContext);
+      if (!vtree.child) {
+        diagnoseError(logLevel, vtree, node);
+        return false;
+      }
+      return walk (logLevel, vtree.child, node, context, drawingContext);
       break;
     case VTreeType.VText:
        if (node.nodeType !== 3 || vtree.text !== node.textContent) {
@@ -215,7 +220,9 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
           diagnoseError(logLevel, vdomChild, domChild);
           return false;
         }
-        return walk(logLevel, vdomChild, domChild, context, drawingContext);
+        if (!walk(logLevel, vdomChild, domChild, context, drawingContext)) {
+          return false;
+        }
       }
   }
   return true;

From 4aaf7d9fb7392931b45a3c25f55fba9140bc8440 Mon Sep 17 00:00:00 2001
From: "code@dmj.io" <code@dmj.io>
Date: Mon, 15 Dec 2025 04:03:07 -0600
Subject: [PATCH 70/76] regen js

---
 js/miso.js      | 9 ++++++++-
 js/miso.prod.js | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index b6db91a87..ef60d964b 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -759,6 +759,11 @@ function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
       callCreated(node, vtree, drawingContext);
+      if (!vtree.child) {
+        diagnoseError(logLevel, vtree, node);
+        return false;
+      }
+      return walk(logLevel, vtree.child, node, context, drawingContext);
       break;
     case 2 /* VText */:
       if (node.nodeType !== 3 || vtree.text !== node.textContent) {
@@ -782,7 +787,9 @@ function walk(logLevel, vtree, node, context, drawingContext) {
           diagnoseError(logLevel, vdomChild, domChild);
           return false;
         }
-        return walk(logLevel, vdomChild, domChild, context, drawingContext);
+        if (!walk(logLevel, vdomChild, domChild, context, drawingContext)) {
+          return false;
+        }
       }
   }
   return true;
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 29070bb59..a3cb4a995 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function P(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,L,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{L=!1,z=X;while(z<=Y){if(G[z].key===q.key){L=!0,d=G[z];break}z++}if(L)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,d,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function V(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function w(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function O(G,K,Q,U,X){let Z=LG(K,X);if(!t(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function C(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function t(G,K,Q,U,X){switch(K.type){case 0:P(Q,K,X);break;case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return C(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return C(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),P(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return C(G,Y,_),!1;return t(G,Y,_,U,X)}}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function h(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function g(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function u(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function y(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function v(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:O,version:j,delegate:V,callBlur:b,callFocus:k,callSelect:T,callSetSelectionRange:h,eventJSON:N,fetchCore:g,eventSourceConnect:i,eventSourceClose:l,websocketConnect:y,websocketClose:m,websocketSend:v,undelegate:w,populateClass:x,getParentComponentId:u,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,a(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function a(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function V(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(a(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{I=!1,z=X;while(z<=Y){if(G[z].key===q.key){I=!0,p=G[z];break}z++}if(I)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,p,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function f(G,K,Q,U,X){let Z=LG(K,X);if(!O(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function L(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function O(G,K,Q,U,X){switch(K.type){case 0:if(V(Q,K,X),!K.child)return L(G,K,Q),!1;return O(G,K.child,Q,U,X);case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return L(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return L(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),V(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return L(G,Y,_),!1;if(!O(G,Y,_,U,X))return!1}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function g(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:f,version:k,delegate:w,callBlur:T,callFocus:b,callSelect:h,callSetSelectionRange:g,eventJSON:N,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:C,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};

From 46eca48000639ec4a5413281ddbd21389835ad4e Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 12:23:42 -0600
Subject: [PATCH 71/76] Make event delegation global

- [x] Refactor `getComponentParentId` to operate on any `Object`.
- [x] `hydrate` returns a `Bool`

Hydration now builds the entire virtual dom upfront and walks it all
at the same time, this avoids callbacks.

Simplifies event delegation equality checks.
---
 js/miso.js               |  57 +++++----------------
 js/miso.prod.js          |   2 +-
 src/Miso/FFI/Internal.hs |   6 +--
 src/Miso/Hydrate.hs      |   5 +-
 src/Miso/Runtime.hs      |  41 +++++++++++----
 src/Miso/Types.hs        |   3 +-
 ts/miso/dom.ts           |   2 +
 ts/miso/event.ts         |  12 +----
 ts/miso/hydrate.ts       |  71 +++++++-------------------
 ts/miso/util.ts          |  12 ++---
 ts/spec/hydrate.spec.ts  | 104 ++++++---------------------------------
 ts/spec/util.spec.ts     |  11 ++---
 12 files changed, 100 insertions(+), 226 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index ef60d964b..af90d95a7 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -335,7 +335,7 @@ function mountComponent(parent, op, replacing, n, context) {
         context.replaceChild(parent, childDomRef, replacing);
       } else if (op === 2 /* INSERT_BEFORE */) {
         context.insertBefore(parent, childDomRef, replacing);
-      }
+      } else if (op === 0 /* APPEND */) {}
     }
   });
   if (n.onMounted)
@@ -510,16 +510,7 @@ function delegateEvent(event, obj, stack, debug, context) {
         stack.splice(0, 1);
       }
       for (const child of obj.children) {
-        if (child.type === 0 /* VComp */) {
-          const childDomRef = drill(child);
-          if (childDomRef && context.isEqual(childDomRef, stack[0])) {
-            delegateEvent(event, child, stack, debug, context);
-          }
-        } else if (child.type === 1 /* VNode */) {
-          if (context.isEqual(child.domRef, stack[0])) {
-            delegateEvent(event, child, stack, debug, context);
-          }
-        }
+        delegateEvent(event, child, stack, debug, context);
       }
     }
   } else {
@@ -636,38 +627,16 @@ function collapseSiblingTextNodes(vs) {
   }
   return adjusted;
 }
-function preamble(mountPoint, context) {
-  var mountChildIdx = 0, node;
-  var root = context.getRoot();
-  if (!mountPoint) {
-    if (root.childNodes.length > 0) {
-      node = root.firstChild;
-    } else {
-      node = root.appendChild(context.createElement("div"));
-    }
-  } else if (mountPoint.childNodes.length === 0) {
-    node = mountPoint.appendChild(context.createElement("div"));
-  } else {
-    while (mountPoint.childNodes[mountChildIdx] && (mountPoint.childNodes[mountChildIdx].nodeType === 3 || mountPoint.childNodes[mountChildIdx].localName === "script")) {
-      mountChildIdx++;
-    }
-    if (!mountPoint.childNodes[mountChildIdx]) {
-      node = root.appendChild(context.createElement("div"));
-    } else {
-      node = mountPoint.childNodes[mountChildIdx];
-    }
-  }
-  return node;
-}
 function hydrate(logLevel, mountPoint, vtree, context, drawingContext) {
-  const node = preamble(mountPoint, drawingContext);
+  if (!vtree || !mountPoint)
+    return false;
+  let node = drawingContext.getRoot() === mountPoint ? mountPoint.firstChild : mountPoint;
   if (!walk(logLevel, vtree, node, context, drawingContext)) {
     if (logLevel) {
       console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");
     }
     while (context.firstChild(node))
       drawingContext.removeChild(node, context.lastChild(node));
-    diff(null, vtree, node, drawingContext);
     return false;
   } else {
     if (logLevel) {
@@ -758,15 +727,12 @@ function check(result, vtree, context, drawingContext) {
 function walk(logLevel, vtree, node, context, drawingContext) {
   switch (vtree.type) {
     case 0 /* VComp */:
-      callCreated(node, vtree, drawingContext);
-      if (!vtree.child) {
-        diagnoseError(logLevel, vtree, node);
+      if (!walk(logLevel, vtree.child, node, context, drawingContext)) {
         return false;
       }
-      return walk(logLevel, vtree.child, node, context, drawingContext);
       break;
     case 2 /* VText */:
-      if (node.nodeType !== 3 || vtree.text !== node.textContent) {
+      if (node.nodeType !== 3 || vtree.text.trim() !== node.textContent.trim()) {
         diagnoseError(logLevel, vtree, node);
         return false;
       }
@@ -791,6 +757,7 @@ function walk(logLevel, vtree, node, context, drawingContext) {
           return false;
         }
       }
+      break;
   }
   return true;
 }
@@ -868,12 +835,12 @@ function fetchCore(url, method, body, requestHeaders, successful, errorful, resp
 function getParentComponentId(vcompNode) {
   var climb = function(node) {
     let parentComponentId = null;
-    while (node && node.parentNode) {
-      if ("componentId" in node.parentNode) {
-        parentComponentId = node.parentNode["componentId"];
+    while (node && node.parent) {
+      if ("componentId" in node.parent) {
+        parentComponentId = node.parent["componentId"];
         break;
       }
-      node = node.parentNode;
+      node = node.parent;
     }
     return parentComponentId;
   };
diff --git a/js/miso.prod.js b/js/miso.prod.js
index a3cb4a995..1ec63f242 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function H(G,K,Q,U){if(!G&&!K)return;else if(!G)BG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,a(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function B(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return B(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return B(G);default:return G.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:R(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:M(Q,1,J(G),K,U);break;case 1:M(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:S(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:R(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:S(G);break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)S(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function R(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;R(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)R(G.child)}break}}function a(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)H(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function V(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function M(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(a(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(B(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(B(U))}function BG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else M(K,0,null,G,Q)}function D(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,W,A,I,p;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],W=G[Y],X>Y)H(null,q,Q,U),D(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)H(G[X++],K[Z++],Q,U);else if(W.key===$.key)H(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===W.key)NG(W,A,Q,U),SG(G,X,Y),H(G[X++],K[Z++],Q,U),H(G[Y--],K[_--],Q,U);else if(A.key===$.key)D(Q,A,W.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),H(G[Y--],K[_--],Q,U);else if(W.key===q.key)D(Q,W,A,U),G.splice(X,0,G.splice(Y,1)[0]),H(G[X++],q,Q,U),Z++;else{I=!1,z=X;while(z<=Y){if(G[z].key===q.key){I=!0,p=G[z];break}z++}if(I)G.splice(X,0,G.splice(z,1)[0]),H(G[X++],q,Q,U),D(Q,p,G[X],U),Z++;else M(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function w(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);E(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function E(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return E(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)if(Z.type===0){let Y=B(Z);if(Y&&X.isEqual(Y,Q[0]))E(G,Z,Q,U,X)}else if(Z.type===1){if(X.isEqual(Z.domRef,Q[0]))E(G,Z,Q,U,X)}}}else if(K.type===0){if(K.child)E(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function N(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(N(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(N([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function LG(G,K){var Q=0,U,X=K.getRoot();if(!G)if(X.childNodes.length>0)U=X.firstChild;else U=X.appendChild(K.createElement("div"));else if(G.childNodes.length===0)U=G.appendChild(K.createElement("div"));else{while(G.childNodes[Q]&&(G.childNodes[Q].nodeType===3||G.childNodes[Q].localName==="script"))Q++;if(!G.childNodes[Q])U=X.appendChild(K.createElement("div"));else U=G.childNodes[Q]}return U}function f(G,K,Q,U,X){let Z=LG(K,X);if(!O(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return H(null,Q,Z,X),!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function L(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function j(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function O(G,K,Q,U,X){switch(K.type){case 0:if(V(Q,K,X),!K.child)return L(G,K,Q),!1;return O(G,K.child,Q,U,X);case 2:if(Q.nodeType!==3||K.text!==Q.textContent)return L(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return L(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),V(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return L(G,Y,_),!1;if(!O(G,Y,_,U,X))return!1}}return!0}var k="1.9.0.0";function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function T(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function g(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[W,A]of $.headers)z[W]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function y(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let W=JSON.parse($.data);if(X)X(W)}catch(W){if(z&&U)U($.data);else _(W.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function v(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function l(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function x(G){if(G)G.close(),G=null}function d(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return B(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:H,hydrate:f,version:k,delegate:w,callBlur:T,callFocus:b,callSelect:h,callSetSelectionRange:g,eventJSON:N,fetchCore:u,eventSourceConnect:l,eventSourceClose:x,websocketConnect:m,websocketClose:v,websocketSend:i,undelegate:C,populateClass:d,getParentComponentId:y,integrityCheck:j,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q);else if(K===0);}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,I,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{I=!1,z=X;while(z<=Y){if(G[z].key===q.key){I=!0,d=G[z];break}z++}if(I)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parent){if("componentId"in Q.parent){U=Q.parent.componentId;break}Q=Q.parent}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/src/Miso/FFI/Internal.hs b/src/Miso/FFI/Internal.hs
index f3c22f5a8..eee0d21a7 100644
--- a/src/Miso/FFI/Internal.hs
+++ b/src/Miso/FFI/Internal.hs
@@ -516,13 +516,13 @@ undelegate mountPoint events debug callback ctx = do
 --
 -- See [hydration](https://en.wikipedia.org/wiki/Hydration_(web_development))
 --
-hydrate :: Bool -> JSVal -> JSVal -> JSM ()
-hydrate logLevel mountPoint vtree = void $ do
+hydrate :: Bool -> JSVal -> JSVal -> JSM JSVal
+hydrate logLevel mountPoint vtree = do
   ll <- toJSVal logLevel
   drawingContext <- getDrawingContext
   hydrationContext <- getHydrationContext
   moduleMiso <- jsg "miso"
-  void $ moduleMiso # "hydrate" $ [ll, mountPoint, vtree, hydrationContext, drawingContext]
+  moduleMiso # "hydrate" $ (ll, mountPoint, vtree, hydrationContext, drawingContext)
 -----------------------------------------------------------------------------
 -- | Fails silently if the element is not found.
 --
diff --git a/src/Miso/Hydrate.hs b/src/Miso/Hydrate.hs
index cbcce369f..62eb55334 100644
--- a/src/Miso/Hydrate.hs
+++ b/src/Miso/Hydrate.hs
@@ -20,8 +20,9 @@ import qualified Miso.FFI.Internal as FFI
 import           Miso.Types
 -----------------------------------------------------------------------------
 -- | Hydration of a t'VTree'
-hydrate :: LogLevel -> DOMRef -> VTree -> JSM ()
+hydrate :: LogLevel -> DOMRef -> VTree -> JSM Bool
 hydrate loggingLevel domRef vtree = do
   jval <- toJSVal vtree
-  FFI.hydrate (loggingLevel `elem` [DebugHydrate, DebugAll]) domRef jval
+  fromJSValUnchecked =<<
+    FFI.hydrate (loggingLevel `elem` [DebugHydrate, DebugAll]) domRef jval
 -----------------------------------------------------------------------------
diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index a009ddfec..607e925ac 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -157,15 +157,25 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
     end <- if isRoot then FFI.now else pure 0
     when isRoot $ FFI.consoleLog $ ms (printf "buildVTree: %.3f ms" (end - start) :: String)
 #endif
+    ref <- liftIO (newIORef vtree)
     case hydrate of
       Draw -> do
         Diff.diff Nothing (Just vtree) componentDOMRef
+        pure ref
       Hydrate -> do
-        Hydrate.hydrate logLevel componentDOMRef vtree
-    liftIO (newIORef vtree)
-  componentDOMRef <# ("componentId" :: MisoString) $ componentId
+        when isRoot $ do
+          hydrated <- Hydrate.hydrate logLevel componentDOMRef vtree
+          when (not hydrated) $ do
+            newTree <- buildVTree Draw componentSink logLevel events (view initializedModel)
+            liftIO (atomicWriteIORef ref newTree)
+            Diff.diff Nothing (Just newTree) componentDOMRef
+        pure ref
+
+  vtree <- liftIO (readIORef componentVTree)
+  vtree <# ("componentId" :: MisoString) $ componentId
   componentParentId <- do
-    FFI.getParentComponentId componentDOMRef >>= \case
+    ref <- toJSVal vtree
+    FFI.getParentComponentId ref >>= \case
       Nothing -> pure rootComponentId
       Just parentId -> pure parentId
   componentSubThreads <- liftIO (newIORef M.empty)
@@ -239,8 +249,7 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
   registerComponent vcomp
   if isRoot
     then
-      delegator componentDOMRef componentVTree
-        events (logLevel `elem` [DebugEvents, DebugAll])
+      delegator componentDOMRef componentVTree events (logLevel `elem` [DebugEvents, DebugAll])
     else
       addToDelegatedEvents logLevel events
   forM_ initialAction componentSink
@@ -828,13 +837,17 @@ buildVTree
   -> JSM VTree
 buildVTree hydrate snk logLevel_ events_ = \case
   VComp attrs (SomeComponent app) -> do
+    vcomp <- create
+
     mountCallback <- do
       FFI.syncCallback2 $ \parent_ continuation -> do
-        ComponentState {..} <- initialize hydrate False app (pure parent_)
+        ComponentState {..} <- initialize Draw False app (pure parent_)
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
+        FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
         FFI.set "componentId" vcompId (Object parent_)
         void $ call continuation global [vcompId, vtree]
+
     unmountCallback <- toJSVal =<< do
       FFI.syncCallback1 $ \vcompId -> do
         componentId <- liftJSM (fromJSValUnchecked vcompId)
@@ -842,9 +855,19 @@ buildVTree hydrate snk logLevel_ events_ = \case
           Nothing -> pure ()
           Just componentState ->
             unmount app componentState
-    vcomp <- create
+
+    case hydrate of
+      Hydrate -> do
+        ComponentState {..} <- initialize hydrate False app (pure jsNull)
+        vtree <- toJSVal =<< liftIO (readIORef componentVTree)
+        FFI.set "parent" vcomp (Object vtree)
+        vcompId <- toJSVal componentId
+        FFI.set "componentId" vcompId (Object vtree)
+        FFI.set "child" vtree vcomp
+      Draw -> do
+        FFI.set "child" jsNull vcomp        
+      
     setAttrs vcomp attrs snk (logLevel app) (events app)
-    FFI.set "child" jsNull vcomp
     flip (FFI.set "mount") vcomp =<< toJSVal mountCallback
     FFI.set "unmount" unmountCallback vcomp
     FFI.set "eventPropagation" (eventPropagation app) vcomp
diff --git a/src/Miso/Types.hs b/src/Miso/Types.hs
index 8d5f06a3f..84365f73f 100644
--- a/src/Miso/Types.hs
+++ b/src/Miso/Types.hs
@@ -91,7 +91,7 @@ import qualified Data.Map.Strict as M
 import           Data.Maybe (fromMaybe, isJust)
 import           Data.String (IsString, fromString)
 import qualified Data.Text as T
-import           Language.Javascript.JSaddle (ToJSVal(toJSVal), Object(..), JSM)
+import           Language.Javascript.JSaddle (ToJSVal(toJSVal), Object(..), JSM, MakeObject)
 import           Prelude
 -----------------------------------------------------------------------------
 import           Miso.Binding ((<--), (-->), (<-->), (<---), (--->), (<--->), Binding(..))
@@ -408,6 +408,7 @@ instance IsString (View model action) where
 --   Used for diffing, patching and event delegation.
 --   Not meant to be constructed directly, see t'Miso.Types.View' instead.
 newtype VTree = VTree { getTree :: Object }
+  deriving (MakeObject)
 -----------------------------------------------------------------------------
 instance ToJSVal VTree where
   toJSVal (VTree (Object vtree)) = pure vtree
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index 009fb1494..aa97f534d 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -378,6 +378,8 @@ function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>,
         context.replaceChild(parent, childDomRef, replacing);
       } else if (op === OP.INSERT_BEFORE) {
         context.insertBefore(parent, childDomRef, replacing);
+      } else if (op === OP.APPEND) {
+        // context.appendChild(parent, childDomRef);
       }
       // For OP.APPEND, this happens naturally in mount()
     }
diff --git a/ts/miso/event.ts b/ts/miso/event.ts
index eebb3a9cc..232aac042 100644
--- a/ts/miso/event.ts
+++ b/ts/miso/event.ts
@@ -127,17 +127,7 @@ function delegateEvent <T>(
           stack.splice(0,1);
         }
         for (const child of obj.children) {
-           if (child.type === VTreeType.VComp) {
-             // For VComp, we need to drill to get the actual domRef
-             const childDomRef = drill(child as VComp<T>);
-             if (childDomRef && context.isEqual(childDomRef, stack[0])) {
-               delegateEvent(event, child, stack, debug, context);
-             }
-           } else if (child.type === VTreeType.VNode) {
-             if (context.isEqual(child.domRef, stack[0])) {
-               delegateEvent(event, child, stack, debug, context);
-             }
-           }
+          delegateEvent(event, child, stack, debug, context);
         }
       }
     } else {
diff --git a/ts/miso/hydrate.ts b/ts/miso/hydrate.ts
index 6c70ca983..5e790650c 100644
--- a/ts/miso/hydrate.ts
+++ b/ts/miso/hydrate.ts
@@ -1,4 +1,4 @@
-import { callCreated, diff } from './dom';
+import { callCreated } from './dom';
 import { DrawingContext, HydrationContext, VTree, VText, DOMRef, VTreeType } from './types';
 
 /* prerendering / hydration / isomorphic support */
@@ -14,55 +14,21 @@ function collapseSiblingTextNodes(vs: Array<VTree<DOMRef>>): Array<VTree<DOMRef>
   return adjusted;
 }
 
-/* function to determine if <script> tags are present in `body` top-level
-   if so we work around them */
-function preamble(mountPoint: DOMRef | Text, context : DrawingContext<DOMRef>): Node {
-  /* this needs to be abstracted out for native as well ... at some point */
-  var mountChildIdx = 0,
-    node: ChildNode;
-  var root = context.getRoot();
-  if (!mountPoint) {
-    if (root.childNodes.length > 0) {
-        node = root.firstChild;
-    } else {
-      node = root.appendChild(context.createElement('div'));
-    }
-  } else if (mountPoint.childNodes.length === 0) {
-    node = mountPoint.appendChild(context.createElement('div'));
-  } else {
-    while (
-      mountPoint.childNodes[mountChildIdx] &&
-      (mountPoint.childNodes[mountChildIdx].nodeType === 3 ||
-        (mountPoint.childNodes[mountChildIdx] as Element).localName === 'script')
-    ) {
-      mountChildIdx++;
-    }
-    if (!mountPoint.childNodes[mountChildIdx]) {
-      node = root.appendChild(context.createElement('div'));
-    } else {
-      node = mountPoint.childNodes[mountChildIdx];
-    }
-  }
-  return node;
-}
-
 export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTree<DOMRef>, context: HydrationContext<DOMRef>, drawingContext: DrawingContext<DOMRef>): boolean {
+
   // If script tags are rendered first in body, skip them.
-  const node: Node = preamble(mountPoint, drawingContext);
+  if (!vtree || !mountPoint) return false;
+  let node: Node = drawingContext.getRoot() === mountPoint ? mountPoint.firstChild : mountPoint;
 
   // begin walking the DOM, report the result
   if (!walk(logLevel, vtree, node, context, drawingContext)) {
     // If we failed to prerender because the structures were different, fallback to drawing
-    if (logLevel) {
-      console.warn('[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff');
-    }
-
-    // Remove all children before rebuilding DOM
-    while (context.firstChild(node as DOMRef))
-      drawingContext.removeChild(node as DOMRef, context.lastChild(node as DOMRef));
-
-    diff (null, vtree, node, drawingContext);
-    return false;
+      if (logLevel) {
+        console.warn('[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff');
+      }
+      while (context.firstChild(node as DOMRef))
+        drawingContext.removeChild(node as DOMRef, context.lastChild(node as DOMRef));
+     return false;
   } else {
     if (logLevel) {
       console.info('[DEBUG_HYDRATE] Successfully prerendered page');
@@ -70,6 +36,7 @@ export function hydrate(logLevel: boolean, mountPoint: DOMRef | Text, vtree: VTr
   }
   return true;
 }
+
 function diagnoseError(logLevel: boolean, vtree: VTree<DOMRef>, node: Node): void {
   if (logLevel) console.warn('[DEBUG_HYDRATE] VTree differed from node', vtree, node);
 }
@@ -177,7 +144,7 @@ function check(result: boolean, vtree: VTree<DOMRef>, context: HydrationContext<
     for (const child of vtree.children) {
        const value = check(result, child, context, drawingContext);
        result = result && value;
-  }
+    }
   }
   return result;
 }
@@ -189,15 +156,12 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
   // We handle this in collapseSiblingTextNodes
   switch (vtree.type) {
     case VTreeType.VComp:
-      callCreated(node, vtree, drawingContext);
-      if (!vtree.child) {
-        diagnoseError(logLevel, vtree, node);
-        return false;
-      }
-      return walk (logLevel, vtree.child, node, context, drawingContext);
-      break;
+       if (!walk(logLevel, vtree.child, node, context, drawingContext)) {
+          return false;
+       }
+       break;
     case VTreeType.VText:
-       if (node.nodeType !== 3 || vtree.text !== node.textContent) {
+       if (node.nodeType !== 3 || vtree.text.trim() !== node.textContent.trim()) {
          diagnoseError(logLevel, vtree, node);
          return false;
        }
@@ -224,6 +188,7 @@ function walk(logLevel: boolean, vtree: VTree<DOMRef>, node: Node, context: Hydr
           return false;
         }
       }
+      break;
   }
   return true;
 }
diff --git a/ts/miso/util.ts b/ts/miso/util.ts
index 1032ff4b3..1ee722c65 100644
--- a/ts/miso/util.ts
+++ b/ts/miso/util.ts
@@ -94,16 +94,16 @@ export function fetchCore (
 
 */
 export function getParentComponentId (
-  vcompNode: ParentNode
+  vcompNode
 ): number {
-    var climb = function (node : ParentNode) {
+    var climb = function (node) {
       let parentComponentId = null;
-      while (node && node.parentNode) {
-          if ('componentId' in node.parentNode) {
-              parentComponentId = node.parentNode['componentId'];
+      while (node && node.parent) {
+          if ('componentId' in node.parent) {
+              parentComponentId = node.parent['componentId'];
               break;
           }
-          node = node.parentNode;
+          node = node.parent;
       }
       return parentComponentId;
     }
diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index b00b940ff..da562ed10 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -88,77 +88,6 @@ describe ("Hydration tests", () => {
     expect(div.childNodes[0].textContent).toEqual('foobarbaz');
   });
 
-  test('Should copy DOM into VTree with multiple consecutive text nodes and collapse them without mount point', () => {
-    const div = document.createElement('div');
-    document.body.appendChild(div);
-    const txt1 = document.createTextNode('foobarbaz');
-    div.appendChild(txt1);
-    const mid = document.createElement('div');
-    div.appendChild(mid);
-    const txt2 = document.createTextNode('foobarbaz');
-    div.appendChild(txt2);
-    const currentNode = vnode<DOMRef>({
-      children: [
-        vtext('foo'),
-        vtext('bar'),
-        vtext('baz'),
-        vnode<DOMRef>({}),
-        vtext('foo'),
-        vtext('bar'),
-        vtext('baz'),
-      ],
-    });
-    const result = hydrate(false, null, currentNode, hydrationContext, drawingContext);
-    //Expect "foobarbaz" to be split up into three nodes in the DOM
-    expect(result).toBe(true);
-    expect(div.childNodes[0].textContent).toEqual('foobarbaz');
-    expect(div.childNodes[2].textContent).toEqual('foobarbaz');
-  });
-
-  test('Should copy DOM into VTree at mountPoint', () => {
-    var unrelatedDiv = document.createElement('div');
-    document.body.appendChild(document.createElement('script'));
-    document.body.appendChild(document.createTextNode('test'));
-    document.body.appendChild(unrelatedDiv);
-    var unrelatedTxt = document.createTextNode('Not part of Miso app');
-    unrelatedDiv.appendChild(unrelatedTxt);
-    var misoDiv = document.createElement('div');
-    document.body.appendChild(misoDiv);
-    var nestedDiv1 = document.createElement('div');
-    misoDiv.appendChild(nestedDiv1);
-    var nestedDiv2 = document.createElement('div');
-    nestedDiv1.appendChild(nestedDiv2);
-    var txt = document.createTextNode('foo');
-    nestedDiv2.appendChild(txt);
-    var tree:any = vnode<DOMRef>({ children: [vnode<DOMRef>({ children: [vtext('foo')] })] });
-    var succeeded = hydrate(false, misoDiv, tree, hydrationContext, drawingContext);
-    expect(tree.children[0].children[0].domRef).toEqual(txt);
-    expect(succeeded).toEqual(true);
-  });
-
-  test('Should copy DOM into VTree at body w/ script / text siblings', () => {
-    var unrelatedDiv = document.createElement('div');
-    document.body.appendChild(document.createElement('script'));
-    document.body.appendChild(document.createTextNode('test'));
-    document.body.appendChild(unrelatedDiv);
-    var unrelatedTxt = document.createTextNode('Not part of Miso app');
-    unrelatedDiv.appendChild(unrelatedTxt);
-    var misoDiv = document.createElement('div');
-    document.body.appendChild(misoDiv);
-    var nestedDiv1 = document.createElement('div');
-    misoDiv.appendChild(nestedDiv1);
-    var nestedDiv2 = document.createElement('div');
-    nestedDiv1.appendChild(nestedDiv2);
-    var txt = document.createTextNode('foo');
-    nestedDiv2.appendChild(txt);
-    var currentNode : any = vnodeKids('div', [vnodeKids('div', [vtext('foo')])]);
-    var succeeded = hydrate(true, document.body, currentNode, hydrationContext, drawingContext);
-    expect(currentNode.children[0].children[0].domRef.textContent).toEqual(
-        new Text('foo').textContent
-    );
-    expect(succeeded).toEqual(false);
-  });
-
   test('Should fail to mount on a text node', () => {
     var misoTxt = document.createTextNode('foo');
     document.body.appendChild(misoTxt);
@@ -375,7 +304,7 @@ describe ("Hydration tests", () => {
     expect(integrityCheck(tree, hydrationContext, drawingContext)).toBe(false);
   });
 
-  test('Should call mountComponent when hydrating VComp', () => {
+  test('Should not call mountComponent when hydrating VComp', () => {
     const txt = document.createTextNode('component content');
     const div = document.createElement('div');
     div.appendChild(txt);
@@ -387,11 +316,10 @@ describe ("Hydration tests", () => {
 
     const comp = vcomp<DOMRef>({
       key: 'test-comp',
+      componentId : 1,
+      child: vnode({ children: [vtext<DOMRef>('component content')] }),
       mount: (parent: any, callback: any) => {
         mountCalled = true;
-        componentId = 1;
-        componentTree = vnode({ children: [vtext<DOMRef>('component content')] });
-        hydrate(false, parent, componentTree, hydrationContext, drawingContext);
         callback(componentId, componentTree);
       },
       unmount: () => {},
@@ -400,13 +328,12 @@ describe ("Hydration tests", () => {
     const result = hydrate(false, document.body, comp, hydrationContext, drawingContext);
 
     expect(result).toBe(true);
-    expect(mountCalled).toBe(true);
-    expect(componentId).toBe(1);
+    expect(mountCalled).toBe(false);
     expect(comp.componentId).toBe(1);
-    expect(comp.child).toBe(componentTree);
+    expect(comp.child).toBeTruthy();
   });
 
-  test('Should call mountComponent with onBeforeMounted hook', () => {
+  test('Should not call mountComponent with onBeforeMounted hook', () => {
     const div = document.createElement('div');
     document.body.appendChild(div);
 
@@ -434,8 +361,8 @@ describe ("Hydration tests", () => {
     const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
 
     expect(result).toBe(false); // Hydration fails, falls back to mounting
-    expect(beforeMountedCalled).toBe(true);
-    expect(onMountedCalled).toBe(true);
+    expect(beforeMountedCalled).toBe(false);
+    expect(onMountedCalled).toBe(false);
   });
 
   test('Should handle VComp with nested child VTree', () => {
@@ -446,12 +373,12 @@ describe ("Hydration tests", () => {
 
     const comp = vcomp<DOMRef>({
       key: 'nested-comp',
+      child: vnode<DOMRef>({
+        tag: 'span',
+        children: [vtext<DOMRef>('nested child')],
+      }),
       mount: (parent: any, callback: any) => {
-        childComponentTree = vnode<DOMRef>({
-          tag: 'span',
-          children: [vtext<DOMRef>('nested child')],
-        });
-        callback(3, childComponentTree);
+
       },
       unmount: () => {},
     }) as VComp<DOMRef>;
@@ -461,9 +388,7 @@ describe ("Hydration tests", () => {
     });
 
     const result = hydrate(false, document.body, tree, hydrationContext, drawingContext);
-
     expect(result).toBe(false); // Hydration fails, falls back to mounting
-    expect(comp.child).toBe(childComponentTree);
     expect((comp.child as VNode<DOMRef>).tag).toBe('span');
   });
 
@@ -536,8 +461,9 @@ describe ("Hydration tests", () => {
 
     const comp = vcomp<DOMRef>({
       key: 'walk-comp',
+      componentId: 6,
+      child: vnode<DOMRef>({ tag: 'span' }),
       mount: (parent: any, callback: any) => {
-        callback(6, vnode<DOMRef>({ tag: 'span' }));
       },
       unmount: () => {},
     }) as VComp<DOMRef>;
diff --git a/ts/spec/util.spec.ts b/ts/spec/util.spec.ts
index e40d2b1c3..cdac390b9 100644
--- a/ts/spec/util.spec.ts
+++ b/ts/spec/util.spec.ts
@@ -47,12 +47,11 @@ describe ('Utils tests', () => {
 
   test('Should get parentComponentId', () => {
     /* build */
-    const grandparent = document.createElement('div');
-    grandparent['componentId'] = 100;
-    const parent = document.createElement('div');
-    grandparent.appendChild(parent);
-    const child = document.createElement('div');
-    parent.appendChild(child);
+    const grandparent = { componentId : 100 };
+    let parent = {};
+    parent['parent'] = grandparent;
+    let child = {};
+    child['parent'] = parent;
     /* test */
     let vcomp = child;
     expect(getParentComponentId(vcomp)).toBe(100);

From 8fbf231e6a69c36fd0b9ce1227592eceb90e1448 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 12:38:56 -0600
Subject: [PATCH 72/76] lint

---
 js/miso.js              | 2 +-
 js/miso.prod.js         | 2 +-
 ts/miso/dom.ts          | 2 --
 ts/miso/event.ts        | 3 +--
 ts/spec/hydrate.spec.ts | 2 +-
 5 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index af90d95a7..f0af11a09 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -335,7 +335,7 @@ function mountComponent(parent, op, replacing, n, context) {
         context.replaceChild(parent, childDomRef, replacing);
       } else if (op === 2 /* INSERT_BEFORE */) {
         context.insertBefore(parent, childDomRef, replacing);
-      } else if (op === 0 /* APPEND */) {}
+      }
     }
   });
   if (n.onMounted)
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 1ec63f242..d49f89619 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q);else if(K===0);}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,I,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{I=!1,z=X;while(z<=Y){if(G[z].key===q.key){I=!0,d=G[z];break}z++}if(I)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parent){if("componentId"in Q.parent){U=Q.parent.componentId;break}Q=Q.parent}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,d=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parent){if("componentId"in Q.parent){U=Q.parent.componentId;break}Q=Q.parent}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/ts/miso/dom.ts b/ts/miso/dom.ts
index aa97f534d..009fb1494 100644
--- a/ts/miso/dom.ts
+++ b/ts/miso/dom.ts
@@ -378,8 +378,6 @@ function mountComponent<T>(parent: T, op : OP, replacing: T | null, n: VComp<T>,
         context.replaceChild(parent, childDomRef, replacing);
       } else if (op === OP.INSERT_BEFORE) {
         context.insertBefore(parent, childDomRef, replacing);
-      } else if (op === OP.APPEND) {
-        // context.appendChild(parent, childDomRef);
       }
       // For OP.APPEND, this happens naturally in mount()
     }
diff --git a/ts/miso/event.ts b/ts/miso/event.ts
index 232aac042..2e81a871f 100644
--- a/ts/miso/event.ts
+++ b/ts/miso/event.ts
@@ -1,5 +1,4 @@
-import { EventContext, VTree, EventCapture, EventObject, Options, VTreeType, VComp } from './types';
-import { drill } from './dom';
+import { EventContext, VTree, EventCapture, EventObject, Options, VTreeType } from './types';
 
 /* event delegation algorithm */
 export function delegate<T> (
diff --git a/ts/spec/hydrate.spec.ts b/ts/spec/hydrate.spec.ts
index da562ed10..d12958104 100644
--- a/ts/spec/hydrate.spec.ts
+++ b/ts/spec/hydrate.spec.ts
@@ -1,6 +1,6 @@
 /* imports */
 import { hydrate, integrityCheck } from '../miso/hydrate';
-import { vnode, vtext, vcomp, vnodeKids } from '../miso/smart';
+import { vnode, vtext, vcomp } from '../miso/smart';
 import { VText, VNode, DOMRef, VComp } from '../miso/types';
 import { test, expect, describe, afterEach, beforeAll } from 'bun:test';
 import { hydrationContext, drawingContext } from '../miso/context/dom';

From 05cdefcc05e6602f7cb718602e312558d3beffe2 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 20:20:57 -0600
Subject: [PATCH 73/76] Revert `getParentComponentId`, regen JS, use mock
 parent object

---
 js/miso.js           |  8 ++++----
 js/miso.prod.js      |  2 +-
 src/Miso/Runtime.hs  | 11 +++++------
 ts/miso/util.ts      | 12 ++++++------
 ts/spec/util.spec.ts | 11 ++++++-----
 5 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index f0af11a09..627ed1675 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -835,12 +835,12 @@ function fetchCore(url, method, body, requestHeaders, successful, errorful, resp
 function getParentComponentId(vcompNode) {
   var climb = function(node) {
     let parentComponentId = null;
-    while (node && node.parent) {
-      if ("componentId" in node.parent) {
-        parentComponentId = node.parent["componentId"];
+    while (node && node.parentNode) {
+      if ("componentId" in node.parentNode) {
+        parentComponentId = node.parentNode["componentId"];
         break;
       }
-      node = node.parent;
+      node = node.parentNode;
     }
     return parentComponentId;
   };
diff --git a/js/miso.prod.js b/js/miso.prod.js
index d49f89619..6a93537e6 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,d=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parent){if("componentId"in Q.parent){U=Q.parent.componentId;break}Q=Q.parent}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,d=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index 607e925ac..c2384513f 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -170,12 +170,9 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
             liftIO (atomicWriteIORef ref newTree)
             Diff.diff Nothing (Just newTree) componentDOMRef
         pure ref
-
-  vtree <- liftIO (readIORef componentVTree)
-  vtree <# ("componentId" :: MisoString) $ componentId
+  componentDOMRef <# ("componentId" :: MisoString) $ componentId
   componentParentId <- do
-    ref <- toJSVal vtree
-    FFI.getParentComponentId ref >>= \case
+    FFI.getParentComponentId componentDOMRef >>= \case
       Nothing -> pure rootComponentId
       Just parentId -> pure parentId
   componentSubThreads <- liftIO (newIORef M.empty)
@@ -858,7 +855,9 @@ buildVTree hydrate snk logLevel_ events_ = \case
 
     case hydrate of
       Hydrate -> do
-        ComponentState {..} <- initialize hydrate False app (pure jsNull)
+        -- Mock .domRef for use during hydration
+        domRef <- toJSVal =<< create
+        ComponentState {..} <- initialize hydrate False app (pure domRef)
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
         FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
diff --git a/ts/miso/util.ts b/ts/miso/util.ts
index 1ee722c65..1032ff4b3 100644
--- a/ts/miso/util.ts
+++ b/ts/miso/util.ts
@@ -94,16 +94,16 @@ export function fetchCore (
 
 */
 export function getParentComponentId (
-  vcompNode
+  vcompNode: ParentNode
 ): number {
-    var climb = function (node) {
+    var climb = function (node : ParentNode) {
       let parentComponentId = null;
-      while (node && node.parent) {
-          if ('componentId' in node.parent) {
-              parentComponentId = node.parent['componentId'];
+      while (node && node.parentNode) {
+          if ('componentId' in node.parentNode) {
+              parentComponentId = node.parentNode['componentId'];
               break;
           }
-          node = node.parent;
+          node = node.parentNode;
       }
       return parentComponentId;
     }
diff --git a/ts/spec/util.spec.ts b/ts/spec/util.spec.ts
index cdac390b9..e40d2b1c3 100644
--- a/ts/spec/util.spec.ts
+++ b/ts/spec/util.spec.ts
@@ -47,11 +47,12 @@ describe ('Utils tests', () => {
 
   test('Should get parentComponentId', () => {
     /* build */
-    const grandparent = { componentId : 100 };
-    let parent = {};
-    parent['parent'] = grandparent;
-    let child = {};
-    child['parent'] = parent;
+    const grandparent = document.createElement('div');
+    grandparent['componentId'] = 100;
+    const parent = document.createElement('div');
+    grandparent.appendChild(parent);
+    const child = document.createElement('div');
+    parent.appendChild(child);
     /* test */
     let vcomp = child;
     expect(getParentComponentId(vcomp)).toBe(100);

From 783f079d3801953e3c42b2819b387e2ceb12e8b9 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 22:23:11 -0600
Subject: [PATCH 74/76] Thread `ComponentId` as parent `ComponentId` through
 `initialize`.

---
 js/miso.js               | 15 ---------------
 js/miso.prod.js          |  2 +-
 src/Miso.hs              |  4 ++--
 src/Miso/FFI.hs          |  3 ---
 src/Miso/FFI/Internal.hs | 15 ---------------
 src/Miso/Runtime.hs      | 27 +++++++++++++--------------
 ts/index.ts              |  2 --
 ts/miso.ts               |  2 --
 ts/miso/util.ts          | 25 -------------------------
 ts/spec/util.spec.ts     | 18 +-----------------
 tsconfig.json            |  3 ++-
 11 files changed, 19 insertions(+), 97 deletions(-)

diff --git a/js/miso.js b/js/miso.js
index 627ed1675..e1b2ea160 100644
--- a/js/miso.js
+++ b/js/miso.js
@@ -832,20 +832,6 @@ function fetchCore(url, method, body, requestHeaders, successful, errorful, resp
     errorful({ body: null, error: err.message, headers, status });
   }
 }
-function getParentComponentId(vcompNode) {
-  var climb = function(node) {
-    let parentComponentId = null;
-    while (node && node.parentNode) {
-      if ("componentId" in node.parentNode) {
-        parentComponentId = node.parentNode["componentId"];
-        break;
-      }
-      node = node.parentNode;
-    }
-    return parentComponentId;
-  };
-  return climb(vcompNode);
-}
 function websocketConnect(url, onOpen, onClose, onMessageText, onMessageJSON, onMessageBLOB, onMessageArrayBuffer, onError, textOnly) {
   try {
     let socket = new WebSocket(url);
@@ -1130,7 +1116,6 @@ globalThis["miso"] = {
   websocketSend,
   undelegate,
   populateClass,
-  getParentComponentId,
   integrityCheck,
   setDrawingContext: function(name) {
     const drawing = globalThis[name]["drawingContext"];
diff --git a/js/miso.prod.js b/js/miso.prod.js
index 6a93537e6..d55dc543d 100644
--- a/js/miso.prod.js
+++ b/js/miso.prod.js
@@ -1 +1 @@
-function W(G,K,Q,U){if(!G&&!K)return;else if(!G)EG(K,Q,U);else if(!K)XG(G,Q,U);else if(G.type===2&&K.type===2)UG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}I(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,p(G,K,U);else I(G,K,Q,U);else I(G,K,Q,U)}function UG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function I(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function XG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(YG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function YG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)JG(G)}function ZG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(ZG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function p(G,K,Q){$G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),_G(G?G.classList:null,K.classList,K.domRef,Q),qG(G?G.css:{},K.css,K.domRef,Q),HG(G?G.children:[],K.children,K.domRef,Q),AG(K)}function _G(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function $G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function qG(G,K,Q,U){U.setInlineStyle(G,K,Q)}function zG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function HG(G,K,Q,U){if(zG(G,K))DG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function WG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function a(G,K,Q){switch(K.type){case 0:s(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:s(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(WG(U,X),U.onCreated)U.onCreated(U.domRef);switch(p(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function AG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function JG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function s(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(E(U))}function EG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function BG(G,K,Q){Q.removeChild(G,J(K))}function NG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function DG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,P,d;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)BG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)NG(H,A,Q,U),SG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{P=!1,z=X;while(z<=Y){if(G[z].key===q.key){P=!0,d=G[z];break}z++}if(P)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,d,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function SG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){o(Y,G,Q,U,X)},Z.capture)}function o(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)r(Y,Z,K,U,X);else r(G,Z,K,U,X)})}function r(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=RG(Q,Z,X);F(G,K,Y,U,X)}}function RG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function F(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return F(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)F(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)F(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)c(K.parent,G)}}else if(!G.captureStopped)c(K.parent,G)}}function c(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in MG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function MG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function FG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function n(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return t(!0,G,K,Q)}function t(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(n(Q.getInlineStyle(K.domRef,X)).toString()!==n(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=t(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=FG(K.children),a(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G){var K=function(Q){let U=null;while(Q&&Q.parentNode){if("componentId"in Q.parentNode){U=Q.parentNode.componentId;break}Q=Q.parentNode}return U};return K(G)}function m(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function y(G){if(G)G.close(),G=null}function i(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function v(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function l(G){if(G)G.close(),G=null}function x(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var e={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},GG={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},KG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},QG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:GG,eventContext:e,drawingContext:QG,componentContext:KG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:v,eventSourceClose:l,websocketConnect:m,websocketClose:y,websocketSend:i,undelegate:C,populateClass:x,getParentComponentId:g,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
+function W(G,K,Q,U){if(!G&&!K)return;else if(!G)JG(K,Q,U);else if(!K)UG(G,Q,U);else if(G.type===2&&K.type===2)QG(G,K,U);else if(G.type===0&&K.type===0){if(K.key===G.key){K.child=G.child;return}P(G,K,Q,U)}else if(G.type===1&&K.type===1)if(K.tag===G.tag&&K.key===G.key)K.domRef=G.domRef,d(G,K,U);else P(G,K,Q,U);else P(G,K,Q,U)}function QG(G,K,Q){if(G.text!==K.text)Q.setTextContent(G.domRef,K.text);K.domRef=G.domRef;return}function E(G){if(!G.child)throw new Error("'drill' called on an unmounted Component. This should never happen, please make an issue.");switch(G.child.type){case 0:return E(G.child);default:return G.child.domRef}}function J(G){switch(G.type){case 0:return E(G);default:return G.domRef}}function P(G,K,Q,U){switch(G.type){case 2:break;default:S(G);break}switch(K.type){case 2:K.domRef=U.createTextNode(K.text),U.replaceChild(Q,K.domRef,J(G));break;case 0:R(Q,1,J(G),K,U);break;case 1:R(Q,1,J(G),K,U);break}switch(G.type){case 2:break;default:D(G);break}}function UG(G,K,Q){switch(G.type){case 2:break;default:S(G);break}switch(Q.removeChild(K,J(G)),G.type){case 2:break;default:D(G);break}}function D(G){switch(XG(G),G.type){case 1:for(let K of G.children)if(K.type===1||K.type===0)D(K);break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)D(G.child)}break}}function XG(G){if(G.type===1&&G.onDestroyed)G.onDestroyed();if(G.type===0)AG(G)}function YG(G){switch(G.type){case 0:if(G.onBeforeUnmounted)G.onBeforeUnmounted();break;case 1:if(G.onBeforeDestroyed)G.onBeforeDestroyed();break;default:break}}function S(G){switch(YG(G),G.type){case 1:for(let K of G.children){if(K.type===2)continue;S(K)}break;case 0:if(G.child){if(G.child.type===1||G.child.type===0)S(G.child)}break}}function d(G,K,Q){_G(G?G.props:{},K.props,K.domRef,K.ns==="svg",Q),ZG(G?G.classList:null,K.classList,K.domRef,Q),$G(G?G.css:{},K.css,K.domRef,Q),zG(G?G.children:[],K.children,K.domRef,Q),WG(K)}function ZG(G,K,Q,U){if(!G&&!K)return;if(!G){for(let X of K)U.addClass(X,Q);return}if(!K){for(let X of G)U.removeClass(X,Q);return}for(let X of G)if(!K.has(X))U.removeClass(X,Q);for(let X of K)if(!G.has(X))U.addClass(X,Q);return}function _G(G,K,Q,U,X){var Z;for(let Y in G)if(Z=K[Y],Z===void 0)if(U||!(Y in Q)||Y==="disabled")X.removeAttribute(Q,Y);else X.setAttribute(Q,Y,"");else{if(Z===G[Y]&&Y!=="checked"&&Y!=="value")continue;if(U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=Z;else X.setAttribute(Q,Y,Z)}for(let Y in K){if(G&&G[Y])continue;if(Z=K[Y],U)if(Y==="href")X.setAttributeNS(Q,"http://www.w3.org/1999/xlink","href",Z);else X.setAttribute(Q,Y,Z);else if(Y in Q&&!(Y==="list"||Y==="form"))Q[Y]=K[Y];else X.setAttribute(Q,Y,Z)}}function $G(G,K,Q,U){U.setInlineStyle(G,K,Q)}function qG(G,K){if(G.length===0||K.length===0)return!1;for(var Q=0;Q<G.length;Q++)if(G[Q].key===null||G[Q].key===void 0)return!1;for(var Q=0;Q<K.length;Q++)if(K[Q].key===null||K[Q].key===void 0)return!1;return!0}function zG(G,K,Q,U){if(qG(G,K))NG(G,K,Q,U);else for(let X=0;X<Math.max(K.length,G.length);X++)W(G[X],K[X],Q,U)}function HG(G,K){if(G.ns==="svg")G.domRef=K.createElementNS("http://www.w3.org/2000/svg",G.tag);else if(G.ns==="mathml")G.domRef=K.createElementNS("http://www.w3.org/1998/Math/MathML",G.tag);else G.domRef=K.createElement(G.tag)}function p(G,K,Q){switch(K.type){case 0:a(G,0,null,K,Q);break;case 1:if(K.onCreated)K.onCreated(K.domRef);break}}function R(G,K,Q,U,X){switch(U.type){case 2:switch(U.domRef=X.createTextNode(U.text),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break;case 0:a(G,K,Q,U,X);break;case 1:if(U.onBeforeCreated)U.onBeforeCreated();if(HG(U,X),U.onCreated)U.onCreated(U.domRef);switch(d(null,U,X),K){case 2:X.insertBefore(G,U.domRef,Q);break;case 0:X.appendChild(G,U.domRef);break;case 1:X.replaceChild(G,U.domRef,Q);break}break}}function WG(G){if(G.tag==="canvas"&&G.draw)G.draw(G.domRef)}function AG(G){if(G.onUnmounted)G.onUnmounted(E(G));G.unmount(G.componentId)}function a(G,K,Q,U,X){if(U.onBeforeMounted)U.onBeforeMounted();if(U.mount(G,(Z,Y)=>{if(U.componentId=Z,U.child=Y,Y.parent=U,Y.type!==0){let _=J(Y);if(K===1&&Q)X.replaceChild(G,_,Q);else if(K===2)X.insertBefore(G,_,Q)}}),U.onMounted)U.onMounted(E(U))}function JG(G,K,Q){if(G.type===2)G.domRef=Q.createTextNode(G.text),Q.appendChild(K,G.domRef);else R(K,0,null,G,Q)}function N(G,K,Q,U){U.insertBefore(G,J(K),Q?J(Q):null)}function EG(G,K,Q){Q.removeChild(G,J(K))}function BG(G,K,Q,U){U.swapDOMRefs(J(G),J(K),Q)}function NG(G,K,Q,U){var X=0,Z=0,Y=G.length-1,_=K.length-1,z,q,$,H,A,F,x;for(;;){if(Z>_&&X>Y)break;if(q=K[Z],$=K[_],A=G[X],H=G[Y],X>Y)W(null,q,Q,U),N(Q,q,A,U),G.splice(Z,0,q),Z++;else if(Z>_){z=Y;while(Y>=X)EG(Q,G[Y--],U);G.splice(X,z-X+1);break}else if(A.key===q.key)W(G[X++],K[Z++],Q,U);else if(H.key===$.key)W(G[Y--],K[_--],Q,U);else if(A.key===$.key&&q.key===H.key)BG(H,A,Q,U),DG(G,X,Y),W(G[X++],K[Z++],Q,U),W(G[Y--],K[_--],Q,U);else if(A.key===$.key)N(Q,A,H.nextSibling,U),G.splice(Y,0,G.splice(X,1)[0]),W(G[Y--],K[_--],Q,U);else if(H.key===q.key)N(Q,H,A,U),G.splice(X,0,G.splice(Y,1)[0]),W(G[X++],q,Q,U),Z++;else{F=!1,z=X;while(z<=Y){if(G[z].key===q.key){F=!0,x=G[z];break}z++}if(F)G.splice(X,0,G.splice(z,1)[0]),W(G[X++],q,Q,U),N(Q,x,G[X],U),Z++;else R(Q,2,J(A),q,U),G.splice(X++,0,q),Z++,Y++}}}function DG(G,K,Q){let U=G[K];G[K]=G[Q],G[Q]=U}function L(G,K,Q,U,X){for(let Z of K)X.addEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function C(G,K,Q,U,X){for(let Z of K)X.removeEventListener(G,Z.name,function(Y){c(Y,G,Q,U,X)},Z.capture)}function c(G,K,Q,U,X){Q(function(Z){if(Array.isArray(G))for(let Y of G)s(Y,Z,K,U,X);else s(G,Z,K,U,X)})}function s(G,K,Q,U,X){var Z=X.getTarget(G);if(Z){let Y=SG(Q,Z,X);I(G,K,Y,U,X)}}function SG(G,K,Q){var U=[];while(!Q.isEqual(G,K))if(U.unshift(K),K&&Q.parentNode(K))K=Q.parentNode(K);else return U;return U}function I(G,K,Q,U,X){if(!Q.length){if(U)console.warn('Event "'+G.type+'" did not find an event handler to dispatch on',K,G);return}else if(Q.length>1){if(K.type===2)return;else if(K.type===0){if(!K.child){if(U)throw console.error("VComp has no child property set during event delegation",K),console.error("This means the Component has not been fully mounted, this should never happen"),new Error("VComp has no .child property set during event delegation");return}return I(G,K.child,Q,U,X)}else if(K.type===1){if(X.isEqual(K.domRef,Q[0])){let Z=K.events.captures[G.type];if(Z){let Y=Z.options;if(Y.preventDefault)G.preventDefault();if(!G.captureStopped)Z.runEvent(G,K.domRef);if(Y.stopPropagation)G.captureStopped=!0}Q.splice(0,1)}for(let Z of K.children)I(G,Z,Q,U,X)}}else if(K.type===0){if(K.child)I(G,K.child,Q,U,X)}else if(K.type===1){let Z=K.events.captures[G.type];if(Z&&!G.captureStopped){let _=Z.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Z.runEvent(G,Q[0]),_.stopPropagation)G.captureStopped=!0}}let Y=K.events.bubbles[G.type];if(Y&&!G.captureStopped){let _=Y.options;if(X.isEqual(Q[0],K.domRef)){if(_.preventDefault)G.preventDefault();if(Y.runEvent(G,Q[0]),!_.stopPropagation)r(K.parent,G)}}else if(!G.captureStopped)r(K.parent,G)}}function r(G,K){while(G)switch(G.type){case 2:break;case 1:let Q=G.events.bubbles[K.type];if(Q){let U=Q.options;if(U.preventDefault)K.preventDefault();if(Q.runEvent(K,G.domRef),U.stopPropagation)return}G=G.parent;break;case 0:if(!G.eventPropagation)return;G=G.parent;break}}function B(G,K){if(typeof G[0]==="object"){var Q=[];for(var U=0;U<G.length;U++)Q.push(B(G[U],K));return Q}for(let _ of G)K=K[_];var X;if(K instanceof Array||"length"in K&&K.localName!=="select"){X=[];for(var Z=0;Z<K.length;Z++)X.push(B([],K[Z]));return X}X={};for(var Y in RG(K)){if(K.localName==="input"&&(Y==="selectionDirection"||Y==="selectionStart"||Y==="selectionEnd"))continue;if(typeof K[Y]=="string"||typeof K[Y]=="number"||typeof K[Y]=="boolean")X[Y]=K[Y]}return X}function RG(G){var K={},Q=0;do{var U=Object.getOwnPropertyNames(G);for(Q=0;Q<U.length;Q++)K[U[Q]]=null}while(G=Object.getPrototypeOf(G));return K}function MG(G){var K=0,Q=G.length>0?[G[0]]:[];for(var U=1;U<G.length;U++){if(Q[K].type===2&&G[U].type===2){Q[K].text+=G[U].text;continue}Q[++K]=G[U]}return Q}function O(G,K,Q,U,X){if(!Q||!K)return!1;let Z=X.getRoot()===K?K.firstChild:K;if(!w(G,Q,Z,U,X)){if(G)console.warn("[DEBUG_HYDRATE] Could not copy DOM into virtual DOM, falling back to diff");while(U.firstChild(Z))X.removeChild(Z,U.lastChild(Z));return!1}else if(G)console.info("[DEBUG_HYDRATE] Successfully prerendered page");return!0}function V(G,K,Q){if(G)console.warn("[DEBUG_HYDRATE] VTree differed from node",K,Q)}function o(G){if(G.substr(0,1)=="#"){let K=(G.length-1)/3,Q=[17,1,0.062272][K-1];return[Math.round(parseInt(G.substr(1,K),16)*Q),Math.round(parseInt(G.substr(1+K,K),16)*Q),Math.round(parseInt(G.substr(1+2*K,K),16)*Q)]}else return G.split("(")[1].split(")")[0].split(",").map((K)=>{return+K})}function f(G,K,Q){return n(!0,G,K,Q)}function n(G,K,Q,U){if(K.type==2){if(Q.getTag(K.domRef)!=="#text")console.warn("VText domRef not a TEXT_NODE",K),G=!1;else if(K.text!==Q.getTextContent(K.domRef))console.warn("VText node content differs",K),G=!1}else if(K.type===1){if(K.tag.toUpperCase()!==Q.getTag(K.domRef).toUpperCase())console.warn("Integrity check failed, tags differ",K.tag.toUpperCase(),Q.getTag(K.domRef)),G=!1;if("children"in K&&K.children.length!==Q.children(K.domRef).length)console.warn("Integrity check failed, children lengths differ",K,K.children,Q.children(K.domRef)),G=!1;for(let X in K.props)if(X==="href"||X==="src"){let Z=window.location.origin+"/"+K.props[X],Y=Q.getAttribute(K.domRef,X),_=K.props[X];if(Z!==Y&&_!==Y&&_+"/"!==Y&&Z+"/"!==Y)console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="height"||X==="width"){if(parseFloat(K.props[X])!==parseFloat(Q.getAttribute(K.domRef,X)))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1}else if(X==="class"||X==="className"){if(K.props[X]!==Q.getAttribute(K.domRef,"class"))console.warn("Property class differs",K.props[X],Q.getAttribute(K.domRef,"class")),G=!1}else if(K.props[X]!==Q.getAttribute(K.domRef,X))console.warn("Property "+X+" differs",K.props[X],Q.getAttribute(K.domRef,X)),G=!1;for(let X in K.css)if(X==="color"){if(o(Q.getInlineStyle(K.domRef,X)).toString()!==o(K.css[X]).toString())console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1}else if(K.css[X]!==Q.getInlineStyle(K.domRef,X))console.warn("Style "+X+" differs",K.css[X],Q.getInlineStyle(K.domRef,X)),G=!1;for(let X of K.children){let Z=n(G,X,Q,U);G=G&&Z}}return G}function w(G,K,Q,U,X){switch(K.type){case 0:if(!w(G,K.child,Q,U,X))return!1;break;case 2:if(Q.nodeType!==3||K.text.trim()!==Q.textContent.trim())return V(G,K,Q),!1;K.domRef=Q;break;case 1:if(Q.nodeType!==1)return V(G,K,Q),!1;K.domRef=Q,K.children=MG(K.children),p(Q,K,X);for(var Z=0;Z<K.children.length;Z++){let Y=K.children[Z],_=Q.childNodes[Z];if(!_)return V(G,Y,_),!1;if(!w(G,Y,_,U,X))return!1}break}return!0}var j="1.9.0.0";function k(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.focus)U.focus()};K>0?setTimeout(Q,K):Q()}function b(G,K){var Q=function(){var U=document.getElementById(G);if(U&&U.blur)U.blur()};K>0?setTimeout(Q,K):Q()}function h(G,K){var Q=function(){var U=document.getElementById(G);if(U&&typeof U.select==="function")U.select()};K>0?setTimeout(Q,K):Q()}function T(G,K,Q,U){var X=function(){var Z=document.getElementById(G);if(Z&&typeof Z.setSelectionRange==="function")Z.setSelectionRange(K,Q,"none")};U>0?setTimeout(X,U):X()}function u(G,K,Q,U,X,Z,Y){var _={method:K,headers:U};if(Q)_.body=Q;let z={},q=null;try{fetch(G,_).then(($)=>{q=$.status;for(let[H,A]of $.headers)z[H]=A;if(!$.ok)throw new Error($.statusText);if(Y=="json")return $.json();else if(Y=="text")return $.text();else if(Y==="arrayBuffer")return $.arrayBuffer();else if(Y==="blob")return $.blob();else if(Y==="bytes")return $.bytes();else if(Y==="formData")return $.formData();else if(Y==="none")return X({error:null,body:null,headers:z,status:q})}).then(($)=>X({error:null,body:$,headers:z,status:q})).catch(($)=>Z({error:null,body:$,headers:z,status:q}))}catch($){Z({body:null,error:$.message,headers:z,status:q})}}function g(G,K,Q,U,X,Z,Y,_,z){try{let q=new WebSocket(G);return q.onopen=function(){K()},q.onclose=function($){Q($)},q.onerror=function($){console.error($),_("WebSocket error received")},q.onmessage=function($){if(typeof $.data==="string")try{if(z){if(U)U($.data);return}let H=JSON.parse($.data);if(X)X(H)}catch(H){if(z&&U)U($.data);else _(H.message)}else if($.data instanceof Blob){if(Z)Z($.data)}else if($.data instanceof ArrayBuffer){if(Y)Y($.data)}else console.error("Received unknown message type from WebSocket",$),_("Unknown message received from WebSocket")},q}catch(q){_(q.message)}}function m(G){if(G)G.close(),G=null}function y(G,K){if(K&&G&&G.readyState===WebSocket.OPEN)G.send(K)}function i(G,K,Q,U,X,Z){try{let Y=new EventSource(G);return Y.onopen=function(){K()},Y.onerror=function(){X("EventSource error received")},Y.onmessage=function(_){try{if(Z){if(Q)Q(_.data);return}let z=JSON.parse(_.data);if(U)U(z)}catch(z){if(Z&&Q)Q(_.data);else X(z.message)}},Y}catch(Y){X(Y.message)}}function v(G){if(G)G.close(),G=null}function l(G,K){if(!G.classList)G.classList=new Set;for(let Q of K)for(let U of Q.trim().split(" "))if(U)G.classList.add(U)}var t={addEventListener:(G,K,Q,U)=>{G.addEventListener(K,Q,U)},removeEventListener:(G,K,Q,U)=>{G.removeEventListener(K,Q,U)},isEqual:(G,K)=>{return G===K},getTarget:(G)=>{return G.target},parentNode:(G)=>{return G.parentNode}},e={getInlineStyle:(G,K)=>{return G.style[K]},firstChild:(G)=>{return G.firstChild},lastChild:(G)=>{return G.lastChild},getAttribute:(G,K)=>{if(K==="class")return G.className;if(K in G)return G[K];return G.getAttribute(K)},getTag:(G)=>{return G.nodeName},getTextContent:(G)=>{return G.textContent},children:(G)=>{return G.childNodes}},GG={mountComponent:function(G,K,Q){return},unmountComponent:function(G){return},modelHydration:function(G){return}},KG={nextSibling:(G)=>{if(G.nextSibling)switch(G.nextSibling.type){case 0:return E(G.nextSibling);default:return G.nextSibling.domRef}return null},createTextNode:(G)=>{return document.createTextNode(G)},createElementNS:(G,K)=>{return document.createElementNS(G,K)},appendChild:(G,K)=>{return G.appendChild(K)},replaceChild:(G,K,Q)=>{return G.replaceChild(K,Q)},removeChild:(G,K)=>{return G.removeChild(K)},createElement:(G)=>{return document.createElement(G)},addClass:(G,K)=>{if(G)K.classList.add(G)},removeClass:(G,K)=>{if(G)K.classList.remove(G)},insertBefore:(G,K,Q)=>{return G.insertBefore(K,Q)},swapDOMRefs:(G,K,Q)=>{let U=G.nextSibling;Q.insertBefore(G,K),Q.insertBefore(K,U);return},setInlineStyle:(G,K,Q)=>{var U;for(let X in G)if(U=K[X],!U)if(X in Q.style)Q.style[X]="";else Q.style.setProperty(X,"");else if(U!==G[X])if(X in Q.style)Q.style[X]=U;else Q.style.setProperty(X,U);for(let X in K){if(G&&G[X])continue;if(X in Q.style)Q.style[X]=K[X];else Q.style.setProperty(X,K[X])}return},setAttribute:(G,K,Q)=>{return G.setAttribute(K,Q)},setAttributeNS:(G,K,Q,U)=>{return G.setAttributeNS(K,Q,U)},removeAttribute:(G,K)=>{return G.removeAttribute(K)},setTextContent:(G,K)=>{G.textContent=K;return},flush:()=>{return},getRoot:function(){return document.body}};globalThis.miso={hydrationContext:e,eventContext:t,drawingContext:KG,componentContext:GG,diff:W,hydrate:O,version:j,delegate:L,callBlur:b,callFocus:k,callSelect:h,callSetSelectionRange:T,eventJSON:B,fetchCore:u,eventSourceConnect:i,eventSourceClose:v,websocketConnect:g,websocketClose:m,websocketSend:y,undelegate:C,populateClass:l,integrityCheck:f,setDrawingContext:function(G){let K=globalThis[G].drawingContext,Q=globalThis[G].eventContext;if(!K)console.error('Custom rendering engine ("drawingContext") is not defined at globalThis[name].drawingContext',G);if(!Q)console.error('Custom event delegation ("eventContext") is not defined at globalThis[name].eventContext',G);globalThis.miso.drawingContext=K,globalThis.miso.eventContext=Q}};
diff --git a/src/Miso.hs b/src/Miso.hs
index 9100e07e7..5aebe5bf6 100644
--- a/src/Miso.hs
+++ b/src/Miso.hs
@@ -134,7 +134,7 @@ miso :: Eq model => (URI -> App model action) -> JSM ()
 miso f = withJS $ do
   vcomp <- f <$> getURI
   body <- FFI.getBody
-  initialize Hydrate isRoot vcomp (pure body)
+  initialize rootComponentId Hydrate isRoot vcomp (pure body)
 -----------------------------------------------------------------------------
 -- | Synonym for 'startComponent'.
 --
@@ -184,7 +184,7 @@ initComponent
   -> JSM (ComponentState model action)
 initComponent vcomp@Component {..} = do
   root <- mountElement (getMountPoint mountPoint)
-  initialize Draw isRoot vcomp (pure root)
+  initialize rootComponentId Draw isRoot vcomp (pure root)
 ----------------------------------------------------------------------------
 isRoot :: Bool
 isRoot = True
diff --git a/src/Miso/FFI.hs b/src/Miso/FFI.hs
index df8b8a546..b8424fad2 100644
--- a/src/Miso/FFI.hs
+++ b/src/Miso/FFI.hs
@@ -58,9 +58,6 @@ module Miso.FFI
   , toLocaleString
   , getSeconds
   , getMilliseconds
-    -- ** 'Miso.Types.Component'
-  , getParentComponentId
-  , getComponentId
     -- ** DOM Traversal
   , nextSibling
   , previousSibling
diff --git a/src/Miso/FFI/Internal.hs b/src/Miso/FFI/Internal.hs
index eee0d21a7..e24b7238b 100644
--- a/src/Miso/FFI/Internal.hs
+++ b/src/Miso/FFI/Internal.hs
@@ -112,9 +112,6 @@ module Miso.FFI.Internal
    -- * Utils
    , getMilliseconds
    , getSeconds
-   -- * 'Miso.Types.Component'
-   , getParentComponentId
-   , getComponentId
    -- * Element
    , files
    , click
@@ -747,18 +744,6 @@ getSeconds date =
   fromJSValUnchecked =<< do
     date # "getSeconds" $ ([] :: [MisoString])
 -----------------------------------------------------------------------------
--- | Climb the tree, get the parent.
-getParentComponentId :: JSVal -> JSM (Maybe Int)
-getParentComponentId domRef =
-  fromJSVal =<< do
-    jsg "miso" # "getParentComponentId" $ [domRef]
------------------------------------------------------------------------------
--- | Get access to the 'Miso.Effect.ComponentId'
--- N.B. you * must * call this on the DOMRef, otherwise, problems.
--- For use in 'Miso.Event.onMounted', etc.
-getComponentId :: JSVal -> JSM Int
-getComponentId vtree = fromJSValUnchecked =<< vtree ! "componentId"
------------------------------------------------------------------------------
 -- | Fetch next sibling DOM node
 --
 -- @since 1.9.0.0
diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index c2384513f..8b62c64e1 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -120,14 +120,15 @@ import           Miso.Effect ( ComponentInfo(..), Sub, Sink, Effect, Schedule(..
 -- | Helper function to abstract out initialization of t'Miso.Types.Component' between top-level API functions.
 initialize
   :: (Eq parent, Eq model)
-  => Hydrate
+  => ComponentId
+  -> Hydrate
   -> Bool
   -- ^ Is the root node being rendered?
   -> Component parent model action
   -> JSM DOMRef
   -- ^ Callback function is used for obtaining the t'Miso.Types.Component' 'DOMRef'.
   -> JSM (ComponentState model action)
-initialize hydrate isRoot Component {..} getComponentMountPoint = do
+initialize componentParentId hydrate isRoot Component {..} getComponentMountPoint = do
   Waiter {..} <- liftIO waiter
   componentActions <- liftIO (newIORef S.empty)
   let
@@ -152,7 +153,7 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
 #ifdef BENCH
     start <- if isRoot then FFI.now else pure 0
 #endif
-    vtree <- buildVTree hydrate componentSink logLevel events (view initializedModel)
+    vtree <- buildVTree componentId hydrate componentSink logLevel events (view initializedModel)
 #ifdef BENCH
     end <- if isRoot then FFI.now else pure 0
     when isRoot $ FFI.consoleLog $ ms (printf "buildVTree: %.3f ms" (end - start) :: String)
@@ -166,15 +167,11 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
         when isRoot $ do
           hydrated <- Hydrate.hydrate logLevel componentDOMRef vtree
           when (not hydrated) $ do
-            newTree <- buildVTree Draw componentSink logLevel events (view initializedModel)
+            newTree <- buildVTree componentId Draw componentSink logLevel events (view initializedModel)
             liftIO (atomicWriteIORef ref newTree)
             Diff.diff Nothing (Just newTree) componentDOMRef
         pure ref
   componentDOMRef <# ("componentId" :: MisoString) $ componentId
-  componentParentId <- do
-    FFI.getParentComponentId componentDOMRef >>= \case
-      Nothing -> pure rootComponentId
-      Just parentId -> pure parentId
   componentSubThreads <- liftIO (newIORef M.empty)
   forM_ subs $ \sub -> do
     threadId <- FFI.forkJSM (sub componentSink)
@@ -192,7 +189,7 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
       updatedName <- liftIO $ updatedModel `seq` makeStableName updatedModel
       isDirty <- liftIO (readTVarIO componentIsDirty)
       when ((currentName /= updatedName && currentModel /= updatedModel) || isDirty) $ do
-        newVTree <- buildVTree Draw componentSink logLevel events (view updatedModel)
+        newVTree <- buildVTree componentId Draw componentSink logLevel events (view updatedModel)
         oldVTree <- liftIO (readIORef componentVTree)
         void waitForAnimationFrame
         Diff.diff (Just oldVTree) (Just newVTree) componentDOMRef
@@ -240,6 +237,7 @@ initialize hydrate isRoot Component {..} getComponentMountPoint = do
   let vcomp = ComponentState
         { componentNotify = notify
         , componentEvents = events
+        , componentParentId = componentParentId
         , ..
         }
 
@@ -826,19 +824,20 @@ killSubscribers componentId =
 -- process we go between the Haskell heap and the JS heap.
 buildVTree
   :: Eq model
-  => Hydrate
+  => ComponentId
+  -> Hydrate
   -> Sink action
   -> LogLevel
   -> Events
   -> View model action
   -> JSM VTree
-buildVTree hydrate snk logLevel_ events_ = \case
+buildVTree parentId hydrate snk logLevel_ events_ = \case
   VComp attrs (SomeComponent app) -> do
     vcomp <- create
 
     mountCallback <- do
       FFI.syncCallback2 $ \parent_ continuation -> do
-        ComponentState {..} <- initialize Draw False app (pure parent_)
+        ComponentState {..} <- initialize parentId Draw False app (pure parent_)
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
         FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
@@ -857,7 +856,7 @@ buildVTree hydrate snk logLevel_ events_ = \case
       Hydrate -> do
         -- Mock .domRef for use during hydration
         domRef <- toJSVal =<< create
-        ComponentState {..} <- initialize hydrate False app (pure domRef)
+        ComponentState {..} <- initialize parentId hydrate False app (pure domRef)
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
         FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
@@ -882,7 +881,7 @@ buildVTree hydrate snk logLevel_ events_ = \case
       where
         procreate parentVTree = do
           kidsViews <- forM kids $ \kid -> do
-            VTree child <- buildVTree hydrate snk logLevel_ events_ kid
+            VTree child <- buildVTree parentId hydrate snk logLevel_ events_ kid
             FFI.set "parent" parentVTree child
             pure child
           setNextSibling kidsViews
diff --git a/ts/index.ts b/ts/index.ts
index 9fe13cb91..00fe95e36 100644
--- a/ts/index.ts
+++ b/ts/index.ts
@@ -10,7 +10,6 @@ import {
   eventJSON,
   fetchCore,
   undelegate,
-  getParentComponentId,
   integrityCheck,
   eventSourceConnect,
   eventSourceClose,
@@ -50,7 +49,6 @@ globalThis['miso'] = {
     websocketSend,
     undelegate,
     populateClass,
-    getParentComponentId,
     integrityCheck,
     setDrawingContext : function (name) {
       // dmj: this looks for a custom globally defined rendering / event context
diff --git a/ts/miso.ts b/ts/miso.ts
index 2a5dfb5b4..1d7d36ca6 100644
--- a/ts/miso.ts
+++ b/ts/miso.ts
@@ -9,7 +9,6 @@ import {
    callSelect,
    callSetSelectionRange,
    fetchCore,
-   getParentComponentId,
    websocketConnect,
    websocketClose,
    websocketSend,
@@ -52,7 +51,6 @@ export {
   fetchCore,
   undelegate,
   integrityCheck,
-  getParentComponentId,
   websocketConnect,
   websocketClose,
   websocketSend,
diff --git a/ts/miso/util.ts b/ts/miso/util.ts
index 1032ff4b3..16236f579 100644
--- a/ts/miso/util.ts
+++ b/ts/miso/util.ts
@@ -85,31 +85,6 @@ export function fetchCore (
   }
 }
 
-/*
-   'getParentComponentId'
-   dmj: Used to fetch the parent's componentId
-
-   Climbs up the tree, finds the immediate component ancestor (parent) and returns its componentId
-   This should be called on the DOMRef of a VComp, otherwise it will return the current componentId.
-
-*/
-export function getParentComponentId (
-  vcompNode: ParentNode
-): number {
-    var climb = function (node : ParentNode) {
-      let parentComponentId = null;
-      while (node && node.parentNode) {
-          if ('componentId' in node.parentNode) {
-              parentComponentId = node.parentNode['componentId'];
-              break;
-          }
-          node = node.parentNode;
-      }
-      return parentComponentId;
-    }
-    return climb (vcompNode);
-}
-
 export function websocketConnect (
     url: string,
     onOpen,
diff --git a/ts/spec/util.spec.ts b/ts/spec/util.spec.ts
index e40d2b1c3..9a147018c 100644
--- a/ts/spec/util.spec.ts
+++ b/ts/spec/util.spec.ts
@@ -1,4 +1,4 @@
-import { populateClass, callFocus, callBlur, callSelect, callSetSelectionRange, getParentComponentId, fetchCore, websocketConnect, websocketClose, websocketSend, eventSourceConnect, eventSourceClose } from '../miso/util';
+import { populateClass, callFocus, callBlur, callSelect, callSetSelectionRange, fetchCore, websocketConnect, websocketClose, websocketSend, eventSourceConnect, eventSourceClose } from '../miso/util';
 import { vnode } from '../miso/smart';
 import { VNode } from '../miso/types';
 import { test, expect, describe, afterEach, beforeAll, mock } from 'bun:test';
@@ -45,22 +45,6 @@ describe ('Utils tests', () => {
     expect(document.activeElement).toEqual(document.body);
   });
 
-  test('Should get parentComponentId', () => {
-    /* build */
-    const grandparent = document.createElement('div');
-    grandparent['componentId'] = 100;
-    const parent = document.createElement('div');
-    grandparent.appendChild(parent);
-    const child = document.createElement('div');
-    parent.appendChild(child);
-    /* test */
-    let vcomp = child;
-    expect(getParentComponentId(vcomp)).toBe(100);
-    vcomp = parent;
-    expect(getParentComponentId(vcomp)).toBe(100);
-    expect(getParentComponentId(grandparent)).toBe(null);
-  });
-
   test('Should populate class', () => {
       let node : VNode<number> = vnode({});
       expect(node.classList).toBe(null);
diff --git a/tsconfig.json b/tsconfig.json
index 4119574d3..502b7550b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,6 +6,7 @@
     "moduleResolution": "bundler",
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "exclude": ["out-tsc/*"]
   }
 }

From a6754046b8f106d98e1062ae5bbc3e4a1e08b88a Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 23:18:17 -0600
Subject: [PATCH 75/76] Only set componentId on vcomp

---
 src/Miso/Runtime.hs | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index 8b62c64e1..7ef911d1f 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -841,7 +841,6 @@ buildVTree parentId hydrate snk logLevel_ events_ = \case
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
         FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
-        FFI.set "componentId" vcompId (Object parent_)
         void $ call continuation global [vcompId, vtree]
 
     unmountCallback <- toJSVal =<< do
@@ -860,7 +859,7 @@ buildVTree parentId hydrate snk logLevel_ events_ = \case
         vtree <- toJSVal =<< liftIO (readIORef componentVTree)
         FFI.set "parent" vcomp (Object vtree)
         vcompId <- toJSVal componentId
-        FFI.set "componentId" vcompId (Object vtree)
+        FFI.set "componentId" vcompId vcomp
         FFI.set "child" vtree vcomp
       Draw -> do
         FFI.set "child" jsNull vcomp        

From aa6019d77d2c7bf8ac7c64e8e9e8e5a9dd262863 Mon Sep 17 00:00:00 2001
From: dmjio <code@dmj.io>
Date: Mon, 15 Dec 2025 23:20:41 -0600
Subject: [PATCH 76/76] drop `liftJSM`

---
 src/Miso/Runtime.hs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Miso/Runtime.hs b/src/Miso/Runtime.hs
index 7ef911d1f..3db818bdd 100644
--- a/src/Miso/Runtime.hs
+++ b/src/Miso/Runtime.hs
@@ -845,7 +845,7 @@ buildVTree parentId hydrate snk logLevel_ events_ = \case
 
     unmountCallback <- toJSVal =<< do
       FFI.syncCallback1 $ \vcompId -> do
-        componentId <- liftJSM (fromJSValUnchecked vcompId)
+        componentId <- fromJSValUnchecked vcompId
         IM.lookup componentId <$> liftIO (readIORef components) >>= \case
           Nothing -> pure ()
           Just componentState ->