tutuca 0.9.13 → 0.9.15

package/dist/tutuca.js

@@ -924,8 +924,8 @@ class RequestHandler {
 
 // src/anode.js
 class BaseNode {
-  render(_stack, rx) {
-    return rx.renderEmpty();
+  render(_stack, _rx) {
+    return null;
   }
   setDataAttr(key, val) {
     console.warn("setDataAttr not implemented for", this, { key, val });
@@ -941,8 +941,8 @@ class TextNode extends BaseNode {
     super();
     this.val = val;
   }
-  render(_stack, rx) {
-    return rx.renderText(this.val);
+  render(_stack, _rx) {
+    return this.val;
   }
   isWhiteSpace() {
     for (let i = 0;i < this.val.length; i++) {
@@ -1233,8 +1233,8 @@ class RenderEachNode extends RenderViewId {
 }
 
 class RenderTextNode extends ANode {
-  render(stack, rx) {
-    return rx.renderText(this.val.eval(stack));
+  render(stack, _rx) {
+    return this.val.eval(stack);
   }
 }
 
@@ -1272,13 +1272,13 @@ class WrapperNode extends ANode {
 
 class ShowNode extends WrapperNode {
   render(stack, rx) {
-    return this.val.eval(stack) ? this.node.render(stack, rx) : rx.renderEmpty();
+    return this.val.eval(stack) ? this.node.render(stack, rx) : null;
   }
 }
 
 class HideNode extends WrapperNode {
   render(stack, rx) {
-    return this.val.eval(stack) ? rx.renderEmpty() : this.node.render(stack, rx);
+    return this.val.eval(stack) ? null : this.node.render(stack, rx);
   }
 }
 
@@ -2296,184 +2296,520 @@ class PathChanges extends PathBuilder {
   }
 }
 
-// src/app.js
-class App {
-  constructor(rootNode, renderFn, comps, renderer, ParseContext2) {
-    this.rootNode = rootNode;
-    this.comps = comps;
-    this.compStack = new ComponentStack(comps);
-    this.transactor = new Transactor(comps, null);
-    this.ParseContext = ParseContext2;
-    this.renderer = renderer;
-    this.renderFn = renderFn;
-    this.maxEventNodeDepth = Infinity;
-    this._transactNextBatchId = this._evictCacheId = null;
-    this._eventNames = new Set(["dragstart", "dragover", "dragend"]);
-    this.dragInfo = this.curDragOver = null;
-    this.transactor.onTransactionPushed = (_transaction) => {
-      if (this._transactNextBatchId === null) {
-        this._scheduleNextTransactionBatchExecution();
-      }
-    };
-    this._compiled = false;
-  }
-  get state() {
-    return this.transactor.state;
-  }
-  handleEvent(e) {
-    const isDragStart = e.type === "dragstart";
-    const isDragOver = e.type === "dragover";
-    const isDragEnd = e.type === "dragend";
-    const { rootNode: root, maxEventNodeDepth: maxDepth, comps } = this;
-    const stopOnNoEvent = !(isDragOver || isDragStart || isDragEnd);
-    const [path, handlers] = Path.fromEvent(e, root, maxDepth, comps, stopOnNoEvent);
-    if (isDragOver) {
-      const dropTarget = getClosestDropTarget(e.target, this.rootNode, 50);
-      if (dropTarget !== null) {
-        e.preventDefault();
-        this._cleanDragOverAttrs();
-        this.curDragOver = dropTarget;
-        dropTarget.dataset.draggingover = this.dragInfo.type;
-      }
-    } else if (isDragStart) {
-      e.target.dataset.dragging = 1;
-      const rootValue = this.state.val;
-      const value = path.lookup(rootValue);
-      const type = e.target.dataset.dragtype ?? "?";
-      const stack = path.buildStack(this.makeStack(rootValue));
-      this.dragInfo = new DragInfo(path, stack, e, value, type, e.target);
-    } else if (isDragEnd) {
-      delete this.dragInfo.node.dataset.dragging;
-      this.dragInfo = null;
-      this._cleanDragOverAttrs();
-    }
-    if (path !== null && handlers !== null) {
-      for (const handler of handlers) {
-        this.transactor.transactInputNow(path, e, handler, this.dragInfo);
-      }
+// src/vdom.js
+var isHtmlAttribute = (propName) => propName[4] === "-" && (propName[0] === "d" || propName[0] === "a");
+var isObject = (v) => v !== null && typeof v === "object";
+var prototypesDiffer = (a, b) => Object.getPrototypeOf(a) !== Object.getPrototypeOf(b);
+function applyProperties(node, props, previous) {
+  for (const propName in props) {
+    const propValue = props[propName];
+    if (propValue === undefined) {
+      removeProperty(node, propName, previous);
+    } else if (isHtmlAttribute(propName)) {
+      node.setAttribute(propName, propValue);
+    } else if (propName === "dangerouslySetInnerHTML") {
+      node.innerHTML = propValue.__html ?? "";
+    } else if (isObject(propValue)) {
+      patchObject(node, previous, propName, propValue);
+    } else if (propName === "className") {
+      node.setAttribute("class", propValue);
+    } else {
+      node[propName] = propValue;
     }
   }
-  makeStack(rootValue) {
-    return Stack.root(this.comps, rootValue);
+}
+function removeProperty(node, propName, previous) {
+  const previousValue = previous[propName];
+  if (propName === "dangerouslySetInnerHTML") {
+    node.replaceChildren();
+  } else if (propName === "className") {
+    node.removeAttribute("class");
+  } else if (propName === "htmlFor") {
+    node.removeAttribute("for");
+  } else if (typeof previousValue === "string" || isHtmlAttribute(propName)) {
+    node.removeAttribute(propName);
+  } else {
+    node[propName] = null;
   }
-  _cleanDragOverAttrs() {
-    if (this.curDragOver !== null) {
-      delete this.curDragOver.dataset.draggingover;
-      this.curDragOver = null;
-    }
+}
+function patchObject(node, previous, propName, propValue) {
+  const previousValue = previous?.[propName];
+  if (isObject(previousValue) && prototypesDiffer(previousValue, propValue)) {
+    node[propName] = propValue;
+    return;
   }
-  render() {
-    const root = this.state.val;
-    const stack = this.makeStack(root);
-    return this.renderFn(this.renderer.renderRoot(stack, root), this.rootNode);
+  if (!isObject(node[propName])) {
+    node[propName] = {};
   }
-  onChange(callback) {
-    this.transactor.state.onChange(callback);
+  const target = node[propName];
+  for (const k in propValue) {
+    target[k] = propValue[k];
   }
-  compile() {
-    for (const Comp of this.comps.byId.values()) {
-      Comp.compile(this.ParseContext);
-      for (const key in Comp.views) {
-        for (const name of Comp.views[key].ctx.genEventNames()) {
-          this._eventNames.add(name);
-        }
-      }
-    }
-    this._compiled = true;
+}
+
+class VBase {
+}
+var getKey = (child) => child instanceof VNode ? child.key : undefined;
+var isIterable = (obj) => obj != null && typeof obj !== "string" && typeof obj[Symbol.iterator] === "function";
+function childsEqual(a, b) {
+  for (let i = 0;i < a.length; i++) {
+    if (!a[i].isEqualTo(b[i]))
+      return false;
   }
-  start(opts) {
-    if (!this._compiled) {
-      this.compile();
-    }
-    for (const name of this._eventNames) {
-      this.rootNode.addEventListener(name, this);
+  return true;
+}
+function appendChildNodes(parent, childs, opts) {
+  for (const child of childs) {
+    parent.appendChild(child.toDom(opts));
+  }
+}
+function addChild(normalizedChildren, child) {
+  if (child == null)
+    return;
+  if (isIterable(child)) {
+    for (const c of child) {
+      addChild(normalizedChildren, c);
     }
-    this.onChange((info) => {
-      if (info.val !== info.old) {
-        this.render();
-      }
-    });
-    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
-    if (opts?.noCache) {
-      this.renderer.setNullCache();
-      this.comps.setNullComputedCache();
+  } else if (child instanceof VBase) {
+    if (child instanceof VFragment) {
+      normalizedChildren.push(...child.childs);
     } else {
-      this.startCacheEvictionInterval();
-    }
-    this.render();
-  }
-  stop() {
-    this.stopCacheEvictionInterval();
-    for (const name of this._eventNames) {
-      this.rootNode.removeEventListener(name, this);
+      normalizedChildren.push(child);
     }
+  } else {
+    normalizedChildren.push(new VText(child));
   }
-  dispatchLogicAtRoot(name, args, opts) {
-    return this.transactor.pushLogic(new Path([]), name, args, opts);
-  }
-  registerComponents(comps, aliases) {
-    const scope = this.compStack.enter();
-    scope.registerComponents(comps, aliases);
-    return scope;
-  }
-  _transactNextBatch(maxRunTimeMs = 10) {
-    this._transactNextBatchId = null;
-    const startTs = Date.now();
-    const t = this.transactor;
-    while (t.hasPendingTransactions && Date.now() - startTs < maxRunTimeMs) {
-      t.transactNext();
-    }
-    if (t.hasPendingTransactions) {
-      this._scheduleNextTransactionBatchExecution();
-    }
+}
+
+class VText extends VBase {
+  constructor(text) {
+    super();
+    this.text = String(text);
   }
-  _scheduleNextTransactionBatchExecution() {
-    this._transactNextBatchId = setTimeout(() => this._transactNextBatch(), 0);
+  get nodeType() {
+    return 3;
   }
-  startCacheEvictionInterval(intervalMs = 30000) {
-    this._evictCacheId = setInterval(() => this.renderer.cache.evict(), intervalMs);
+  isEqualTo(other) {
+    return other instanceof VText && this.text === other.text;
   }
-  stopCacheEvictionInterval() {
-    clearInterval(this._evictCacheId);
-    this._evictCacheId = null;
+  toDom(opts) {
+    return opts.document.createTextNode(this.text);
   }
 }
-function injectCss(nodeId, style, styleTarget = document.head) {
-  const styleNode = document.createElement("style");
-  const currentNodeWithId = styleTarget.querySelector(`#${nodeId}`);
-  if (currentNodeWithId) {
-    styleTarget.removeChild(currentNodeWithId);
+
+class VComment extends VBase {
+  constructor(text) {
+    super();
+    this.text = text;
   }
-  styleNode.id = nodeId;
-  styleNode.innerHTML = style;
-  styleTarget.appendChild(styleNode);
-}
-function getClosestDropTarget(target, rootNode, count) {
-  let node = target;
-  while (count-- > 0 && node !== rootNode) {
-    if (node.dataset?.droptarget !== undefined) {
-      return node;
-    }
-    node = node.parentNode;
+  get nodeType() {
+    return 8;
   }
-  return null;
-}
-
-class DragInfo {
-  constructor(path, stack, e, val, type, node) {
-    this.path = path;
-    this.stack = stack;
-    this.e = e;
-    this.val = val;
-    this.type = type;
-    this.node = node;
+  isEqualTo(other) {
+    return other instanceof VComment && this.text === other.text;
   }
-  lookupBind(name) {
-    return this.stack.lookupBind(name);
+  toDom(opts) {
+    return opts.document.createComment(this.text);
   }
 }
 
-// deps/immutable.js
+class VFragment extends VBase {
+  constructor(childs) {
+    super();
+    this.childs = [];
+    addChild(this.childs, childs);
+  }
+  get nodeType() {
+    return 11;
+  }
+  isEqualTo(other) {
+    if (!(other instanceof VFragment) || this.childs.length !== other.childs.length) {
+      return false;
+    }
+    return childsEqual(this.childs, other.childs);
+  }
+  toDom(opts) {
+    const fragment = opts.document.createDocumentFragment();
+    appendChildNodes(fragment, this.childs, opts);
+    return fragment;
+  }
+}
+
+class VNode extends VBase {
+  constructor(tag, attrs, childs, key, namespace) {
+    super();
+    this.tag = tag;
+    this.attrs = attrs ?? {};
+    this.childs = childs ?? [];
+    this.key = key != null ? String(key) : undefined;
+    this.namespace = typeof namespace === "string" ? namespace : null;
+  }
+  get nodeType() {
+    return 1;
+  }
+  isEqualTo(other) {
+    if (!(other instanceof VNode) || this.tag !== other.tag || this.key !== other.key || this.namespace !== other.namespace || this.childs.length !== other.childs.length) {
+      return false;
+    }
+    for (const key in this.attrs) {
+      if (this.attrs[key] !== other.attrs[key]) {
+        return false;
+      }
+    }
+    for (const key in other.attrs) {
+      if (!Object.hasOwn(this.attrs, key)) {
+        return false;
+      }
+    }
+    return childsEqual(this.childs, other.childs);
+  }
+  toDom(opts) {
+    const doc = opts.document;
+    const node = this.namespace === null ? doc.createElement(this.tag) : doc.createElementNS(this.namespace, this.tag);
+    applyProperties(node, this.attrs, {});
+    appendChildNodes(node, this.childs, opts);
+    return node;
+  }
+}
+function diffProps(a, b) {
+  let diff = null;
+  for (const aKey in a) {
+    if (!Object.hasOwn(b, aKey)) {
+      diff ??= {};
+      diff[aKey] = undefined;
+      continue;
+    }
+    const aValue = a[aKey];
+    const bValue = b[aKey];
+    if (aValue === bValue)
+      continue;
+    if (isObject(aValue) && isObject(bValue)) {
+      if (prototypesDiffer(bValue, aValue)) {
+        diff ??= {};
+        diff[aKey] = bValue;
+      } else {
+        const objectDiff = diffProps(aValue, bValue);
+        if (objectDiff) {
+          diff ??= {};
+          diff[aKey] = objectDiff;
+        }
+      }
+    } else {
+      diff ??= {};
+      diff[aKey] = bValue;
+    }
+  }
+  for (const bKey in b) {
+    if (!Object.hasOwn(a, bKey)) {
+      diff ??= {};
+      diff[bKey] = b[bKey];
+    }
+  }
+  return diff;
+}
+function morphNode(domNode, source, target, opts) {
+  if (source === target || source.isEqualTo(target))
+    return domNode;
+  const type = source.nodeType;
+  if (type === target.nodeType) {
+    if (type === 3 || type === 8) {
+      domNode.data = target.text;
+      return domNode;
+    }
+    if (type === 1 && source.tag === target.tag && source.namespace === target.namespace && source.key === target.key) {
+      const propsDiff = diffProps(source.attrs, target.attrs);
+      if (propsDiff)
+        applyProperties(domNode, propsDiff, source.attrs);
+      if (!target.attrs.dangerouslySetInnerHTML) {
+        morphChildren(domNode, source.childs, target.childs, opts);
+      }
+      return domNode;
+    }
+    if (type === 11) {
+      morphChildren(domNode, source.childs, target.childs, opts);
+      return domNode;
+    }
+  }
+  const newNode = target.toDom(opts);
+  domNode.parentNode?.replaceChild(newNode, domNode);
+  return newNode;
+}
+function morphChildren(parentDom, oldChilds, newChilds, opts) {
+  if (oldChilds.length === 0) {
+    appendChildNodes(parentDom, newChilds, opts);
+    return;
+  }
+  if (newChilds.length === 0) {
+    parentDom.replaceChildren();
+    return;
+  }
+  const domNodes = Array.from(parentDom.childNodes);
+  const oldKeyMap = Object.create(null);
+  for (let i = 0;i < oldChilds.length; i++) {
+    const key = getKey(oldChilds[i]);
+    if (key != null)
+      oldKeyMap[key] = i;
+  }
+  const used = new Uint8Array(oldChilds.length);
+  let unkeyedCursor = 0;
+  for (let j = 0;j < newChilds.length; j++) {
+    const newChild = newChilds[j];
+    const newKey = getKey(newChild);
+    let oldIdx = -1;
+    if (newKey != null) {
+      if (newKey in oldKeyMap && !used[oldKeyMap[newKey]]) {
+        oldIdx = oldKeyMap[newKey];
+      }
+    } else {
+      while (unkeyedCursor < oldChilds.length) {
+        if (!used[unkeyedCursor] && getKey(oldChilds[unkeyedCursor]) == null) {
+          oldIdx = unkeyedCursor++;
+          break;
+        }
+        unkeyedCursor++;
+      }
+    }
+    if (oldIdx >= 0) {
+      used[oldIdx] = 1;
+      const newDom = morphNode(domNodes[oldIdx], oldChilds[oldIdx], newChild, opts);
+      const ref = parentDom.childNodes[j] ?? null;
+      if (newDom !== ref)
+        parentDom.insertBefore(newDom, ref);
+    } else {
+      const ref = parentDom.childNodes[j] ?? null;
+      parentDom.insertBefore(newChild.toDom(opts), ref);
+    }
+  }
+  for (let i = oldChilds.length - 1;i >= 0; i--) {
+    if (!used[i] && domNodes[i].parentNode === parentDom) {
+      parentDom.removeChild(domNodes[i]);
+    }
+  }
+}
+var renderCache = new WeakMap;
+function render(vnode, container, options) {
+  const cached = renderCache.get(container);
+  const isFragment = vnode instanceof VFragment;
+  if (cached && cached.vnode instanceof VFragment === isFragment) {
+    const oldDom = isFragment ? container : cached.dom;
+    const newDom = morphNode(oldDom, cached.vnode, vnode, options);
+    renderCache.set(container, { vnode, dom: isFragment ? container : newDom });
+    return newDom;
+  }
+  renderCache.delete(container);
+  const domNode = vnode.toDom(options);
+  container.replaceChildren(domNode);
+  renderCache.set(container, { vnode, dom: isFragment ? container : domNode });
+  return domNode;
+}
+function h(tagName, properties, children) {
+  const tag = tagName.toUpperCase();
+  const props = {};
+  let key, namespace;
+  if (properties) {
+    for (const propName in properties) {
+      const propVal = properties[propName];
+      switch (propName) {
+        case "key":
+          key = propVal;
+          break;
+        case "namespace":
+          namespace = propVal;
+          break;
+        case "class":
+          props.className = propVal;
+          break;
+        case "for":
+          props.htmlFor = propVal;
+          break;
+        default:
+          props[propName] = isHtmlAttribute(propName) ? String(propVal) : propVal;
+      }
+    }
+  }
+  const normalizedChildren = [];
+  addChild(normalizedChildren, children);
+  return new VNode(tag, props, normalizedChildren, key, namespace);
+}
+
+// src/app.js
+class App {
+  constructor(rootNode, comps, renderer, ParseContext2) {
+    this.rootNode = rootNode;
+    this.comps = comps;
+    this.compStack = new ComponentStack(comps);
+    this.transactor = new Transactor(comps, null);
+    this.ParseContext = ParseContext2;
+    this.renderer = renderer;
+    this.maxEventNodeDepth = Infinity;
+    this._transactNextBatchId = this._evictCacheId = null;
+    this._eventNames = new Set(["dragstart", "dragover", "dragend"]);
+    this.dragInfo = this.curDragOver = null;
+    this.transactor.onTransactionPushed = (_transaction) => {
+      if (this._transactNextBatchId === null) {
+        this._scheduleNextTransactionBatchExecution();
+      }
+    };
+    this._compiled = false;
+    this._renderOpts = { document: rootNode.ownerDocument };
+  }
+  get state() {
+    return this.transactor.state;
+  }
+  handleEvent(e) {
+    const isDragStart = e.type === "dragstart";
+    const isDragOver = e.type === "dragover";
+    const isDragEnd = e.type === "dragend";
+    const { rootNode: root, maxEventNodeDepth: maxDepth, comps } = this;
+    const stopOnNoEvent = !(isDragOver || isDragStart || isDragEnd);
+    const [path, handlers] = Path.fromEvent(e, root, maxDepth, comps, stopOnNoEvent);
+    if (isDragOver) {
+      const dropTarget = getClosestDropTarget(e.target, this.rootNode, 50);
+      if (dropTarget !== null) {
+        e.preventDefault();
+        this._cleanDragOverAttrs();
+        this.curDragOver = dropTarget;
+        dropTarget.dataset.draggingover = this.dragInfo.type;
+      }
+    } else if (isDragStart) {
+      e.target.dataset.dragging = 1;
+      const rootValue = this.state.val;
+      const value = path.lookup(rootValue);
+      const type = e.target.dataset.dragtype ?? "?";
+      const stack = path.buildStack(this.makeStack(rootValue));
+      this.dragInfo = new DragInfo(path, stack, e, value, type, e.target);
+    } else if (isDragEnd) {
+      delete this.dragInfo.node.dataset.dragging;
+      this.dragInfo = null;
+      this._cleanDragOverAttrs();
+    }
+    if (path !== null && handlers !== null) {
+      for (const handler of handlers) {
+        this.transactor.transactInputNow(path, e, handler, this.dragInfo);
+      }
+    }
+  }
+  makeStack(rootValue) {
+    return Stack.root(this.comps, rootValue);
+  }
+  _cleanDragOverAttrs() {
+    if (this.curDragOver !== null) {
+      delete this.curDragOver.dataset.draggingover;
+      this.curDragOver = null;
+    }
+  }
+  render() {
+    const root = this.state.val;
+    const stack = this.makeStack(root);
+    return render(this.renderer.renderRoot(stack, root), this.rootNode, this._renderOpts);
+  }
+  onChange(callback) {
+    this.transactor.state.onChange(callback);
+  }
+  compile() {
+    for (const Comp of this.comps.byId.values()) {
+      Comp.compile(this.ParseContext);
+      for (const key in Comp.views) {
+        for (const name of Comp.views[key].ctx.genEventNames()) {
+          this._eventNames.add(name);
+        }
+      }
+    }
+    this._compiled = true;
+  }
+  start(opts) {
+    if (!this._compiled) {
+      this.compile();
+    }
+    for (const name of this._eventNames) {
+      this.rootNode.addEventListener(name, this);
+    }
+    this.onChange((info) => {
+      if (info.val !== info.old) {
+        this.render();
+      }
+    });
+    injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
+    if (opts?.noCache) {
+      this.renderer.setNullCache();
+      this.comps.setNullComputedCache();
+    } else {
+      this.startCacheEvictionInterval();
+    }
+    this.render();
+  }
+  stop() {
+    this.stopCacheEvictionInterval();
+    for (const name of this._eventNames) {
+      this.rootNode.removeEventListener(name, this);
+    }
+  }
+  dispatchLogicAtRoot(name, args, opts) {
+    return this.transactor.pushLogic(new Path([]), name, args, opts);
+  }
+  registerComponents(comps, aliases) {
+    const scope = this.compStack.enter();
+    scope.registerComponents(comps, aliases);
+    return scope;
+  }
+  _transactNextBatch(maxRunTimeMs = 10) {
+    this._transactNextBatchId = null;
+    const startTs = Date.now();
+    const t = this.transactor;
+    while (t.hasPendingTransactions && Date.now() - startTs < maxRunTimeMs) {
+      t.transactNext();
+    }
+    if (t.hasPendingTransactions) {
+      this._scheduleNextTransactionBatchExecution();
+    }
+  }
+  _scheduleNextTransactionBatchExecution() {
+    this._transactNextBatchId = setTimeout(() => this._transactNextBatch(), 0);
+  }
+  startCacheEvictionInterval(intervalMs = 30000) {
+    this._evictCacheId = setInterval(() => this.renderer.cache.evict(), intervalMs);
+  }
+  stopCacheEvictionInterval() {
+    clearInterval(this._evictCacheId);
+    this._evictCacheId = null;
+  }
+}
+function injectCss(nodeId, style, styleTarget = document.head) {
+  const styleNode = document.createElement("style");
+  const currentNodeWithId = styleTarget.querySelector(`#${nodeId}`);
+  if (currentNodeWithId) {
+    styleTarget.removeChild(currentNodeWithId);
+  }
+  styleNode.id = nodeId;
+  styleNode.innerHTML = style;
+  styleTarget.appendChild(styleNode);
+}
+function getClosestDropTarget(target, rootNode, count) {
+  let node = target;
+  while (count-- > 0 && node !== rootNode) {
+    if (node.dataset?.droptarget !== undefined) {
+      return node;
+    }
+    node = node.parentNode;
+  }
+  return null;
+}
+
+class DragInfo {
+  constructor(path, stack, e, val, type, node) {
+    this.path = path;
+    this.stack = stack;
+    this.e = e;
+    this.val = val;
+    this.type = type;
+    this.node = node;
+  }
+  lookupBind(name) {
+    return this.stack.lookupBind(name);
+  }
+}
+
+// deps/immutable.js
 function invariant(condition, error) {
   if (!condition)
     throw new Error(error);
@@ -3134,28 +3470,28 @@ function hashCollection(collection) {
   }
   const ordered = isOrdered(collection);
   const keyed = isKeyed(collection);
-  let h = ordered ? 1 : 0;
+  let h2 = ordered ? 1 : 0;
   collection.__iterate(keyed ? ordered ? (v, k) => {
-    h = 31 * h + hashMerge(hash(v), hash(k)) | 0;
+    h2 = 31 * h2 + hashMerge(hash(v), hash(k)) | 0;
   } : (v, k) => {
-    h = h + hashMerge(hash(v), hash(k)) | 0;
+    h2 = h2 + hashMerge(hash(v), hash(k)) | 0;
   } : ordered ? (v) => {
-    h = 31 * h + hash(v) | 0;
+    h2 = 31 * h2 + hash(v) | 0;
   } : (v) => {
-    h = h + hash(v) | 0;
+    h2 = h2 + hash(v) | 0;
   });
-  return murmurHashOfSize(collection.size, h);
+  return murmurHashOfSize(collection.size, h2);
 }
 var hashMerge = (a, b) => a ^ b + 2654435769 + (a << 6) + (a >> 2) | 0;
-function murmurHashOfSize(size, h) {
-  h = Math.imul(h, 3432918353);
-  h = Math.imul(h << 15 | h >>> -15, 461845907);
-  h = Math.imul(h << 13 | h >>> -13, 5);
-  h = (h + 3864292196 | 0) ^ size;
-  h = Math.imul(h ^ h >>> 16, 2246822507);
-  h = Math.imul(h ^ h >>> 13, 3266489909);
-  h = smi(h ^ h >>> 16);
-  return h;
+function murmurHashOfSize(size, h2) {
+  h2 = Math.imul(h2, 3432918353);
+  h2 = Math.imul(h2 << 15 | h2 >>> -15, 461845907);
+  h2 = Math.imul(h2 << 13 | h2 >>> -13, 5);
+  h2 = (h2 + 3864292196 | 0) ^ size;
+  h2 = Math.imul(h2 ^ h2 >>> 16, 2246822507);
+  h2 = Math.imul(h2 ^ h2 >>> 13, 3266489909);
+  h2 = smi(h2 ^ h2 >>> 16);
+  return h2;
 }
 function quoteString(value) {
   try {
@@ -5268,7 +5604,7 @@ var List = (value) => {
   }
   assertNotInfinite(size);
   if (size > 0 && size < SIZE) {
-    return makeList(0, size, SHIFT, null, new VNode(iter.toArray()));
+    return makeList(0, size, SHIFT, null, new VNode2(iter.toArray()));
   }
   return empty.withMutations((list) => {
     list.setSize(size);
@@ -5459,7 +5795,7 @@ class ListImpl extends IndexedCollectionImpl {
 }
 List.isList = isList;
 
-class VNode {
+class VNode2 {
   constructor(array, ownerID) {
     this.array = array;
     this.ownerID = ownerID;
@@ -5470,7 +5806,7 @@ class VNode {
     }
     const originIndex = index >>> level & MASK;
     if (originIndex >= this.array.length) {
-      return new VNode([], ownerID);
+      return new VNode2([], ownerID);
     }
     const removingFirst = originIndex === 0;
     let newChild;
@@ -5696,7 +6032,7 @@ function editableVNode(node, ownerID) {
   if (ownerID && ownerID === node?.ownerID) {
     return node;
   }
-  return new VNode(node?.array.slice() ?? [], ownerID);
+  return new VNode2(node?.array.slice() ?? [], ownerID);
 }
 function listNodeFor(list, rawIndex) {
   if (rawIndex >= getTailOffset(list._capacity)) {
@@ -5734,7 +6070,7 @@ function setListBounds(list, begin, end) {
   let newRoot = list._root;
   let offsetShift = 0;
   while (newOrigin + offsetShift < 0) {
-    newRoot = new VNode(newRoot?.array.length ? [undefined, newRoot] : [], owner);
+    newRoot = new VNode2(newRoot?.array.length ? [undefined, newRoot] : [], owner);
     newLevel += SHIFT;
     offsetShift += 1 << newLevel;
   }
@@ -5747,11 +6083,11 @@ function setListBounds(list, begin, end) {
   const oldTailOffset = getTailOffset(oldCapacity);
   const newTailOffset = getTailOffset(newCapacity);
   while (newTailOffset >= 1 << newLevel + SHIFT) {
-    newRoot = new VNode(newRoot?.array.length ? [newRoot] : [], owner);
+    newRoot = new VNode2(newRoot?.array.length ? [newRoot] : [], owner);
     newLevel += SHIFT;
   }
   const oldTail = list._tail;
-  let newTail = newTailOffset < oldTailOffset ? listNodeFor(list, newCapacity - 1) : newTailOffset > oldTailOffset ? new VNode([], owner) : oldTail;
+  let newTail = newTailOffset < oldTailOffset ? listNodeFor(list, newCapacity - 1) : newTailOffset > oldTailOffset ? new VNode2([], owner) : oldTail;
   if (oldTail && newTailOffset > oldTailOffset && newOrigin < oldCapacity && oldTail.array.length) {
     newRoot = editableVNode(newRoot, owner);
     let node = newRoot;
@@ -6414,915 +6750,581 @@ class RecordImpl {
       setIn,
       toObject,
       update,
-      updateIn,
-      withMutations,
-      removeIn: deleteIn,
-      toJSON: toObject,
-      [IS_RECORD_SYMBOL]: true,
-      [DELETE]: this.prototype.remove,
-      [Symbol.iterator]: this.prototype.entries,
-      [Symbol.toStringTag]: "Immutable.Record"
-    });
-  }
-  toString() {
-    const body = this._keys.map((k) => `${k}: ${quoteString(this.get(k))}`).join(", ");
-    return `${recordName(this)} { ${body} }`;
-  }
-  equals(other) {
-    return this === other || isRecord(other) && recordSeq(this).equals(recordSeq(other));
-  }
-  hashCode() {
-    return recordSeq(this).hashCode();
-  }
-  has(k) {
-    return Object.hasOwn(this._indices, k);
-  }
-  get(k, notSetValue) {
-    if (!this.has(k)) {
-      return notSetValue;
-    }
-    const index = this._indices[k];
-    const value = this._values.get(index);
-    return value === undefined ? this._defaultValues[k] : value;
-  }
-  set(k, v) {
-    if (this.has(k)) {
-      const newValues = this._values.set(this._indices[k], v === this._defaultValues[k] ? undefined : v);
-      if (newValues !== this._values && !this.__ownerID) {
-        return makeRecord(this, newValues);
-      }
-    }
-    return this;
-  }
-  remove(k) {
-    return this.set(k);
-  }
-  clear() {
-    const newValues = this._values.clear().setSize(this._keys.length);
-    return this.__ownerID ? this : makeRecord(this, newValues);
-  }
-  wasAltered() {
-    return this._values.wasAltered();
-  }
-  toSeq() {
-    return recordSeq(this);
-  }
-  toJS() {
-    return toJS(this);
-  }
-  entries() {
-    return this.__iterator();
-  }
-  __iterate(fn, reverse) {
-    return recordSeq(this).__iterate(fn, reverse);
-  }
-  __iterator(reverse) {
-    return recordSeq(this).__iterator(reverse);
-  }
-  __ensureOwner(ownerID) {
-    if (ownerID === this.__ownerID) {
-      return this;
-    }
-    const newValues = this._values.__ensureOwner(ownerID);
-    if (!ownerID) {
-      this.__ownerID = ownerID;
-      this._values = newValues;
-      return this;
-    }
-    return makeRecord(this, newValues, ownerID);
-  }
-}
-Record.isRecord = isRecord;
-var recordName = (record) => record.constructor.displayName || record.constructor.name || "Record";
-
-class RecordSeq extends KeyedSeqImpl {
-  constructor(record) {
-    super();
-    this._record = record;
-    this.size = record._keys.length;
-  }
-  get(key, notSetValue) {
-    return this._record.get(key, notSetValue);
-  }
-  has(key) {
-    return this._record.has(key);
-  }
-  __iterateUncached(fn, reverse) {
-    const record = this._record;
-    const keys = record._keys;
-    const size = keys.length;
-    let i = 0;
-    while (i !== size) {
-      const ii = reverse ? size - ++i : i++;
-      const k = keys[ii];
-      if (fn(record.get(k), k, this) === false) {
-        break;
-      }
-    }
-    return i;
-  }
-  __iteratorUncached(reverse) {
-    const record = this._record;
-    const keys = record._keys;
-    const size = keys.length;
-    let i = 0;
-    return makeEntryIterator((entry) => {
-      if (i === size) {
-        return false;
-      }
-      const ii = reverse ? size - ++i : i++;
-      const k = keys[ii];
-      entry[0] = k;
-      entry[1] = record.get(k);
-      return true;
-    });
-  }
-}
-var recordSeq = (record) => new RecordSeq(record);
-Record.getDescriptiveName = recordName;
-var RecordPrototype = RecordImpl.prototype;
-function makeRecord(likeRecord, values, ownerID) {
-  const record = Object.create(Object.getPrototypeOf(likeRecord));
-  record._values = values;
-  record.__ownerID = ownerID;
-  return record;
-}
-function setProp(prototype, name) {
-  Object.defineProperty(prototype, name, {
-    get() {
-      return this.get(name);
-    },
-    set(value) {
-      invariant(this.__ownerID, "Cannot set on an immutable record.");
-      this.set(name, value);
-    }
-  });
-}
-var Range = (start, end, step = 1) => {
-  invariant(step !== 0, "Cannot step a Range by 0");
-  invariant(start !== undefined, "You must define a start value when using Range");
-  invariant(end !== undefined, "You must define an end value when using Range");
-  step = Math.abs(step);
-  if (end < start) {
-    step = -step;
-  }
-  const size = Math.max(0, Math.ceil((end - start) / step - 1) + 1);
-  return new RangeImpl(start, end, step, size);
-};
-
-class RangeImpl extends IndexedSeqImpl {
-  _start;
-  _end;
-  _step;
-  constructor(start, end, step, size) {
-    super();
-    this._start = start;
-    this._end = end;
-    this._step = step;
-    this.size = size;
-  }
-  toString() {
-    return this.size === 0 ? "Range []" : `Range [ ${this._start}...${this._end}${this._step !== 1 ? ` by ${this._step}` : ""} ]`;
-  }
-  get(index, notSetValue) {
-    return this.has(index) ? this._start + wrapIndex(this, index) * this._step : notSetValue;
-  }
-  includes(searchValue) {
-    const possibleIndex = (searchValue - this._start) / this._step;
-    return possibleIndex >= 0 && possibleIndex < this.size && possibleIndex === Math.floor(possibleIndex);
-  }
-  slice(begin, end) {
-    if (wholeSlice(begin, end, this.size)) {
-      return this;
-    }
-    begin = resolveBegin(begin, this.size);
-    end = resolveEnd(end, this.size);
-    if (end <= begin) {
-      return Range(0, 0);
-    }
-    return Range(this.get(begin, this._end), this.get(end, this._end), this._step);
-  }
-  indexOf(searchValue) {
-    const offsetValue = searchValue - this._start;
-    if (offsetValue % this._step === 0) {
-      const index = offsetValue / this._step;
-      if (index >= 0 && index < this.size) {
-        return index;
-      }
-    }
-    return -1;
-  }
-  lastIndexOf(searchValue) {
-    return this.indexOf(searchValue);
-  }
-  __iterateUncached(fn, reverse = false) {
-    const size = this.size;
-    const step = this._step;
-    let value = reverse ? this._start + (size - 1) * step : this._start;
-    let i = 0;
-    while (i !== size) {
-      const v = value;
-      value += reverse ? -step : step;
-      const ii = reverse ? size - ++i : i++;
-      if (fn(v, ii, this) === false) {
-        break;
-      }
-    }
-    return i;
-  }
-  __iteratorUncached(reverse = false) {
-    const size = this.size;
-    const step = this._step;
-    let value = reverse ? this._start + (size - 1) * step : this._start;
-    let i = 0;
-    return makeEntryIterator((entry) => {
-      if (i === size) {
-        return false;
-      }
-      const v = value;
-      value += reverse ? -step : step;
-      entry[0] = reverse ? size - ++i : i++;
-      entry[1] = v;
-      return true;
-    });
-  }
-  values() {
-    const size = this.size;
-    const step = this._step;
-    let value = this._start;
-    let i = 0;
-    const result = {
-      done: false,
-      value: undefined
-    };
-    return makeIterator(() => {
-      if (i === size)
-        return DONE;
-      result.value = value;
-      value += step;
-      i++;
-      return result;
+      updateIn,
+      withMutations,
+      removeIn: deleteIn,
+      toJSON: toObject,
+      [IS_RECORD_SYMBOL]: true,
+      [DELETE]: this.prototype.remove,
+      [Symbol.iterator]: this.prototype.entries,
+      [Symbol.toStringTag]: "Immutable.Record"
     });
   }
-  keys() {
-    return makeIndexKeys(this.size);
+  toString() {
+    const body = this._keys.map((k) => `${k}: ${quoteString(this.get(k))}`).join(", ");
+    return `${recordName(this)} { ${body} }`;
   }
   equals(other) {
-    return other instanceof RangeImpl ? this._start === other._start && this._end === other._end && this._step === other._step : deepEqual(this, other);
+    return this === other || isRecord(other) && recordSeq(this).equals(recordSeq(other));
   }
-  static {
-    this.prototype[Symbol.iterator] = this.prototype.values;
+  hashCode() {
+    return recordSeq(this).hashCode();
   }
-}
-var Repeat = (value, times) => {
-  const size = times === undefined ? Infinity : Math.max(0, times);
-  return new RepeatImpl(value, size);
-};
-
-class RepeatImpl extends IndexedSeqImpl {
-  constructor(value, size) {
-    super();
-    this._value = value;
-    this.size = size;
+  has(k) {
+    return Object.hasOwn(this._indices, k);
   }
-  toString() {
-    if (this.size === 0) {
-      return "Repeat []";
+  get(k, notSetValue) {
+    if (!this.has(k)) {
+      return notSetValue;
     }
-    return `Repeat [ ${this._value} ${this.size} times ]`;
-  }
-  get(index, notSetValue) {
-    return this.has(index) ? this._value : notSetValue;
-  }
-  includes(searchValue) {
-    return is(this._value, searchValue);
-  }
-  slice(begin, end) {
-    const size = this.size;
-    return wholeSlice(begin, end, size) ? this : new RepeatImpl(this._value, resolveEnd(end, size) - resolveBegin(begin, size));
+    const index = this._indices[k];
+    const value = this._values.get(index);
+    return value === undefined ? this._defaultValues[k] : value;
   }
-  reverse() {
+  set(k, v) {
+    if (this.has(k)) {
+      const newValues = this._values.set(this._indices[k], v === this._defaultValues[k] ? undefined : v);
+      if (newValues !== this._values && !this.__ownerID) {
+        return makeRecord(this, newValues);
+      }
+    }
     return this;
   }
-  indexOf(searchValue) {
-    if (is(this._value, searchValue)) {
-      return 0;
-    }
-    return -1;
+  remove(k) {
+    return this.set(k);
   }
-  lastIndexOf(searchValue) {
-    if (is(this._value, searchValue)) {
-      return this.size;
-    }
-    return -1;
+  clear() {
+    const newValues = this._values.clear().setSize(this._keys.length);
+    return this.__ownerID ? this : makeRecord(this, newValues);
   }
-  __iterateUncached(fn, reverse) {
-    const size = this.size;
-    let i = 0;
-    while (i !== size) {
-      if (fn(this._value, reverse ? size - ++i : i++, this) === false) {
-        break;
-      }
-    }
-    return i;
+  wasAltered() {
+    return this._values.wasAltered();
   }
-  __iteratorUncached(reverse) {
-    const size = this.size;
-    const val = this._value;
-    let i = 0;
-    return makeEntryIterator((entry) => {
-      if (i === size) {
-        return false;
-      }
-      entry[0] = reverse ? size - ++i : i++;
-      entry[1] = val;
-      return true;
-    });
+  toSeq() {
+    return recordSeq(this);
   }
-  values() {
-    const size = this.size;
-    const val = this._value;
-    let i = 0;
-    const result = {
-      done: false,
-      value: undefined
-    };
-    return makeIterator(() => {
-      if (i === size)
-        return DONE;
-      i++;
-      result.value = val;
-      return result;
-    });
+  toJS() {
+    return toJS(this);
   }
-  keys() {
-    return makeIndexKeys(this.size);
+  entries() {
+    return this.__iterator();
   }
-  equals(other) {
-    return other instanceof RepeatImpl ? this.size === other.size && is(this._value, other._value) : deepEqual(this, other);
+  __iterate(fn, reverse) {
+    return recordSeq(this).__iterate(fn, reverse);
   }
-  static {
-    this.prototype[Symbol.iterator] = this.prototype.values;
+  __iterator(reverse) {
+    return recordSeq(this).__iterator(reverse);
   }
-}
-var fromJS = (value, converter) => fromJSWith([], converter ?? defaultConverter, value, "", converter?.length > 2 ? [] : undefined, {
-  "": value
-});
-function fromJSWith(stack, converter, value, key, keyPath, parentValue) {
-  if (typeof value !== "string" && !isImmutable(value) && (isArrayLike(value) || hasIterator(value) || isPlainObject(value))) {
-    if (stack.includes(value)) {
-      throw new TypeError("Cannot convert circular structure to Immutable");
-    }
-    stack.push(value);
-    if (keyPath && key !== "") {
-      keyPath.push(key);
+  __ensureOwner(ownerID) {
+    if (ownerID === this.__ownerID) {
+      return this;
     }
-    const converted = converter.call(parentValue, key, Seq(value).map((v, k) => fromJSWith(stack, converter, v, k, keyPath, value)), keyPath?.slice());
-    stack.pop();
-    if (keyPath) {
-      keyPath.pop();
+    const newValues = this._values.__ensureOwner(ownerID);
+    if (!ownerID) {
+      this.__ownerID = ownerID;
+      this._values = newValues;
+      return this;
     }
-    return converted;
+    return makeRecord(this, newValues, ownerID);
   }
-  return value;
-}
-var defaultConverter = (k, v) => isIndexed(v) ? v.toList() : isKeyed(v) ? v.toMap() : v.toSet();
-var asValues = (collection) => isKeyed(collection) ? collection.valueSeq() : collection;
-function initCollectionConversions() {
-  CollectionImpl.prototype.toMap = function toMap() {
-    return Map2(this.toKeyedSeq());
-  };
-  CollectionImpl.prototype.toOrderedMap = function toOrderedMap() {
-    return OrderedMap(this.toKeyedSeq());
-  };
-  CollectionImpl.prototype.toOrderedSet = function toOrderedSet() {
-    return OrderedSet(asValues(this));
-  };
-  CollectionImpl.prototype.toSet = function toSet() {
-    return Set2(asValues(this));
-  };
-  CollectionImpl.prototype.toStack = function toStack() {
-    return Stack2(asValues(this));
-  };
-  CollectionImpl.prototype.toList = function toList() {
-    return List(asValues(this));
-  };
-  CollectionImpl.prototype.countBy = function countBy(grouper, context) {
-    const groups = Map2().asMutable();
-    this.__iterate((v, k) => {
-      groups.update(grouper.call(context, v, k, this), 0, (a) => a + 1);
-    });
-    return groups.asImmutable();
-  };
-  CollectionImpl.prototype.groupBy = function groupBy(grouper, context) {
-    const isKeyedIter = isKeyed(this);
-    const groups = (isOrdered(this) ? OrderedMap() : Map2()).asMutable();
-    this.__iterate((v, k) => {
-      groups.update(grouper.call(context, v, k, this), (a) => {
-        a ??= [];
-        a.push(isKeyedIter ? [k, v] : v);
-        return a;
-      });
-    });
-    return groups.map((arr) => reifyValues(this, arr)).asImmutable();
-  };
-  IndexedCollectionImpl.prototype.keySeq = function keySeq() {
-    return Range(0, this.size);
-  };
-  MapImpl.prototype.sort = function sort(comparator) {
-    return OrderedMap(sortFactory(this, comparator));
-  };
-  MapImpl.prototype.sortBy = function sortBy(mapper, comparator) {
-    return OrderedMap(sortFactory(this, comparator, mapper));
-  };
-  SetImpl.prototype.sort = function sort(comparator) {
-    return OrderedSet(sortFactory(this, comparator));
-  };
-  SetImpl.prototype.sortBy = function sortBy(mapper, comparator) {
-    return OrderedSet(sortFactory(this, comparator, mapper));
-  };
 }
-var version$1 = "7.0.0";
-var pkg = {
-  version: version$1
-};
-initCollectionConversions();
-var { version } = pkg;
-
-// src/renderer.js
-var DATASET_ATTRS = ["nid", "cid", "eid", "vid", "si", "sk"];
+Record.isRecord = isRecord;
+var recordName = (record) => record.constructor.displayName || record.constructor.name || "Record";
 
-class Renderer {
-  constructor(comps, h, fragment, comment, renderFn, getSeqInfo, cache) {
-    this.comps = comps;
-    this.h = h;
-    this.fragment = fragment;
-    this.renderComment = comment;
-    this.renderFn = renderFn;
-    this.getSeqInfo = getSeqInfo ?? basicGetSeqInfo;
-    this.cache = cache ?? new WeakMapDomCache;
-  }
-  setNullCache() {
-    this.cache = new NullDomCache;
-  }
-  renderToDOM(stack, val) {
-    const rootNode = document.createElement("div");
-    this.renderFn(this.h("div", null, [this.renderRoot(stack, val)]), rootNode);
-    return rootNode.childNodes[0];
-  }
-  renderToString(stack, val, cleanAttrs = true) {
-    const dom = this.renderToDOM(stack, val, this.renderFn);
-    if (cleanAttrs) {
-      const nodes = dom.querySelectorAll("[data-nid],[data-cid],[data-eid]");
-      for (const { dataset } of nodes) {
-        for (const name of DATASET_ATTRS) {
-          delete dataset[name];
-        }
-      }
-    }
-    return dom.innerHTML;
-  }
-  renderRoot(stack, val, viewName = null) {
-    const comp = this.comps.getCompFor(val);
-    const nid = comp.getView(viewName).anode.nodeId ?? null;
-    return comp ? this._rValComp(stack, val, comp, nid, "ROOT", viewName) : null;
-  }
-  renderIt(stack, nodeId, key, viewName) {
-    const comp = this.comps.getCompFor(stack.it);
-    return comp ? this._rValComp(stack, stack.it, comp, nodeId, key, viewName) : null;
+class RecordSeq extends KeyedSeqImpl {
+  constructor(record) {
+    super();
+    this._record = record;
+    this.size = record._keys.length;
   }
-  _rValComp(stack, val, comp, nid, key, viewName) {
-    const cacheKey = `${viewName ?? stack.viewsId ?? ""}${nid}-${key}`;
-    const cachedNode = this.cache.get(val, cacheKey);
-    if (cachedNode) {
-      return cachedNode;
-    }
-    const view = viewName ? comp.getView(viewName) : stack.lookupBestView(comp.views, "main");
-    const meta = this.renderMetadata("Comp", { nid });
-    const dom = this.renderFragment([meta, this.renderView(view, stack)]);
-    this.cache.set(val, cacheKey, dom);
-    return dom;
+  get(key, notSetValue) {
+    return this._record.get(key, notSetValue);
   }
-  pushEachEntry(r, nid, attrName, key, dom) {
-    r.push(this.renderMetadata("Each", { nid, [attrName]: key }), dom);
+  has(key) {
+    return this._record.has(key);
   }
-  renderEach(stack, iterInfo, nodeId, viewName) {
-    const { seq, filter, loopWith } = iterInfo.eval(stack);
-    const [attrName, gen] = this.getSeqInfo(seq);
-    const r = [];
-    const iterData = loopWith.call(stack.it, seq);
-    for (const [key, value] of gen(seq)) {
-      if (filter.call(stack.it, key, value, iterData)) {
-        const newStack = stack.enter(value, { key }, true);
-        const dom = this.renderIt(newStack, nodeId, key, viewName);
-        this.pushEachEntry(r, nodeId, attrName, key, dom);
+  __iterateUncached(fn, reverse) {
+    const record = this._record;
+    const keys = record._keys;
+    const size = keys.length;
+    let i = 0;
+    while (i !== size) {
+      const ii = reverse ? size - ++i : i++;
+      const k = keys[ii];
+      if (fn(record.get(k), k, this) === false) {
+        break;
       }
     }
-    return r;
+    return i;
   }
-  renderEachWhen(stack, iterInfo, view, nid) {
-    const { seq, filter, loopWith, enricher } = iterInfo.eval(stack);
-    const [attrName, gen] = this.getSeqInfo(seq);
-    const r = [];
-    const iterData = loopWith.call(stack.it, seq);
-    for (const [key, value] of gen(seq)) {
-      if (filter.call(stack.it, key, value, iterData)) {
-        const bindings = { key, value };
-        const cacheKey = `${nid}-${key}`;
-        let cachedNode;
-        if (enricher) {
-          enricher.call(stack.it, bindings, key, value, iterData);
-          cachedNode = this.cache.get2(stack.it, value, cacheKey);
-        } else {
-          cachedNode = this.cache.get(value, cacheKey);
-        }
-        if (cachedNode) {
-          this.pushEachEntry(r, nid, attrName, key, cachedNode);
-          continue;
-        }
-        const newStack = stack.enter(value, bindings, false);
-        const dom = this.renderView(view, newStack);
-        this.pushEachEntry(r, nid, attrName, key, dom);
-        if (enricher) {
-          this.cache.set2(stack.it, value, cacheKey, dom);
-        } else {
-          this.cache.set(value, cacheKey, dom);
-        }
+  __iteratorUncached(reverse) {
+    const record = this._record;
+    const keys = record._keys;
+    const size = keys.length;
+    let i = 0;
+    return makeEntryIterator((entry) => {
+      if (i === size) {
+        return false;
       }
+      const ii = reverse ? size - ++i : i++;
+      const k = keys[ii];
+      entry[0] = k;
+      entry[1] = record.get(k);
+      return true;
+    });
+  }
+}
+var recordSeq = (record) => new RecordSeq(record);
+Record.getDescriptiveName = recordName;
+var RecordPrototype = RecordImpl.prototype;
+function makeRecord(likeRecord, values, ownerID) {
+  const record = Object.create(Object.getPrototypeOf(likeRecord));
+  record._values = values;
+  record.__ownerID = ownerID;
+  return record;
+}
+function setProp(prototype, name) {
+  Object.defineProperty(prototype, name, {
+    get() {
+      return this.get(name);
+    },
+    set(value) {
+      invariant(this.__ownerID, "Cannot set on an immutable record.");
+      this.set(name, value);
     }
-    return r;
+  });
+}
+var Range = (start, end, step = 1) => {
+  invariant(step !== 0, "Cannot step a Range by 0");
+  invariant(start !== undefined, "You must define a start value when using Range");
+  invariant(end !== undefined, "You must define an end value when using Range");
+  step = Math.abs(step);
+  if (end < start) {
+    step = -step;
   }
-  renderView(view, stack) {
-    return view.render(stack, this);
+  const size = Math.max(0, Math.ceil((end - start) / step - 1) + 1);
+  return new RangeImpl(start, end, step, size);
+};
+
+class RangeImpl extends IndexedSeqImpl {
+  _start;
+  _end;
+  _step;
+  constructor(start, end, step, size) {
+    super();
+    this._start = start;
+    this._end = end;
+    this._step = step;
+    this.size = size;
+  }
+  toString() {
+    return this.size === 0 ? "Range []" : `Range [ ${this._start}...${this._end}${this._step !== 1 ? ` by ${this._step}` : ""} ]`;
   }
-  renderText(text) {
-    return text;
+  get(index, notSetValue) {
+    return this.has(index) ? this._start + wrapIndex(this, index) * this._step : notSetValue;
   }
-  renderMetadata(type, info) {
-    info.$ = type;
-    return this.renderComment(`§${JSON.stringify(info)}§`);
+  includes(searchValue) {
+    const possibleIndex = (searchValue - this._start) / this._step;
+    return possibleIndex >= 0 && possibleIndex < this.size && possibleIndex === Math.floor(possibleIndex);
   }
-  renderEmpty() {
-    return null;
+  slice(begin, end) {
+    if (wholeSlice(begin, end, this.size)) {
+      return this;
+    }
+    begin = resolveBegin(begin, this.size);
+    end = resolveEnd(end, this.size);
+    if (end <= begin) {
+      return Range(0, 0);
+    }
+    return Range(this.get(begin, this._end), this.get(end, this._end), this._step);
   }
-  renderTag(tagName, attrs, childs) {
-    return this.h(tagName, attrs, childs);
+  indexOf(searchValue) {
+    const offsetValue = searchValue - this._start;
+    if (offsetValue % this._step === 0) {
+      const index = offsetValue / this._step;
+      if (index >= 0 && index < this.size) {
+        return index;
+      }
+    }
+    return -1;
   }
-  renderFragment(childs) {
-    return this.fragment(childs);
+  lastIndexOf(searchValue) {
+    return this.indexOf(searchValue);
   }
-}
-function* imIndexedEntries(seq) {
-  let i = 0;
-  for (const v of seq)
-    yield [i++, v];
-}
-function* imKeyedEntries(obj) {
-  for (const [key, value] of obj.toSeq().entries())
-    yield [key, value];
-}
-var seqInfoByClass = new Map;
-var idxInfo = ["si", imIndexedEntries];
-var keyInfo = ["sk", imKeyedEntries];
-var unkInfo = ["si", function* nullEntries(_obj) {}];
-function basicGetSeqInfo(seq) {
-  return isIndexed(seq) ? idxInfo : isKeyed(seq) ? keyInfo : seqInfoByClass.get(seq?.constructor) ?? unkInfo;
-}
-
-// src/vdom.js
-var isHtmlAttribute = (propName) => propName[4] === "-" && (propName[0] === "d" || propName[0] === "a");
-var isObject = (v) => v !== null && typeof v === "object";
-var prototypesDiffer = (a, b) => Object.getPrototypeOf(a) !== Object.getPrototypeOf(b);
-function applyProperties(node, props, previous) {
-  for (const propName in props) {
-    const propValue = props[propName];
-    if (propValue === undefined) {
-      removeProperty(node, propName, previous);
-    } else if (isHtmlAttribute(propName)) {
-      node.setAttribute(propName, propValue);
-    } else if (propName === "dangerouslySetInnerHTML") {
-      node.innerHTML = propValue.__html ?? "";
-    } else if (isObject(propValue)) {
-      patchObject(node, previous, propName, propValue);
-    } else if (propName === "className") {
-      node.setAttribute("class", propValue);
-    } else {
-      node[propName] = propValue;
+  __iterateUncached(fn, reverse = false) {
+    const size = this.size;
+    const step = this._step;
+    let value = reverse ? this._start + (size - 1) * step : this._start;
+    let i = 0;
+    while (i !== size) {
+      const v = value;
+      value += reverse ? -step : step;
+      const ii = reverse ? size - ++i : i++;
+      if (fn(v, ii, this) === false) {
+        break;
+      }
     }
+    return i;
   }
-}
-function removeProperty(node, propName, previous) {
-  const previousValue = previous[propName];
-  if (propName === "dangerouslySetInnerHTML") {
-    node.replaceChildren();
-  } else if (propName === "className") {
-    node.removeAttribute("class");
-  } else if (propName === "htmlFor") {
-    node.removeAttribute("for");
-  } else if (typeof previousValue === "string" || isHtmlAttribute(propName)) {
-    node.removeAttribute(propName);
-  } else {
-    node[propName] = null;
+  __iteratorUncached(reverse = false) {
+    const size = this.size;
+    const step = this._step;
+    let value = reverse ? this._start + (size - 1) * step : this._start;
+    let i = 0;
+    return makeEntryIterator((entry) => {
+      if (i === size) {
+        return false;
+      }
+      const v = value;
+      value += reverse ? -step : step;
+      entry[0] = reverse ? size - ++i : i++;
+      entry[1] = v;
+      return true;
+    });
   }
-}
-function patchObject(node, previous, propName, propValue) {
-  const previousValue = previous?.[propName];
-  if (isObject(previousValue) && prototypesDiffer(previousValue, propValue)) {
-    node[propName] = propValue;
-    return;
+  values() {
+    const size = this.size;
+    const step = this._step;
+    let value = this._start;
+    let i = 0;
+    const result = {
+      done: false,
+      value: undefined
+    };
+    return makeIterator(() => {
+      if (i === size)
+        return DONE;
+      result.value = value;
+      value += step;
+      i++;
+      return result;
+    });
   }
-  if (!isObject(node[propName])) {
-    node[propName] = {};
+  keys() {
+    return makeIndexKeys(this.size);
   }
-  const target = node[propName];
-  for (const k in propValue) {
-    target[k] = propValue[k];
+  equals(other) {
+    return other instanceof RangeImpl ? this._start === other._start && this._end === other._end && this._step === other._step : deepEqual(this, other);
   }
-}
-
-class VBase {
-}
-var getKey = (child) => child instanceof VNode2 ? child.key : undefined;
-var isIterable = (obj) => obj != null && typeof obj !== "string" && typeof obj[Symbol.iterator] === "function";
-function childsEqual(a, b) {
-  for (let i = 0;i < a.length; i++) {
-    if (!a[i].isEqualTo(b[i]))
-      return false;
+  static {
+    this.prototype[Symbol.iterator] = this.prototype.values;
   }
-  return true;
 }
-function appendChildNodes(parent, childs, opts) {
-  for (const child of childs) {
-    parent.appendChild(child.toDom(opts));
+var Repeat = (value, times) => {
+  const size = times === undefined ? Infinity : Math.max(0, times);
+  return new RepeatImpl(value, size);
+};
+
+class RepeatImpl extends IndexedSeqImpl {
+  constructor(value, size) {
+    super();
+    this._value = value;
+    this.size = size;
   }
-}
-function addChild(normalizedChildren, child) {
-  if (child == null)
-    return;
-  if (isIterable(child)) {
-    for (const c of child) {
-      addChild(normalizedChildren, c);
-    }
-  } else if (child instanceof VBase) {
-    if (child instanceof VFragment) {
-      normalizedChildren.push(...child.childs);
-    } else {
-      normalizedChildren.push(child);
+  toString() {
+    if (this.size === 0) {
+      return "Repeat []";
     }
-  } else {
-    normalizedChildren.push(new VText(child));
+    return `Repeat [ ${this._value} ${this.size} times ]`;
   }
-}
-
-class VText extends VBase {
-  constructor(text) {
-    super();
-    this.text = String(text);
+  get(index, notSetValue) {
+    return this.has(index) ? this._value : notSetValue;
   }
-  get nodeType() {
-    return 3;
+  includes(searchValue) {
+    return is(this._value, searchValue);
   }
-  isEqualTo(other) {
-    return other instanceof VText && this.text === other.text;
+  slice(begin, end) {
+    const size = this.size;
+    return wholeSlice(begin, end, size) ? this : new RepeatImpl(this._value, resolveEnd(end, size) - resolveBegin(begin, size));
   }
-  toDom(opts) {
-    return opts.document.createTextNode(this.text);
+  reverse() {
+    return this;
   }
-}
-
-class VComment extends VBase {
-  constructor(text) {
-    super();
-    this.text = text;
+  indexOf(searchValue) {
+    if (is(this._value, searchValue)) {
+      return 0;
+    }
+    return -1;
   }
-  get nodeType() {
-    return 8;
+  lastIndexOf(searchValue) {
+    if (is(this._value, searchValue)) {
+      return this.size;
+    }
+    return -1;
   }
-  isEqualTo(other) {
-    return other instanceof VComment && this.text === other.text;
+  __iterateUncached(fn, reverse) {
+    const size = this.size;
+    let i = 0;
+    while (i !== size) {
+      if (fn(this._value, reverse ? size - ++i : i++, this) === false) {
+        break;
+      }
+    }
+    return i;
   }
-  toDom(opts) {
-    return opts.document.createComment(this.text);
+  __iteratorUncached(reverse) {
+    const size = this.size;
+    const val = this._value;
+    let i = 0;
+    return makeEntryIterator((entry) => {
+      if (i === size) {
+        return false;
+      }
+      entry[0] = reverse ? size - ++i : i++;
+      entry[1] = val;
+      return true;
+    });
   }
-}
-
-class VFragment extends VBase {
-  constructor(childs) {
-    super();
-    this.childs = [];
-    addChild(this.childs, childs);
+  values() {
+    const size = this.size;
+    const val = this._value;
+    let i = 0;
+    const result = {
+      done: false,
+      value: undefined
+    };
+    return makeIterator(() => {
+      if (i === size)
+        return DONE;
+      i++;
+      result.value = val;
+      return result;
+    });
   }
-  get nodeType() {
-    return 11;
+  keys() {
+    return makeIndexKeys(this.size);
   }
-  isEqualTo(other) {
-    if (!(other instanceof VFragment) || this.childs.length !== other.childs.length) {
-      return false;
-    }
-    return childsEqual(this.childs, other.childs);
+  equals(other) {
+    return other instanceof RepeatImpl ? this.size === other.size && is(this._value, other._value) : deepEqual(this, other);
   }
-  toDom(opts) {
-    const fragment = opts.document.createDocumentFragment();
-    appendChildNodes(fragment, this.childs, opts);
-    return fragment;
+  static {
+    this.prototype[Symbol.iterator] = this.prototype.values;
+  }
+}
+var fromJS = (value, converter) => fromJSWith([], converter ?? defaultConverter, value, "", converter?.length > 2 ? [] : undefined, {
+  "": value
+});
+function fromJSWith(stack, converter, value, key, keyPath, parentValue) {
+  if (typeof value !== "string" && !isImmutable(value) && (isArrayLike(value) || hasIterator(value) || isPlainObject(value))) {
+    if (stack.includes(value)) {
+      throw new TypeError("Cannot convert circular structure to Immutable");
+    }
+    stack.push(value);
+    if (keyPath && key !== "") {
+      keyPath.push(key);
+    }
+    const converted = converter.call(parentValue, key, Seq(value).map((v, k) => fromJSWith(stack, converter, v, k, keyPath, value)), keyPath?.slice());
+    stack.pop();
+    if (keyPath) {
+      keyPath.pop();
+    }
+    return converted;
   }
+  return value;
+}
+var defaultConverter = (k, v) => isIndexed(v) ? v.toList() : isKeyed(v) ? v.toMap() : v.toSet();
+var asValues = (collection) => isKeyed(collection) ? collection.valueSeq() : collection;
+function initCollectionConversions() {
+  CollectionImpl.prototype.toMap = function toMap() {
+    return Map2(this.toKeyedSeq());
+  };
+  CollectionImpl.prototype.toOrderedMap = function toOrderedMap() {
+    return OrderedMap(this.toKeyedSeq());
+  };
+  CollectionImpl.prototype.toOrderedSet = function toOrderedSet() {
+    return OrderedSet(asValues(this));
+  };
+  CollectionImpl.prototype.toSet = function toSet() {
+    return Set2(asValues(this));
+  };
+  CollectionImpl.prototype.toStack = function toStack() {
+    return Stack2(asValues(this));
+  };
+  CollectionImpl.prototype.toList = function toList() {
+    return List(asValues(this));
+  };
+  CollectionImpl.prototype.countBy = function countBy(grouper, context) {
+    const groups = Map2().asMutable();
+    this.__iterate((v, k) => {
+      groups.update(grouper.call(context, v, k, this), 0, (a) => a + 1);
+    });
+    return groups.asImmutable();
+  };
+  CollectionImpl.prototype.groupBy = function groupBy(grouper, context) {
+    const isKeyedIter = isKeyed(this);
+    const groups = (isOrdered(this) ? OrderedMap() : Map2()).asMutable();
+    this.__iterate((v, k) => {
+      groups.update(grouper.call(context, v, k, this), (a) => {
+        a ??= [];
+        a.push(isKeyedIter ? [k, v] : v);
+        return a;
+      });
+    });
+    return groups.map((arr) => reifyValues(this, arr)).asImmutable();
+  };
+  IndexedCollectionImpl.prototype.keySeq = function keySeq() {
+    return Range(0, this.size);
+  };
+  MapImpl.prototype.sort = function sort(comparator) {
+    return OrderedMap(sortFactory(this, comparator));
+  };
+  MapImpl.prototype.sortBy = function sortBy(mapper, comparator) {
+    return OrderedMap(sortFactory(this, comparator, mapper));
+  };
+  SetImpl.prototype.sort = function sort(comparator) {
+    return OrderedSet(sortFactory(this, comparator));
+  };
+  SetImpl.prototype.sortBy = function sortBy(mapper, comparator) {
+    return OrderedSet(sortFactory(this, comparator, mapper));
+  };
 }
+var version$1 = "7.0.0";
+var pkg = {
+  version: version$1
+};
+initCollectionConversions();
+var { version } = pkg;
 
-class VNode2 extends VBase {
-  constructor(tag, attrs, childs, key, namespace) {
-    super();
-    this.tag = tag;
-    this.attrs = attrs ?? {};
-    this.childs = childs ?? [];
-    this.key = key != null ? String(key) : undefined;
-    this.namespace = typeof namespace === "string" ? namespace : null;
+// src/renderer.js
+var DATASET_ATTRS = ["nid", "cid", "eid", "vid", "si", "sk"];
+
+class Renderer {
+  constructor(comps, getSeqInfo, cache) {
+    this.comps = comps;
+    this.getSeqInfo = getSeqInfo ?? basicGetSeqInfo;
+    this.cache = cache ?? new WeakMapDomCache;
+  }
+  renderTag(tag, attrs, childs) {
+    return h(tag, attrs, childs);
   }
-  get nodeType() {
-    return 1;
+  renderFragment(childs) {
+    return new VFragment(childs);
   }
-  isEqualTo(other) {
-    if (!(other instanceof VNode2) || this.tag !== other.tag || this.key !== other.key || this.namespace !== other.namespace || this.childs.length !== other.childs.length) {
-      return false;
-    }
-    for (const key in this.attrs) {
-      if (this.attrs[key] !== other.attrs[key]) {
-        return false;
-      }
-    }
-    for (const key in other.attrs) {
-      if (!Object.hasOwn(this.attrs, key)) {
-        return false;
-      }
-    }
-    return childsEqual(this.childs, other.childs);
+  renderComment(text) {
+    return new VComment(text);
   }
-  toDom(opts) {
-    const doc = opts.document;
-    const node = this.namespace === null ? doc.createElement(this.tag) : doc.createElementNS(this.namespace, this.tag);
-    applyProperties(node, this.attrs, {});
-    appendChildNodes(node, this.childs, opts);
-    return node;
+  setNullCache() {
+    this.cache = new NullDomCache;
   }
-}
-function diffProps(a, b) {
-  let diff = null;
-  for (const aKey in a) {
-    if (!Object.hasOwn(b, aKey)) {
-      diff ??= {};
-      diff[aKey] = undefined;
-      continue;
-    }
-    const aValue = a[aKey];
-    const bValue = b[aKey];
-    if (aValue === bValue)
-      continue;
-    if (isObject(aValue) && isObject(bValue)) {
-      if (prototypesDiffer(bValue, aValue)) {
-        diff ??= {};
-        diff[aKey] = bValue;
-      } else {
-        const objectDiff = diffProps(aValue, bValue);
-        if (objectDiff) {
-          diff ??= {};
-          diff[aKey] = objectDiff;
+  renderToDOM(stack, val) {
+    const rootNode = document.createElement("div");
+    render(h("div", null, [this.renderRoot(stack, val)]), rootNode, { document });
+    return rootNode.childNodes[0];
+  }
+  renderToString(stack, val, cleanAttrs = true) {
+    const dom = this.renderToDOM(stack, val);
+    if (cleanAttrs) {
+      const nodes = dom.querySelectorAll("[data-nid],[data-cid],[data-eid]");
+      for (const { dataset } of nodes) {
+        for (const name of DATASET_ATTRS) {
+          delete dataset[name];
         }
       }
-    } else {
-      diff ??= {};
-      diff[aKey] = bValue;
-    }
-  }
-  for (const bKey in b) {
-    if (!Object.hasOwn(a, bKey)) {
-      diff ??= {};
-      diff[bKey] = b[bKey];
     }
+    return dom.innerHTML;
   }
-  return diff;
-}
-function morphNode(domNode, source, target, opts) {
-  if (source === target || source.isEqualTo(target))
-    return domNode;
-  const type = source.nodeType;
-  if (type === target.nodeType) {
-    if (type === 3 || type === 8) {
-      domNode.data = target.text;
-      return domNode;
-    }
-    if (type === 1 && source.tag === target.tag && source.namespace === target.namespace && source.key === target.key) {
-      const propsDiff = diffProps(source.attrs, target.attrs);
-      if (propsDiff)
-        applyProperties(domNode, propsDiff, source.attrs);
-      if (!target.attrs.dangerouslySetInnerHTML) {
-        morphChildren(domNode, source.childs, target.childs, opts);
-      }
-      return domNode;
-    }
-    if (type === 11) {
-      morphChildren(domNode, source.childs, target.childs, opts);
-      return domNode;
-    }
+  renderRoot(stack, val, viewName = null) {
+    const comp = this.comps.getCompFor(val);
+    const nid = comp.getView(viewName).anode.nodeId ?? null;
+    return comp ? this._rValComp(stack, val, comp, nid, "ROOT", viewName) : null;
   }
-  const newNode = target.toDom(opts);
-  domNode.parentNode?.replaceChild(newNode, domNode);
-  return newNode;
-}
-function morphChildren(parentDom, oldChilds, newChilds, opts) {
-  if (oldChilds.length === 0) {
-    appendChildNodes(parentDom, newChilds, opts);
-    return;
+  renderIt(stack, nodeId, key, viewName) {
+    const comp = this.comps.getCompFor(stack.it);
+    return comp ? this._rValComp(stack, stack.it, comp, nodeId, key, viewName) : null;
   }
-  if (newChilds.length === 0) {
-    parentDom.replaceChildren();
-    return;
+  _rValComp(stack, val, comp, nid, key, viewName) {
+    const cacheKey = `${viewName ?? stack.viewsId ?? ""}${nid}-${key}`;
+    const cachedNode = this.cache.get(val, cacheKey);
+    if (cachedNode) {
+      return cachedNode;
+    }
+    const view = viewName ? comp.getView(viewName) : stack.lookupBestView(comp.views, "main");
+    const meta = this._renderMetadata({ $: "Comp", nid });
+    const dom = new VFragment([meta, this.renderView(view, stack)]);
+    this.cache.set(val, cacheKey, dom);
+    return dom;
   }
-  const domNodes = Array.from(parentDom.childNodes);
-  const oldKeyMap = Object.create(null);
-  for (let i = 0;i < oldChilds.length; i++) {
-    const key = getKey(oldChilds[i]);
-    if (key != null)
-      oldKeyMap[key] = i;
+  pushEachEntry(r, nid, attrName, key, dom) {
+    r.push(this._renderMetadata({ $: "Each", nid, [attrName]: key }), dom);
   }
-  const used = new Uint8Array(oldChilds.length);
-  let unkeyedCursor = 0;
-  for (let j = 0;j < newChilds.length; j++) {
-    const newChild = newChilds[j];
-    const newKey = getKey(newChild);
-    let oldIdx = -1;
-    if (newKey != null) {
-      if (newKey in oldKeyMap && !used[oldKeyMap[newKey]]) {
-        oldIdx = oldKeyMap[newKey];
-      }
-    } else {
-      while (unkeyedCursor < oldChilds.length) {
-        if (!used[unkeyedCursor] && getKey(oldChilds[unkeyedCursor]) == null) {
-          oldIdx = unkeyedCursor++;
-          break;
-        }
-        unkeyedCursor++;
+  renderEach(stack, iterInfo, nodeId, viewName) {
+    const { seq, filter, loopWith } = iterInfo.eval(stack);
+    const [attrName, gen] = this.getSeqInfo(seq);
+    const r = [];
+    const iterData = loopWith.call(stack.it, seq);
+    for (const [key, value] of gen(seq)) {
+      if (filter.call(stack.it, key, value, iterData)) {
+        const newStack = stack.enter(value, { key }, true);
+        const dom = this.renderIt(newStack, nodeId, key, viewName);
+        this.pushEachEntry(r, nodeId, attrName, key, dom);
       }
     }
-    if (oldIdx >= 0) {
-      used[oldIdx] = 1;
-      const newDom = morphNode(domNodes[oldIdx], oldChilds[oldIdx], newChild, opts);
-      const ref = parentDom.childNodes[j] ?? null;
-      if (newDom !== ref)
-        parentDom.insertBefore(newDom, ref);
-    } else {
-      const ref = parentDom.childNodes[j] ?? null;
-      parentDom.insertBefore(newChild.toDom(opts), ref);
-    }
+    return r;
   }
-  for (let i = oldChilds.length - 1;i >= 0; i--) {
-    if (!used[i] && domNodes[i].parentNode === parentDom) {
-      parentDom.removeChild(domNodes[i]);
+  renderEachWhen(stack, iterInfo, view, nid) {
+    const { seq, filter, loopWith, enricher } = iterInfo.eval(stack);
+    const [attrName, gen] = this.getSeqInfo(seq);
+    const r = [];
+    const iterData = loopWith.call(stack.it, seq);
+    for (const [key, value] of gen(seq)) {
+      if (filter.call(stack.it, key, value, iterData)) {
+        const bindings = { key, value };
+        const cacheKey = `${nid}-${key}`;
+        let cachedNode;
+        if (enricher) {
+          enricher.call(stack.it, bindings, key, value, iterData);
+          cachedNode = this.cache.get2(stack.it, value, cacheKey);
+        } else {
+          cachedNode = this.cache.get(value, cacheKey);
+        }
+        if (cachedNode) {
+          this.pushEachEntry(r, nid, attrName, key, cachedNode);
+          continue;
+        }
+        const newStack = stack.enter(value, bindings, false);
+        const dom = this.renderView(view, newStack);
+        this.pushEachEntry(r, nid, attrName, key, dom);
+        if (enricher) {
+          this.cache.set2(stack.it, value, cacheKey, dom);
+        } else {
+          this.cache.set(value, cacheKey, dom);
+        }
+      }
     }
+    return r;
   }
-}
-var renderCache = new WeakMap;
-function render(vnode, container, options) {
-  const cached = renderCache.get(container);
-  const isFragment = vnode instanceof VFragment;
-  if (cached && cached.vnode instanceof VFragment === isFragment) {
-    const oldDom = isFragment ? container : cached.dom;
-    const newDom = morphNode(oldDom, cached.vnode, vnode, options);
-    renderCache.set(container, { vnode, dom: isFragment ? container : newDom });
-    return newDom;
-  }
-  renderCache.delete(container);
-  const domNode = vnode.toDom(options);
-  container.replaceChildren(domNode);
-  renderCache.set(container, { vnode, dom: isFragment ? container : domNode });
-  return domNode;
-}
-function h(tagName, properties, children) {
-  const tag = tagName.toUpperCase();
-  const props = {};
-  let key, namespace;
-  if (properties) {
-    for (const propName in properties) {
-      const propVal = properties[propName];
-      switch (propName) {
-        case "key":
-          key = propVal;
-          break;
-        case "namespace":
-          namespace = propVal;
-          break;
-        case "class":
-          props.className = propVal;
-          break;
-        case "for":
-          props.htmlFor = propVal;
+  renderView(view, stack) {
+    if (stack.binds.tail !== null) {
+      for (const binds of stack.binds.tail) {
+        if (!binds.isFrame)
+          continue;
+        if (stack.it !== binds.it)
           break;
-        default:
-          props[propName] = isHtmlAttribute(propName) ? String(propVal) : propVal;
+        console.error("recursion detected", stack.it, binds.it);
+        return new VComment("RECURSION AVOIDED");
       }
     }
+    return view.render(stack, this);
   }
-  const normalizedChildren = [];
-  addChild(normalizedChildren, children);
-  return new VNode2(tag, props, normalizedChildren, key, namespace);
+  _renderMetadata(info) {
+    return new VComment(`§${JSON.stringify(info)}§`);
+  }
+}
+function* imIndexedEntries(seq) {
+  let i = 0;
+  for (const v of seq)
+    yield [i++, v];
+}
+function* imKeyedEntries(obj) {
+  for (const [key, value] of obj.toSeq().entries())
+    yield [key, value];
+}
+var seqInfoByClass = new Map;
+var idxInfo = ["si", imIndexedEntries];
+var keyInfo = ["sk", imKeyedEntries];
+var unkInfo = ["si", function* nullEntries(_obj) {}];
+function basicGetSeqInfo(seq) {
+  return isIndexed(seq) ? idxInfo : isKeyed(seq) ? keyInfo : seqInfoByClass.get(seq?.constructor) ?? unkInfo;
 }
 // src/oo.js
 var BAD_VALUE = Symbol("BadValue");
@@ -7739,12 +7741,8 @@ var toNode = (nodeOrSelector) => typeof nodeOrSelector === "string" ? document.q
 function tutuca(nodeOrSelector) {
   const rootNode = toNode(nodeOrSelector);
   const comps = new Components;
-  const fragment = (childs) => new VFragment(childs);
-  const comment = (text) => new VComment(text);
-  const ropts = { document };
-  const render1 = (vnode, cont) => render(vnode, cont, ropts);
-  const renderer = new Renderer(comps, h, fragment, comment, render1);
-  return new App(rootNode, render1, comps, renderer, ParseContext);
+  const renderer = new Renderer(comps);
+  return new App(rootNode, comps, renderer, ParseContext);
 }
 export {
   version,