tutuca 0.9.15 → 0.9.16

package/dist/tutuca-dev.js

@@ -112,9 +112,8 @@ class Path {
     let curVal = v;
     for (const step of this.steps) {
       curVal = step.lookup(curVal, NONE);
-      if (curVal === NONE) {
+      if (curVal === NONE)
         return dval;
-      }
     }
     return curVal;
   }
@@ -124,9 +123,8 @@ class Path {
     for (let i = 0;i < this.steps.length; i++) {
       intermediates[i] = curVal;
       curVal = this.steps[i].lookup(curVal, NONE);
-      if (curVal === NONE) {
+      if (curVal === NONE)
         return root;
-      }
     }
     let newVal = v;
     for (let i = this.steps.length - 1;i >= 0; i--) {
@@ -144,7 +142,7 @@ class Path {
         console.warn(`bad PathItem`, { root, curVal, step, path: this });
         return null;
       }
-      step.updateBindings(curVal, stack.binds.head.bindings);
+      step.updateBindings(curVal, stack.binds[0].bindings);
       stack = stack.enter(curVal, {}, step.isFrame);
     }
     return stack;
@@ -193,9 +191,8 @@ var EMPTY_META = {};
 function parseMetaComment(n) {
   if (n?.nodeType === 8 && n.textContent[0] === "§") {
     const m = parseMetaComment(n.previousSibling);
-    if (m !== EMPTY_META) {
+    if (m !== EMPTY_META)
       return m;
-    }
     try {
       return JSON.parse(n.textContent.slice(1, -1));
     } catch (err) {
@@ -218,9 +215,8 @@ function resolvePathStep(comp, nodeIds, vid) {
     const j = node.pathInNext ? i + 1 : i;
     const { si, sk, nid: nodeId } = nodeIds[j];
     const pi = node.pathInNext ? comp.getNodeForId(+nodeId, vid).val.toPathItem() : node.toPathItem();
-    if (pi !== null) {
+    if (pi !== null)
       return si !== undefined ? pi.withIndex(+si) : sk ? pi.withKey(sk) : pi;
-    }
   }
   return null;
 }
@@ -270,20 +266,12 @@ class ValParser {
   }
   allowFieldOnly() {
     this.okField = true;
-    this.okBind = false;
-    this.okComputed = false;
-    this.okDyn = false;
-    this.okType = false;
-    this.okRequest = false;
-    this.okName = false;
-    this.okConst = false;
-    this.okStrTpl = false;
-    this.okSeqAccess = false;
+    this.okBind = this.okComputed = this.okDyn = this.okType = this.okRequest = false;
+    this.okName = this.okConst = this.okStrTpl = this.okSeqAccess = false;
   }
   _parseSeqAccess(s, px) {
-    if (!this.okSeqAccess) {
+    if (!this.okSeqAccess)
       return null;
-    }
     const openSquareBracketIndex = s.indexOf("[");
     this.allowFieldOnly();
     const left = this.parse(s.slice(0, openSquareBracketIndex), px);
@@ -326,15 +314,14 @@ class ValParser {
         return this.okRequest ? parseReq(s.slice(1), px) : null;
     }
     const num = VALID_FLOAT_RE.test(s) ? parseFloat(s) : null;
-    if (Number.isFinite(num)) {
+    if (Number.isFinite(num))
       return this.okConst ? parseConst(num, px) : null;
-    } else if (s === "true" || s === "false") {
+    else if (s === "true" || s === "false")
       return this.okConst ? parseConst(s === "true", px) : null;
-    } else if (charCode >= 97 && charCode <= 122) {
+    else if (charCode >= 97 && charCode <= 122)
       return this.okName ? parseName(s, px) : null;
-    } else if (charCode >= 65 && charCode <= 90) {
+    else if (charCode >= 65 && charCode <= 90)
       return this.okType ? parseType(s, px) : null;
-    }
     return null;
   }
   parseDynamic(s, px) {
@@ -344,19 +331,13 @@ class ValParser {
   }
   parseEach(s, px) {
     this.allowFieldOnly();
-    this.okComputed = true;
-    this.okDyn = true;
+    this.okComputed = this.okDyn = true;
     return this.parse(s, px);
   }
   allowHandlerArg() {
     this.allowFieldOnly();
-    this.okBind = true;
-    this.okComputed = true;
-    this.okDyn = true;
-    this.okType = true;
-    this.okRequest = true;
-    this.okName = true;
-    this.okConst = true;
+    this.okBind = this.okComputed = this.okDyn = this.okType = this.okRequest = true;
+    this.okName = this.okConst = true;
   }
   parseHandlerArg(s, px) {
     this.allowHandlerArg();
@@ -379,25 +360,17 @@ class ValParser {
   }
   parseAll(s, px) {
     this.allowHandlerArg();
-    this.okStrTpl = true;
-    this.okSeqAccess = true;
+    this.okStrTpl = this.okSeqAccess = true;
     return this.parse(s, px);
   }
   parseCondValue(s, px) {
     this.allowFieldOnly();
-    this.okBind = true;
-    this.okComputed = true;
-    this.okDyn = true;
-    this.okConst = true;
+    this.okBind = this.okComputed = this.okDyn = this.okConst = true;
     return this.parse(s, px);
   }
   parseText(s, px) {
     this.allowFieldOnly();
-    this.okBind = true;
-    this.okComputed = true;
-    this.okDyn = true;
-    this.okConst = true;
-    this.okStrTpl = true;
+    this.okBind = this.okComputed = this.okDyn = this.okConst = this.okStrTpl = true;
     return this.parse(s, px);
   }
   parseRender(s, px) {
@@ -445,9 +418,8 @@ class StrTplVal extends VarVal {
   }
   eval(stack) {
     const strs = new Array(this.vals.length);
-    for (let i = 0;i < this.vals.length; i++) {
+    for (let i = 0;i < this.vals.length; i++)
       strs[i] = this.vals[i]?.eval(stack, "");
-    }
     return strs.join("");
   }
   static parse(s, px) {
@@ -603,15 +575,13 @@ function getValSubType(s) {
   for (let i = 0;i < s.length; i++) {
     switch (s.charCodeAt(i)) {
       case 91:
-        if (open > 0) {
+        if (open > 0)
           return VAL_SUB_TYPE_INVALID;
-        }
         open += 1;
         break;
       case 93:
-        if (close > 0 || open === 0) {
+        if (close > 0 || open === 0)
           return VAL_SUB_TYPE_INVALID;
-        }
         close += 1;
         break;
       case 123:
@@ -620,9 +590,8 @@ function getValSubType(s) {
         return VAL_SUB_TYPE_CONST_STRING;
     }
   }
-  if (open > 0 || close > 0) {
+  if (open > 0 || close > 0)
     return open === 1 && close === 1 ? VAL_SUB_TYPE_SEQ_ACCESS : VAL_SUB_TYPE_INVALID;
-  }
   return -1;
 }
 var vp = new ValParser;
@@ -683,14 +652,12 @@ class AttrParser {
     }
   }
   parseThen(s) {
-    if (this.ifAttr) {
+    if (this.ifAttr)
       this.ifAttr.thenVal = vp.parseAttr(s, this.px) ?? NOT_SET_VAL;
-    }
   }
   parseElse(value) {
-    if (this.ifAttr) {
+    if (this.ifAttr)
       this.ifAttr.elseVal = vp.parseAttr(value, this.px) ?? NOT_SET_VAL;
-    }
   }
   parseEvent(directiveName, value) {
     const [eventName, ...modifiers] = directiveName.slice(3).split("+");
@@ -749,25 +716,22 @@ class AttrParser {
         this.parseElse(s);
         return;
     }
-    if (directiveName.startsWith("on.")) {
+    if (directiveName.startsWith("on."))
       this.parseEvent(directiveName, s);
-    } else if (directiveName.startsWith("if.")) {
+    else if (directiveName.startsWith("if."))
       this.parseIf(directiveName, s);
-    } else if (directiveName.startsWith("then.")) {
+    else if (directiveName.startsWith("then."))
       this.parseThen(s);
-    } else if (directiveName.startsWith("else.")) {
+    else if (directiveName.startsWith("else."))
       this.parseElse(s);
-    }
   }
   _parseWhen(s) {
-    if (this.eachAttr !== null) {
+    if (this.eachAttr !== null)
       this.eachAttr.whenVal = vp.parseAlter(s, this.px);
-    }
   }
   _parseLoopWith(s) {
-    if (this.eachAttr !== null) {
+    if (this.eachAttr !== null)
       this.eachAttr.loopWithVal = vp.parseAlter(s, this.px);
-    }
   }
   parse(attributes, parseAll = false) {
     for (const { name, value } of attributes) {
@@ -794,9 +758,8 @@ class ConstAttrs extends Attributes {
   }
   static fromAttrs(attrs) {
     const attrsObj = {};
-    for (const attr of attrs) {
+    for (const attr of attrs)
       attrsObj[attr.name] = attr.val.eval(null);
-    }
     return new ConstAttrs(attrsObj);
   }
   setDataAttr(key, val) {
@@ -804,9 +767,8 @@ class ConstAttrs extends Attributes {
   }
   toMacroVars() {
     const r = {};
-    for (const name in this.items) {
+    for (const name in this.items)
       r[name] = `'${this.items[name]}'`;
-    }
     return r;
   }
   isConstant() {
@@ -817,7 +779,8 @@ class ConstAttrs extends Attributes {
 class DynAttrs extends Attributes {
   eval(stack) {
     const attrs = {};
-    for (const attr of this.items) {
+    for (let i = 0;i < this.items.length; i++) {
+      const attr = this.items[i];
       attrs[attr.name] = attr.eval(stack);
     }
     return attrs;
@@ -827,9 +790,8 @@ class DynAttrs extends Attributes {
   }
   toMacroVars() {
     const r = {};
-    for (const attr of this.items) {
+    for (const attr of this.items)
       r[attr.name] = attr.val.toString();
-    }
     return r;
   }
 }
@@ -889,17 +851,15 @@ class EventHandler {
   }
   getHandlerAndArgs(stack, _event) {
     const argValues = new Array(this.args.length);
-    for (let i = 0;i < argValues.length; i++) {
+    for (let i = 0;i < argValues.length; i++)
       argValues[i] = this.args[i].eval(stack);
-    }
     return [this.handlerVal.eval(stack), argValues];
   }
   static parse(s, px) {
     const [handlerName, ...rawArgs] = s.trim().split(/\s+/);
     const handlerVal = vp.parseHandlerName(handlerName, px);
-    if (handlerVal === null) {
+    if (handlerVal === null)
       return null;
-    }
     const args = new Array(rawArgs.length);
     vp.allowHandlerArg();
     for (let i = 0;i < rawArgs.length; i++) {
@@ -1451,7 +1411,7 @@ function condenseChildsWhites(childs) {
 }
 
 class View {
-  constructor(name, rawView, style = "", anode = null, ctx = null) {
+  constructor(name, rawView = "No View Defined", style = "", anode = null, ctx = null) {
     this.name = name;
     this.anode = anode;
     this.style = style;
@@ -1546,6 +1506,63 @@ function compileModifiers(eventName, names) {
   };
 }
 
+// src/util/parsectx.js
+class ParseCtxClassSetCollector extends ParseContext {
+  constructor(...args) {
+    super(...args);
+    this.classes = new Set;
+  }
+  _addClasses(s) {
+    for (const v of s.split(/\s+/)) {
+      this.classes.add(v);
+    }
+  }
+  enterMacro(macroName, macroVars, macroSlots) {
+    const { DOMParser: DP, Text, Comment, nodes, events, macroNodes } = this;
+    const frame = { macroName, macroVars, macroSlots };
+    const v = new ParseCtxClassSetCollector(DP, Text, Comment, nodes, events, macroNodes, frame, this);
+    v.classes = this.classes;
+    return v;
+  }
+  onAttributes(attrs, _wrapperAttrs, _textChild) {
+    if (Array.isArray(attrs.items)) {
+      for (const attr of attrs.items) {
+        if (attr.name !== "class") {
+          continue;
+        }
+        const { val, thenVal, elseVal } = attr;
+        if (thenVal !== undefined) {
+          this._maybeAddVal(thenVal);
+          this._maybeAddVal(elseVal);
+        } else {
+          this._maybeAddVal(val);
+        }
+      }
+    } else {
+      const attr = attrs.items.class;
+      if (attr) {
+        this._addClasses(attr);
+      }
+    }
+  }
+  _maybeAddVal(value) {
+    if (!this._maybeAddStrTpl(value) && typeof value?.val === "string") {
+      this._addClasses(value.val);
+    }
+  }
+  _maybeAddStrTpl(value) {
+    if (value?.vals !== undefined) {
+      for (const val of value.vals) {
+        if (val instanceof ConstVal && val.val !== "") {
+          this._addClasses(val.val);
+        }
+      }
+      return true;
+    }
+    return false;
+  }
+}
+
 // src/cache.js
 class NullDomCache {
   get(_k, _cacheKey) {}
@@ -1563,11 +1580,10 @@ class WeakMapDomCache {
     this.map = new WeakMap;
   }
   _returnValue(r) {
-    if (r === undefined) {
+    if (r === undefined)
       this.miss += 1;
-    } else {
+    else
       this.hit += 1;
-    }
     return r;
   }
   get(k, cacheKey) {
@@ -1575,13 +1591,12 @@ class WeakMapDomCache {
   }
   set(k, cacheKey, v) {
     const cur = this.map.get(k);
-    if (cur) {
+    if (cur)
       cur[cacheKey] = v;
-    } else if (typeof k === "object") {
+    else if (typeof k === "object")
       this.map.set(k, { [cacheKey]: v });
-    } else {
+    else
       this.badKey += 1;
-    }
   }
   get2(k1, k2, cacheKey) {
     return this._returnValue(this.map.get(k1)?.get?.(k2)?.[cacheKey]);
@@ -1590,11 +1605,10 @@ class WeakMapDomCache {
     const cur1 = this.map.get(k1);
     if (cur1) {
       const cur = cur1.get(k2);
-      if (cur) {
+      if (cur)
         cur[cacheKey] = v;
-      } else {
+      else
         cur1.set(k2, { [cacheKey]: v });
-      }
     } else if (typeof k1 === "object" && typeof k2 === "object") {
       const cur = new WeakMap;
       cur.set(k2, { [cacheKey]: v });
@@ -1625,9 +1639,8 @@ class WeakMapComputedCache {
     const cur = this.map.get(v);
     if (cur) {
       const curValue = cur[key];
-      if (curValue !== undefined) {
+      if (curValue !== undefined)
         return curValue;
-      }
       const newValue2 = fn.call(v) ?? null;
       cur[key] = newValue2;
       return newValue2;
@@ -1675,9 +1688,8 @@ class Components {
   }
   compileStyles() {
     const styles = [];
-    for (const comp of this.byId.values()) {
+    for (const comp of this.byId.values())
       styles.push(comp.compileStyle());
-    }
     return styles.join(`
 `);
   }
@@ -1701,9 +1713,8 @@ class ComponentStack {
       this.comps.registerComponent(comp);
       this.byName[comp.name] = comp;
       const alias = aliases[comp.name];
-      if (alias) {
+      if (alias)
         this.byName[alias] = comp;
-      }
     }
   }
   registerMacros(macros) {
@@ -1713,9 +1724,8 @@ class ComponentStack {
     return this.comps.getCompFor(v);
   }
   registerRequestHandlers(handlers) {
-    for (const name in handlers) {
+    for (const name in handlers)
       this.reqsByName[name] = new RequestHandler(name, handlers[name]);
-    }
   }
   lookupRequest(name) {
     return this.reqsByName[name] ?? this.parent?.lookupRequest(name) ?? null;
@@ -1761,26 +1771,26 @@ var isString = (v) => typeof v === "string";
 var _compId = 0;
 
 class Component {
-  constructor(name, Class, view, views = {}, style = "", commonStyle = "", globalStyle = "", computed = {}, input = {}, logic = {}, bubble = {}, response = {}, alter = {}, dynamic = {}, on = {}) {
+  constructor(Class, o) {
     this.id = _compId++;
-    this.name = name;
+    this.name = o.name ?? "UnkComp";
     this.Class = Class;
-    this.views = { main: new View("main", view, style) };
-    this.commonStyle = commonStyle;
-    this.globalStyle = globalStyle;
-    this.computed = computed;
-    this.input = input;
-    this.logic = logic;
-    this.bubble = bubble;
-    this.response = response;
-    this.alter = alter;
-    this.on = { stackEnter: on?.stackEnter ?? defaultOnStackEnter };
-    for (const name2 in views) {
-      const v = views[name2];
-      const { view: view2, style: style2 } = isString(v) ? { view: v } : v;
-      this.views[name2] = new View(name2, view2, style2);
-    }
-    this._rawDynamic = dynamic;
+    this.views = { main: new View("main", o.view, o.style) };
+    this.commonStyle = o.commonStyle ?? "";
+    this.globalStyle = o.globalStyle ?? "";
+    this.computed = o.computed ?? {};
+    this.input = o.input ?? {};
+    this.logic = o.logic ?? {};
+    this.bubble = o.bubble ?? {};
+    this.response = o.response ?? {};
+    this.alter = o.alter ?? {};
+    this.on = { stackEnter: o.on?.stackEnter ?? defaultOnStackEnter };
+    for (const name in o.views ?? {}) {
+      const v = o.views[name];
+      const { view, style } = isString(v) ? { view: v } : v;
+      this.views[name] = new View(name, view, style);
+    }
+    this._rawDynamic = o.dynamic ?? {};
     this.dynamic = {};
     this.scope = null;
   }
@@ -1798,9 +1808,8 @@ class Component {
         }
       }
     }
-    for (const name in this.views) {
+    for (const name in this.views)
       this.views[name].compile(new ParseContext2, this.scope, this.id);
-    }
   }
   make(args, opts) {
     return this.Class.make(args, opts);
@@ -1817,14 +1826,12 @@ class Component {
   compileStyle() {
     const { id, commonStyle, globalStyle, views } = this;
     const styles = commonStyle ? [`[data-cid="${id}"]{${commonStyle}}`] : [];
-    if (globalStyle !== "") {
+    if (globalStyle !== "")
       styles.push(globalStyle);
-    }
     for (const name in views) {
       const { style } = views[name];
-      if (style !== "") {
+      if (style !== "")
         styles.push(`[data-cid="${id}"][data-vid="${name}"]{${style}}`);
-      }
     }
     return styles.join(`
 `);
@@ -1837,27 +1844,17 @@ function defaultOnStackEnter(stack) {
 // src/stack.js
 var STOP = Symbol("STOP");
 var NEXT = Symbol("NEXT");
-
-class Pair {
-  constructor(head, tail) {
-    this.head = head;
-    this.tail = tail;
-  }
-  push(v) {
-    return new Pair(v, this);
-  }
-  lookup(v, dv = null) {
-    const { tail } = this;
-    const r = this.head.lookup(v);
-    return r === STOP ? dv : r === NEXT ? tail !== null ? tail.lookup(v, dv) : dv : r;
-  }
-  *[Symbol.iterator]() {
-    let v = this;
-    while (v !== null) {
-      yield v.head;
-      v = v.tail;
-    }
+function lookup(chain, name, dv = null) {
+  let n = chain;
+  while (n !== null) {
+    const r = n[0].lookup(name);
+    if (r === STOP)
+      return dv;
+    if (r !== NEXT)
+      return r;
+    n = n[1];
   }
+  return dv;
 }
 
 class BindFrame {
@@ -1881,56 +1878,64 @@ class ObjectFrame {
     return v === undefined ? NEXT : v;
   }
 }
+function computeViewsId(views) {
+  let s = "";
+  let n = views;
+  while (n !== null) {
+    s += n[0];
+    n = n[1];
+  }
+  return s === "main" ? "" : s;
+}
 
 class Stack {
-  constructor(comps, it, binds, dynBinds, views, ctx = null) {
+  constructor(comps, it, binds, dynBinds, views, viewsId, ctx = null) {
     this.comps = comps;
     this.it = it;
     this.binds = binds;
     this.dynBinds = dynBinds;
     this.views = views;
+    this.viewsId = viewsId;
     this.ctx = ctx;
-    const viewsId = [...views].join("");
-    this.viewsId = viewsId === "main" ? "" : viewsId;
   }
   _enrichOnEnter() {
     return this.comps.getOnEnterFor(this.it).call(this.it, this) ?? this;
   }
   upToFrameBinds() {
-    const { comps, binds, dynBinds, views, ctx } = this;
-    return binds.head.isFrame ? this : new Stack(comps, binds.tail.head.it, binds.tail, dynBinds, views, ctx);
+    const { comps, binds, dynBinds, views, viewsId, ctx } = this;
+    return binds[0].isFrame ? this : new Stack(comps, binds[1][0].it, binds[1], dynBinds, views, viewsId, ctx);
   }
   static root(comps, it, ctx) {
-    const binds = new Pair(new BindFrame(it, { it }, true), null);
-    const dynBinds = new Pair(new ObjectFrame({}), null);
-    const views = new Pair("main", null);
-    return new Stack(comps, it, binds, dynBinds, views, ctx)._enrichOnEnter();
+    const binds = [new BindFrame(it, { it }, true), null];
+    const dynBinds = [new ObjectFrame({}), null];
+    const views = ["main", null];
+    return new Stack(comps, it, binds, dynBinds, views, "", ctx)._enrichOnEnter();
   }
   enter(it, bindings = {}, isFrame = true) {
-    const { comps, binds, dynBinds, views, ctx } = this;
-    const newBinds = binds.push(new BindFrame(it, bindings, isFrame));
-    return new Stack(comps, it, newBinds, dynBinds, views, ctx)._enrichOnEnter();
+    const { comps, binds, dynBinds, views, viewsId, ctx } = this;
+    const newBinds = [new BindFrame(it, bindings, isFrame), binds];
+    return new Stack(comps, it, newBinds, dynBinds, views, viewsId, ctx)._enrichOnEnter();
   }
   pushViewName(name) {
     const { comps, it, binds, dynBinds, views, ctx } = this;
-    return new Stack(comps, it, binds, dynBinds, views.push(name), ctx);
+    const newViews = [name, views];
+    return new Stack(comps, it, binds, dynBinds, newViews, computeViewsId(newViews), ctx);
   }
   withDynamicBindings(dynamics) {
     const dynObj = {};
     const comp = this.comps.getCompFor(this.it);
-    for (const dynName of dynamics) {
+    for (const dynName of dynamics)
       comp.dynamic[dynName].evalAndBind(this, dynObj);
-    }
-    const { comps, it, binds, views, ctx } = this;
-    const newDynBinds = this.dynBinds.push(new ObjectFrame(dynObj));
-    return new Stack(comps, it, binds, newDynBinds, views, ctx);
+    const { comps, it, binds, views, viewsId, ctx } = this;
+    const newDynBinds = [new ObjectFrame(dynObj), this.dynBinds];
+    return new Stack(comps, it, binds, newDynBinds, views, viewsId, ctx);
   }
   lookupDynamic(name) {
     const d = this.comps.getCompFor(this.it)?.dynamic[name];
-    return d ? this.dynBinds.lookup(d.getSymbol(this)) ?? d.val.eval(this) : null;
+    return d ? lookup(this.dynBinds, d.getSymbol(this)) ?? d.val.eval(this) : null;
   }
   lookupBind(name) {
-    return this.binds.lookup(name);
+    return lookup(this.binds, name);
   }
   lookupType(name) {
     return this.comps.getCompFor(this.it).scope.lookupComponent(name);
@@ -1946,7 +1951,7 @@ class Stack {
     return this.ctx.lookupName(name);
   }
   lookupComputed(name) {
-    const node = this.binds.head.isFrame ? this.binds.head : this.binds.tail.head;
+    const node = this.binds[0].isFrame ? this.binds[0] : this.binds[1][0];
     return this.comps.lookupComputed(node.it, name);
   }
   getHandlerFor(name, key) {
@@ -1956,11 +1961,12 @@ class Stack {
     return this.comps.getRequestFor(this.it, name);
   }
   lookupBestView(views, defaultViewName) {
-    for (const viewName of this.views) {
-      const view = views[viewName];
-      if (view !== undefined) {
+    let n = this.views;
+    while (n !== null) {
+      const view = views[n[0]];
+      if (view !== undefined)
         return view;
-      }
+      n = n[1];
     }
     return views[defaultViewName];
   }
@@ -1978,9 +1984,8 @@ class State {
   set(val, info) {
     const old = this.val;
     this.val = val;
-    for (const sub of this.changeSubs) {
+    for (const sub of this.changeSubs)
       sub({ val, old, info, timestamp: Date.now() });
-    }
   }
   update(fn, info) {
     return this.set(fn(this.val), info);
@@ -2027,14 +2032,8 @@ class Transactor {
     return this.transactions.length > 0;
   }
   transactNext() {
-    if (this.hasPendingTransactions) {
+    if (this.hasPendingTransactions)
       this.transact(this.transactions.shift());
-    }
-  }
-  transactAll() {
-    while (this.hasPendingTransactions) {
-      this.transact(this.transactions.shift());
-    }
   }
   transact(transaction) {
     const curState = this.state.val;
@@ -2042,9 +2041,8 @@ class Transactor {
     if (newState !== undefined) {
       this.state.set(newState, { transaction });
       transaction.afterTransaction();
-    } else {
+    } else
       console.warn("undefined new state", { curState, transaction });
-    }
   }
   transactInputNow(path, event, eventHandler, dragInfo) {
     this.transact(new InputEvent(path, event, eventHandler, this, dragInfo));
@@ -2204,9 +2202,8 @@ class LogicEvent extends NameArgsTransaction {
   }
   afterTransaction() {
     const { path, name, args, opts } = this;
-    if (opts.bubbles && path.steps.length > 0) {
+    if (opts.bubbles && path.steps.length > 0)
       this.transactor.pushBubble(path.popStep(), name, args, opts, this);
-    }
   }
 }
 
@@ -2246,7 +2243,7 @@ class Task {
 }
 
 class Dispatcher {
-  constructor(path, transactor, parentTransaction = null) {
+  constructor(path, transactor, parentTransaction) {
     this.path = path;
     this.transactor = transactor;
     this.parent = parentTransaction;
@@ -2303,34 +2300,32 @@ var prototypesDiffer = (a, b) => Object.getPrototypeOf(a) !== Object.getPrototyp
 function applyProperties(node, props, previous) {
   for (const propName in props) {
     const propValue = props[propName];
-    if (propValue === undefined) {
+    if (propValue === undefined)
       removeProperty(node, propName, previous);
-    } else if (isHtmlAttribute(propName)) {
+    else if (isHtmlAttribute(propName))
       node.setAttribute(propName, propValue);
-    } else if (propName === "dangerouslySetInnerHTML") {
+    else if (propName === "dangerouslySetInnerHTML")
       node.innerHTML = propValue.__html ?? "";
-    } else if (isObject(propValue)) {
+    else if (isObject(propValue))
       patchObject(node, previous, propName, propValue);
-    } else if (propName === "className") {
+    else if (propName === "className")
       node.setAttribute("class", propValue);
-    } else {
+    else
       node[propName] = propValue;
-    }
   }
 }
 function removeProperty(node, propName, previous) {
   const previousValue = previous[propName];
-  if (propName === "dangerouslySetInnerHTML") {
+  if (propName === "dangerouslySetInnerHTML")
     node.replaceChildren();
-  } else if (propName === "className") {
+  else if (propName === "className")
     node.removeAttribute("class");
-  } else if (propName === "htmlFor") {
+  else if (propName === "htmlFor")
     node.removeAttribute("for");
-  } else if (typeof previousValue === "string" || isHtmlAttribute(propName)) {
+  else if (typeof previousValue === "string" || isHtmlAttribute(propName))
     node.removeAttribute(propName);
-  } else {
+  else
     node[propName] = null;
-  }
 }
 function patchObject(node, previous, propName, propValue) {
   const previousValue = previous?.[propName];
@@ -2338,13 +2333,11 @@ function patchObject(node, previous, propName, propValue) {
     node[propName] = propValue;
     return;
   }
-  if (!isObject(node[propName])) {
+  if (!isObject(node[propName]))
     node[propName] = {};
-  }
   const target = node[propName];
-  for (const k in propValue) {
+  for (const k in propValue)
     target[k] = propValue[k];
-  }
 }
 
 class VBase {
@@ -2352,33 +2345,30 @@ 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 === b)
+    return true;
+  for (let i = 0;i < a.length; i++)
     if (!a[i].isEqualTo(b[i]))
       return false;
-  }
   return true;
 }
 function appendChildNodes(parent, childs, opts) {
-  for (const child of childs) {
+  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) {
+    for (const c of child)
       addChild(normalizedChildren, c);
-    }
   } else if (child instanceof VBase) {
-    if (child instanceof VFragment) {
+    if (child instanceof VFragment)
       normalizedChildren.push(...child.childs);
-    } else {
+    else
       normalizedChildren.push(child);
-    }
-  } else {
+  } else
     normalizedChildren.push(new VText(child));
-  }
 }
 
 class VText extends VBase {
@@ -2423,9 +2413,8 @@ class VFragment extends VBase {
     return 11;
   }
   isEqualTo(other) {
-    if (!(other instanceof VFragment) || this.childs.length !== other.childs.length) {
+    if (!(other instanceof VFragment) || this.childs.length !== other.childs.length)
       return false;
-    }
     return childsEqual(this.childs, other.childs);
   }
   toDom(opts) {
@@ -2448,18 +2437,18 @@ class VNode extends VBase {
     return 1;
   }
   isEqualTo(other) {
+    if (this === other)
+      return true;
     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;
-      }
+    if (this.attrs !== other.attrs) {
+      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);
   }
@@ -2472,6 +2461,8 @@ class VNode extends VBase {
   }
 }
 function diffProps(a, b) {
+  if (a === b)
+    return null;
   let diff = null;
   for (const aKey in a) {
     if (!Object.hasOwn(b, aKey)) {
@@ -2543,6 +2534,24 @@ function morphChildren(parentDom, oldChilds, newChilds, opts) {
     parentDom.replaceChildren();
     return;
   }
+  if (oldChilds.length === newChilds.length) {
+    let hasKey = false;
+    for (let i = 0;i < oldChilds.length; i++) {
+      if (getKey(oldChilds[i]) != null || getKey(newChilds[i]) != null) {
+        hasKey = true;
+        break;
+      }
+    }
+    if (!hasKey) {
+      let dom = parentDom.firstChild;
+      for (let i = 0;i < oldChilds.length; i++) {
+        const next = dom.nextSibling;
+        morphNode(dom, oldChilds[i], newChilds[i], opts);
+        dom = next;
+      }
+      return;
+    }
+  }
   const domNodes = Array.from(parentDom.childNodes);
   const oldKeyMap = Object.create(null);
   for (let i = 0;i < oldChilds.length; i++) {
@@ -2557,9 +2566,8 @@ function morphChildren(parentDom, oldChilds, newChilds, opts) {
     const newKey = getKey(newChild);
     let oldIdx = -1;
     if (newKey != null) {
-      if (newKey in oldKeyMap && !used[oldKeyMap[newKey]]) {
+      if (newKey in oldKeyMap && !used[oldKeyMap[newKey]])
         oldIdx = oldKeyMap[newKey];
-      }
     } else {
       while (unkeyedCursor < oldChilds.length) {
         if (!used[unkeyedCursor] && getKey(oldChilds[unkeyedCursor]) == null) {
@@ -2580,11 +2588,9 @@ function morphChildren(parentDom, oldChilds, newChilds, opts) {
       parentDom.insertBefore(newChild.toDom(opts), ref);
     }
   }
-  for (let i = oldChilds.length - 1;i >= 0; i--) {
-    if (!used[i] && domNodes[i].parentNode === parentDom) {
+  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) {
@@ -2633,6 +2639,8 @@ function h(tagName, properties, children) {
 }
 
 // src/app.js
+var _evs = "dragstart dragover dragend touchstart touchmove touchend touchcancel".split(" ");
+
 class App {
   constructor(rootNode, comps, renderer, ParseContext2) {
     this.rootNode = rootNode;
@@ -2643,12 +2651,12 @@ class App {
     this.renderer = renderer;
     this.maxEventNodeDepth = Infinity;
     this._transactNextBatchId = this._evictCacheId = null;
-    this._eventNames = new Set(["dragstart", "dragover", "dragend"]);
+    this._eventNames = new Set(_evs);
     this.dragInfo = this.curDragOver = null;
+    this._touch = null;
     this.transactor.onTransactionPushed = (_transaction) => {
-      if (this._transactNextBatchId === null) {
+      if (this._transactNextBatchId === null)
         this._scheduleNextTransactionBatchExecution();
-      }
     };
     this._compiled = false;
     this._renderOpts = { document: rootNode.ownerDocument };
@@ -2657,36 +2665,95 @@ class App {
     return this.transactor.state;
   }
   handleEvent(e) {
-    const isDragStart = e.type === "dragstart";
-    const isDragOver = e.type === "dragover";
-    const isDragEnd = e.type === "dragend";
+    const { type } = e;
+    if (type[0] === "t" && type.startsWith("touch")) {
+      this._handleTouchEvent(e);
+      return;
+    }
+    this._dispatchEvent(e);
+  }
+  _dispatchEvent(e) {
+    const { type } = e;
+    const isDrag = type === "dragover" || type === "dragstart" || 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 [path, handlers] = Path.fromEvent(e, root, maxDepth, comps, !isDrag);
+    if (isDrag)
+      this._handleDragEvent(e, type, path);
+    if (path !== null && handlers !== null) {
+      for (const handler of handlers) {
+        this.transactor.transactInputNow(path, e, handler, this.dragInfo);
+      }
+    }
+  }
+  _handleTouchEvent(e) {
+    const { type } = e;
+    if (type === "touchstart") {
+      if (this._touch !== null || e.touches.length !== 1)
+        return;
+      const t = e.touches[0];
+      const draggable = t.target?.closest?.('[draggable="true"]');
+      if (!draggable)
+        return;
+      this._touch = makeTouchInfo(t.identifier, t.clientX, t.clientY, draggable, false);
+      return;
+    }
+    if (this._touch === null)
+      return;
+    const touch = findTouch(e, this._touch.id);
+    if (touch === null)
+      return;
+    const { rootNode, _touch } = this;
+    const { clientX, clientY } = touch;
+    const fire = (type2, target) => {
+      const e2 = { type: type2, target, clientX, clientY, preventDefault: NOOP };
+      this._dispatchEvent(e2);
+    };
+    if (type === "touchmove") {
+      if (!_touch.active) {
+        const dx = clientX - _touch.startX;
+        const dy = clientY - _touch.startY;
+        if (dx * dx + dy * dy < TOUCH_DRAG_THRESHOLD_SQ)
+          return;
+        _touch.active = true;
+        e.preventDefault();
+        fire("dragstart", _touch.target);
+      } else {
+        e.preventDefault();
+        fire("dragover", hitTest(rootNode, clientX, clientY));
+      }
+      return;
+    }
+    if (type === "touchend" || type === "touchcancel") {
+      if (_touch.active) {
+        if (type === "touchend")
+          fire("drop", hitTest(rootNode, clientX, clientY));
+        fire("dragend", _touch.target);
+      }
+      this._touch = null;
+    }
+  }
+  _handleDragEvent(e, type, path) {
+    if (type === "dragover") {
       const dropTarget = getClosestDropTarget(e.target, this.rootNode, 50);
       if (dropTarget !== null) {
         e.preventDefault();
         this._cleanDragOverAttrs();
         this.curDragOver = dropTarget;
-        dropTarget.dataset.draggingover = this.dragInfo.type;
+        dropTarget.dataset.draggingover = this.dragInfo?.type ?? "_external";
       }
-    } else if (isDragStart) {
+    } else if (type === "dragstart") {
       e.target.dataset.dragging = 1;
       const rootValue = this.state.val;
       const value = path.lookup(rootValue);
-      const type = e.target.dataset.dragtype ?? "?";
+      const dragType = 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);
+      this.dragInfo = new DragInfo(path, stack, e, value, dragType, e.target);
+    } else {
+      if (this.dragInfo !== null) {
+        delete this.dragInfo.node.dataset.dragging;
+        this.dragInfo = null;
       }
+      this._cleanDragOverAttrs();
     }
   }
   makeStack(rootValue) {
@@ -2709,25 +2776,20 @@ class App {
   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()) {
+      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) {
+    if (!this._compiled)
       this.compile();
-    }
-    for (const name of this._eventNames) {
-      this.rootNode.addEventListener(name, this);
-    }
+    for (const name of this._eventNames)
+      this.rootNode.addEventListener(name, this, listenerOpts(name));
     this.onChange((info) => {
-      if (info.val !== info.old) {
+      if (info.val !== info.old)
         this.render();
-      }
     });
     injectCss("tutuca-app", this.comps.compileStyles(), opts?.head ?? document.head);
     if (opts?.noCache) {
@@ -2740,9 +2802,8 @@ class App {
   }
   stop() {
     this.stopCacheEvictionInterval();
-    for (const name of this._eventNames) {
-      this.rootNode.removeEventListener(name, this);
-    }
+    for (const name of this._eventNames)
+      this.rootNode.removeEventListener(name, this, listenerOpts(name));
   }
   dispatchLogicAtRoot(name, args, opts) {
     return this.transactor.pushLogic(new Path([]), name, args, opts);
@@ -2756,12 +2817,10 @@ class App {
     this._transactNextBatchId = null;
     const startTs = Date.now();
     const t = this.transactor;
-    while (t.hasPendingTransactions && Date.now() - startTs < maxRunTimeMs) {
+    while (t.hasPendingTransactions && Date.now() - startTs < maxRunTimeMs)
       t.transactNext();
-    }
-    if (t.hasPendingTransactions) {
+    if (t.hasPendingTransactions)
       this._scheduleNextTransactionBatchExecution();
-    }
   }
   _scheduleNextTransactionBatchExecution() {
     this._transactNextBatchId = setTimeout(() => this._transactNextBatch(), 0);
@@ -2777,19 +2836,44 @@ class App {
 function injectCss(nodeId, style, styleTarget = document.head) {
   const styleNode = document.createElement("style");
   const currentNodeWithId = styleTarget.querySelector(`#${nodeId}`);
-  if (currentNodeWithId) {
+  if (currentNodeWithId)
     styleTarget.removeChild(currentNodeWithId);
-  }
   styleNode.id = nodeId;
   styleNode.innerHTML = style;
   styleTarget.appendChild(styleNode);
 }
+var TOUCH_DRAG_THRESHOLD_PX = 10;
+var TOUCH_DRAG_THRESHOLD_SQ = TOUCH_DRAG_THRESHOLD_PX * TOUCH_DRAG_THRESHOLD_PX;
+var NOOP = () => {};
+function findTouch(e, id) {
+  for (const t of e.changedTouches)
+    if (t.identifier === id)
+      return t;
+  for (const t of e.touches)
+    if (t.identifier === id)
+      return t;
+  return null;
+}
+var listenerOpts = (name) => name === "touchmove" ? { passive: false } : undefined;
+function makeTouchInfo(id, startX, startY, target, active) {
+  return { id, startX, startY, target, active };
+}
+function hitTest(rootNode, x, y) {
+  const root = rootNode.getRootNode();
+  let el = root.elementFromPoint?.(x, y) ?? null;
+  while (el?.shadowRoot) {
+    const next = el.shadowRoot.elementFromPoint(x, y);
+    if (next === null || next === el)
+      break;
+    el = next;
+  }
+  return el ?? rootNode;
+}
 function getClosestDropTarget(target, rootNode, count) {
   let node = target;
   while (count-- > 0 && node !== rootNode) {
-    if (node.dataset?.droptarget !== undefined) {
+    if (node.dataset?.droptarget !== undefined)
       return node;
-    }
     node = node.parentNode;
   }
   return null;
@@ -2809,63 +2893,6 @@ class DragInfo {
   }
 }
 
-// src/util/parsectx.js
-class ParseCtxClassSetCollector extends ParseContext {
-  constructor(...args) {
-    super(...args);
-    this.classes = new Set;
-  }
-  _addClasses(s) {
-    for (const v of s.split(/\s+/)) {
-      this.classes.add(v);
-    }
-  }
-  enterMacro(macroName, macroVars, macroSlots) {
-    const { DOMParser: DP, Text, Comment, nodes, events, macroNodes } = this;
-    const frame = { macroName, macroVars, macroSlots };
-    const v = new ParseCtxClassSetCollector(DP, Text, Comment, nodes, events, macroNodes, frame, this);
-    v.classes = this.classes;
-    return v;
-  }
-  onAttributes(attrs, _wrapperAttrs, _textChild) {
-    if (Array.isArray(attrs.items)) {
-      for (const attr of attrs.items) {
-        if (attr.name !== "class") {
-          continue;
-        }
-        const { val, thenVal, elseVal } = attr;
-        if (thenVal !== undefined) {
-          this._maybeAddVal(thenVal);
-          this._maybeAddVal(elseVal);
-        } else {
-          this._maybeAddVal(val);
-        }
-      }
-    } else {
-      const attr = attrs.items.class;
-      if (attr) {
-        this._addClasses(attr);
-      }
-    }
-  }
-  _maybeAddVal(value) {
-    if (!this._maybeAddStrTpl(value) && typeof value?.val === "string") {
-      this._addClasses(value.val);
-    }
-  }
-  _maybeAddStrTpl(value) {
-    if (value?.vals !== undefined) {
-      for (const val of value.vals) {
-        if (val instanceof ConstVal && val.val !== "") {
-          this._addClasses(val.val);
-        }
-      }
-      return true;
-    }
-    return false;
-  }
-}
-
 // deps/immutable.js
 function invariant(condition, error) {
   if (!condition)
@@ -7260,14 +7287,11 @@ class Field {
     return { type, defaultValue: dv?.toJS ? dv.toJS() : dv };
   }
   getFirstFailingCheck(v) {
-    if (!this.typeCheck.isValid(v)) {
+    if (!this.typeCheck.isValid(v))
       return this.typeCheck;
-    }
-    for (const check of this.checks) {
-      if (!check.isValid(v)) {
+    for (const check of this.checks)
+      if (!check.isValid(v))
         return check;
-      }
-    }
     return null;
   }
   isValid(v) {
@@ -7278,9 +7302,8 @@ class Field {
     return this;
   }
   coerceOr(v, defaultValue = null) {
-    if (this.isValid(v)) {
+    if (this.isValid(v))
       return v;
-    }
     const v1 = this.coercer(v);
     return this.isValid(v1) ? v1 : defaultValue;
   }
@@ -7438,9 +7461,8 @@ function extendProtoForKeyed(proto, name, uname) {
   proto[`updateIn${uname}At`] = function(i, fn) {
     const col = this.get(name);
     const v = col.get(i, NONE2);
-    if (v !== NONE2) {
+    if (v !== NONE2)
       return this.set(name, col.set(i, fn(v)));
-    }
     console.warn("key", i, "not found in", name, col);
     return this;
   };
@@ -7540,19 +7562,17 @@ class ClassBuilder {
         const args = {};
         for (const key in inArgs) {
           const field = fields[key];
-          if (compFields.has(key)) {
+          if (compFields.has(key))
             args[key] = mkCompField(field, opts.scope, inArgs[key]);
-          } else if (field === undefined) {
+          else if (field === undefined) {
             console.warn("extra argument to constructor:", name, key, inArgs);
             continue;
           }
           args[key] = field.coerceOrDefault(inArgs[key]);
         }
-        for (const key of compFields) {
-          if (args[key] === undefined) {
+        for (const key of compFields)
+          if (args[key] === undefined)
             args[key] = mkCompField(fields[key], opts.scope, inArgs[key]);
-          }
-        }
         return this(args);
       }
     };
@@ -7579,9 +7599,8 @@ class ClassBuilder {
     return this._mergeProto(this._statics, proto, "static");
   }
   _mergeProto(target, proto, _name) {
-    for (const k in proto) {
+    for (const k in proto)
       target[k] = proto[k];
-    }
     return this;
   }
   addField(name, dval, FieldCls) {
@@ -7613,48 +7632,48 @@ function classFromData(name, { fields = {}, methods, statics }) {
   for (const field in fields) {
     const value = fields[field];
     const type = typeof value;
-    if (type === "string") {
+    if (type === "string")
       b.addField(field, value, FieldString);
-    } else if (type === "number") {
+    else if (type === "number")
       b.addField(field, value, FieldFloat);
-    } else if (type === "boolean") {
+    else if (type === "boolean")
       b.addField(field, value, FieldBool);
-    } else if (List.isList(value) || Array.isArray(value)) {
+    else if (List.isList(value) || Array.isArray(value))
       b.addField(field, List(value), FieldList);
-    } else if (Set2.isSet(value) || value instanceof Set) {
+    else if (Set2.isSet(value) || value instanceof Set)
       b.addField(field, Set2(value), FieldSet);
-    } else if (OrderedMap.isOrderedMap(value)) {
+    else if (OrderedMap.isOrderedMap(value))
       b.addField(field, value, FieldOMap);
-    } else if (value?.type && value?.defaultValue !== undefined) {
+    else if (value?.type && value?.defaultValue !== undefined) {
       const Field2 = fieldsByTypeName[value.type] ?? FieldAny;
       b.addField(field, new Field2().coerceOr(value.defaultValue), Field2);
-    } else if (value?.component && value?.args !== undefined) {
+    } else if (value?.component && value?.args !== undefined)
       b.addCompField(field, value.component, value.args);
-    } else if (Map2.isMap(value) || value?.constructor === Object) {
+    else if (Map2.isMap(value) || value?.constructor === Object)
       b.addField(field, Map2(value), FieldMap);
-    } else {
+    else {
       const Field2 = fieldsByClass.get(value?.constructor) ?? FieldAny;
       b.addField(field, value, Field2);
     }
   }
-  if (methods) {
+  if (methods)
     b.methods(methods);
-  }
-  if (statics) {
+  if (statics)
     b.statics(statics);
-  }
   return b.build();
 }
-var component = (opts) => new Component(opts.name ?? "Comp", classFromData(opts.name, opts), opts.view ?? "Not Defined", opts.views, opts.style, opts.commonStyle ?? "", opts.globalStyle ?? "", opts.computed, opts.input, opts.logic, opts.bubble, opts.response, opts.alter, opts.dynamic, opts.on);
+var component = (opts) => new Component(classFromData(opts.name, opts), opts);
 
 // src/renderer.js
 var DATASET_ATTRS = ["nid", "cid", "eid", "vid", "si", "sk"];
 
 class Renderer {
-  constructor(comps, getSeqInfo, cache) {
+  constructor(comps) {
     this.comps = comps;
-    this.getSeqInfo = getSeqInfo ?? basicGetSeqInfo;
-    this.cache = cache ?? new WeakMapDomCache;
+    this.cache = new WeakMapDomCache;
+  }
+  getSeqInfo(seq) {
+    return isIndexed(seq) ? imIndexedIter : isKeyed(seq) ? imKeyedIter : seqInfoByClass.get(seq?.constructor) ?? unkIter;
   }
   renderTag(tag, attrs, childs) {
     return h(tag, attrs, childs);
@@ -7670,18 +7689,17 @@ class Renderer {
   }
   renderToDOM(stack, val) {
     const rootNode = document.createElement("div");
-    render(h("div", null, [this.renderRoot(stack, val)]), rootNode, { document });
+    const rOpts = { document };
+    render(h("div", null, [this.renderRoot(stack, val)]), rootNode, rOpts);
     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) {
+      for (const { dataset } of nodes)
+        for (const name of DATASET_ATTRS)
           delete dataset[name];
-        }
-      }
     }
     return dom.innerHTML;
   }
@@ -7697,9 +7715,8 @@ class Renderer {
   _rValComp(stack, val, comp, nid, key, viewName) {
     const cacheKey = `${viewName ?? stack.viewsId ?? ""}${nid}-${key}`;
     const cachedNode = this.cache.get(val, cacheKey);
-    if (cachedNode) {
+    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)]);
@@ -7711,60 +7728,58 @@ class Renderer {
   }
   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)) {
+    this.getSeqInfo(seq)(seq, (key, value, attrName) => {
       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);
       }
-    }
+    });
     return r;
   }
   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 it = stack.it;
+    this.getSeqInfo(seq)(seq, (key, value, attrName) => {
+      if (filter.call(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 {
+          enricher.call(it, bindings, key, value, iterData);
+          cachedNode = this.cache.get2(it, value, cacheKey);
+        } else
           cachedNode = this.cache.get(value, cacheKey);
-        }
         if (cachedNode) {
           this.pushEachEntry(r, nid, attrName, key, cachedNode);
-          continue;
+          return;
         }
         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 {
+        if (enricher)
+          this.cache.set2(it, value, cacheKey, dom);
+        else
           this.cache.set(value, cacheKey, dom);
-        }
       }
-    }
+    });
     return r;
   }
   renderView(view, stack) {
-    if (stack.binds.tail !== null) {
-      for (const binds of stack.binds.tail) {
-        if (!binds.isFrame)
-          continue;
-        if (stack.it !== binds.it)
+    let n = stack.binds[1];
+    while (n !== null) {
+      const b = n[0];
+      if (b.isFrame) {
+        if (stack.it !== b.it)
           break;
-        console.error("recursion detected", stack.it, binds.it);
+        console.error("recursion detected", stack.it, b.it);
         return new VComment("RECURSION AVOIDED");
       }
+      n = n[1];
     }
     return view.render(stack, this);
   }
@@ -7772,22 +7787,17 @@ class Renderer {
     return new VComment(`§${JSON.stringify(info)}§`);
   }
 }
-function* imIndexedEntries(seq) {
+var imIndexedIter = (seq, visit) => {
   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];
-}
+    visit(i++, v, "si");
+};
+var imKeyedIter = (seq, visit) => {
+  for (const [k, v] of seq.toSeq().entries())
+    visit(k, v, "sk");
+};
+var unkIter = () => {};
 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;
-}
 
 // extra/klist.js
 class KList {
@@ -7880,21 +7890,16 @@ class FieldKList extends Field {
   }
 }
 fieldsByClass.set(KList, FieldKList);
-function* klistEntries(seq) {
-  for (const k of seq.order) {
-    yield [k, seq.items.get(k)];
-  }
-}
-seqInfoByClass.set(KList, ["data-sk", klistEntries]);
+seqInfoByClass.set(KList, (seq, visit) => {
+  for (const k of seq.order)
+    visit(k, seq.items.get(k), "data-sk");
+});
 // index.js
 var css = String.raw;
 var html = String.raw;
-function macro(defaults, rawView) {
-  return new Macro(defaults, rawView);
-}
-var toNode = (nodeOrSelector) => typeof nodeOrSelector === "string" ? document.querySelector(nodeOrSelector) : nodeOrSelector;
+var macro = (defaults, rawView) => new Macro(defaults, rawView);
 function tutuca(nodeOrSelector) {
-  const rootNode = toNode(nodeOrSelector);
+  const rootNode = typeof nodeOrSelector === "string" ? document.querySelector(nodeOrSelector) : nodeOrSelector;
   const comps = new Components;
   const renderer = new Renderer(comps);
   return new App(rootNode, comps, renderer, ParseContext);
@@ -7915,9 +7920,8 @@ async function compileClassesToStyleText(app, compileClasses, extraCSSClasses, C
   for (const Comp of app.comps.byId.values()) {
     for (const key in Comp.views) {
       const view = Comp.views[key];
-      for (const name of view.ctx.classes) {
+      for (const name of view.ctx.classes)
         classes.add(name);
-      }
     }
   }
   return await compileClasses(Array.from(classes));
@@ -8143,6 +8147,7 @@ class LintParseContext extends ParseContext {
     this.attrs.push({ attrs, wrapperAttrs, textChild });
   }
 }
+
 // dev.js
 class LintClassCollectorCtx extends ParseCtxClassSetCollector {
   constructor(...args) {