@geajs/vite-plugin 1.0.4 → 1.0.6

package/dist/index.js

@@ -1,6 +1,6 @@
 // src/index.ts
-import babelGenerator from "@babel/generator";
-import babelTraverse from "@babel/traverse";
+import babelGenerator2 from "@babel/generator";
+import babelTraverse2 from "@babel/traverse";
 
 // src/parse.ts
 import { parse } from "@babel/parser";
@@ -183,8 +183,10 @@ import * as t3 from "@babel/types";
 import { id as id2, js, jsExpr } from "eszter";
 
 // src/utils.ts
+import babelTraverse from "@babel/traverse";
 import * as t2 from "@babel/types";
 import { id, jsImport } from "eszter";
+var traverse2 = typeof babelTraverse.default === "function" ? babelTraverse.default : babelTraverse;
 function getJSXTagName(name) {
   if (t2.isJSXIdentifier(name)) return name.name;
   if (t2.isJSXMemberExpression(name)) {
@@ -238,31 +240,31 @@ function getDirectChildElements(children) {
   });
 }
 function ensureImport(ast, source, specifier, isDefault = false) {
-  const program9 = ast.program;
+  const program10 = ast.program;
   const buildSpecifier = () => isDefault ? t2.importDefaultSpecifier(t2.identifier(specifier)) : t2.importSpecifier(t2.identifier(specifier), t2.identifier(specifier));
   if (isDefault) {
-    const alreadyHasDefault = program9.body.some(
+    const alreadyHasDefault = program10.body.some(
       (node) => t2.isImportDeclaration(node) && node.source.value === source && node.specifiers.some((s) => t2.isImportDefaultSpecifier(s))
     );
     if (alreadyHasDefault) return false;
     const insertIndex = Math.max(
       0,
-      program9.body.reduce((idx, node, i) => t2.isImportDeclaration(node) ? i + 1 : idx, 0)
+      program10.body.reduce((idx, node, i) => t2.isImportDeclaration(node) ? i + 1 : idx, 0)
     );
-    program9.body.splice(
+    program10.body.splice(
       insertIndex,
       0,
       isDefault ? jsImport`import ${id(specifier)} from ${source};` : jsImport`import { ${id(specifier)} } from ${source};`
     );
     return true;
   }
-  const declaration = program9.body.find((node) => t2.isImportDeclaration(node) && node.source.value === source);
+  const declaration = program10.body.find((node) => t2.isImportDeclaration(node) && node.source.value === source);
   if (!declaration) {
     const insertIndex = Math.max(
       0,
-      program9.body.reduce((idx, node, i) => t2.isImportDeclaration(node) ? i + 1 : idx, 0)
+      program10.body.reduce((idx, node, i) => t2.isImportDeclaration(node) ? i + 1 : idx, 0)
     );
-    program9.body.splice(insertIndex, 0, jsImport`import { ${id(specifier)} } from ${source};`);
+    program10.body.splice(insertIndex, 0, jsImport`import { ${id(specifier)} } from ${source};`);
     return true;
   }
   const exists = declaration.specifiers.some(
@@ -345,11 +347,7 @@ function resolvePath(expr, stateRefs, context = {}) {
     return { parts: [] };
   }
   if (t2.isCallExpression(expr) && t2.isMemberExpression(expr.callee)) {
-    return resolvePath(
-      expr.callee.object,
-      stateRefs,
-      context
-    );
+    return resolvePath(expr.callee.object, stateRefs, context);
   }
   if (t2.isMemberExpression(expr)) {
     const objectResult = resolvePath(
@@ -450,6 +448,10 @@ function collectAllIdentifierNames(statements, fromIndex, additionalNodes) {
       walk(node.object);
       return;
     }
+    if (t2.isVariableDeclarator(node)) {
+      walk(node.init);
+      return;
+    }
     for (const key of t2.VISITOR_KEYS[node.type] || []) {
       const child = node[key];
       if (Array.isArray(child)) {
@@ -489,6 +491,418 @@ function pruneUnusedSetupDestructuring(setupStatements, bodyNodes) {
 function replacePropRefsInExpression(expr, propNames, wholeParamName, propDefaults) {
   return replacePropRefsInNode(expr, propNames, wholeParamName, propDefaults);
 }
+function isThisPropsMember(node) {
+  return t2.isMemberExpression(node) && !node.computed && t2.isThisExpression(node.object) && t2.isIdentifier(node.property, { name: "props" });
+}
+function replaceThisPropsRootWithValueParam(expr, propName) {
+  const visit = (e) => {
+    if (t2.isMemberExpression(e) && !e.computed && isThisPropsMember(e.object) && t2.isIdentifier(e.property, { name: propName })) {
+      return t2.identifier("value");
+    }
+    if (t2.isMemberExpression(e)) {
+      return t2.memberExpression(visit(e.object), e.property, e.computed);
+    }
+    if (t2.isOptionalMemberExpression(e)) {
+      return t2.optionalMemberExpression(
+        visit(e.object),
+        e.property,
+        e.computed,
+        e.optional
+      );
+    }
+    if (t2.isOptionalCallExpression(e)) {
+      return t2.optionalCallExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a),
+        e.optional
+      );
+    }
+    if (t2.isCallExpression(e)) {
+      return t2.callExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    if (t2.isConditionalExpression(e)) {
+      return t2.conditionalExpression(visit(e.test), visit(e.consequent), visit(e.alternate));
+    }
+    if (t2.isLogicalExpression(e)) {
+      return t2.logicalExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isBinaryExpression(e)) {
+      return t2.binaryExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isUnaryExpression(e)) {
+      return t2.unaryExpression(e.operator, visit(e.argument), e.prefix);
+    }
+    if (t2.isSequenceExpression(e)) {
+      return t2.sequenceExpression(e.expressions.map((x) => visit(x)));
+    }
+    if (t2.isAssignmentExpression(e)) {
+      return t2.assignmentExpression(e.operator, e.left, visit(e.right));
+    }
+    if (t2.isArrayExpression(e)) {
+      return t2.arrayExpression(
+        e.elements.map((el) => {
+          if (el === null) return null;
+          if (t2.isSpreadElement(el)) return t2.spreadElement(visit(el.argument));
+          return visit(el);
+        })
+      );
+    }
+    if (t2.isObjectExpression(e)) {
+      return t2.objectExpression(
+        e.properties.map((p) => {
+          if (t2.isSpreadElement(p)) return t2.spreadElement(visit(p.argument));
+          if (t2.isObjectProperty(p)) {
+            return t2.objectProperty(
+              p.computed ? visit(p.key) : p.key,
+              visit(p.value),
+              p.computed,
+              p.shorthand
+            );
+          }
+          return p;
+        })
+      );
+    }
+    if (t2.isTemplateLiteral(e)) {
+      return t2.templateLiteral(
+        e.quasis,
+        e.expressions.map((x) => visit(x))
+      );
+    }
+    if (t2.isTaggedTemplateExpression(e)) {
+      return t2.taggedTemplateExpression(visit(e.tag), visit(e.quasi));
+    }
+    if (t2.isNewExpression(e)) {
+      return t2.newExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    return e;
+  };
+  return visit(expr);
+}
+function derivedExprGuardsValueWhenNullish(expr) {
+  if (!t2.isConditionalExpression(expr)) return false;
+  return testBranchesOnValueNullish(expr.test);
+}
+function unwrapExpressionRoot(e) {
+  let x = e;
+  while (t2.isParenthesizedExpression(x)) x = x.expression;
+  while (t2.isTSAsExpression(x) || t2.isTSSatisfiesExpression(x)) x = x.expression;
+  return x;
+}
+function expressionAccessesValueProperties(expr, setupStmts, valueId = "value") {
+  const body = [...setupStmts ?? []];
+  if (expr) body.push(t2.expressionStatement(expr));
+  const program10 = t2.program([t2.blockStatement(body)]);
+  let found = false;
+  traverse2(program10, {
+    noScope: true,
+    MemberExpression(path) {
+      if (found) return;
+      const obj = unwrapExpressionRoot(path.node.object);
+      if (t2.isIdentifier(obj, { name: valueId })) {
+        found = true;
+        path.stop();
+      }
+    }
+  });
+  return found;
+}
+function earlyReturnFalsyBindingName(guard) {
+  if (t2.isUnaryExpression(guard) && guard.operator === "!" && t2.isIdentifier(guard.argument)) {
+    return guard.argument.name;
+  }
+  if (t2.isBinaryExpression(guard) && (guard.operator === "==" || guard.operator === "===")) {
+    const nullish = (e) => t2.isNullLiteral(e) || t2.isIdentifier(e) && e.name === "undefined";
+    if (t2.isIdentifier(guard.left) && nullish(guard.right)) return guard.left.name;
+    if (t2.isIdentifier(guard.right) && nullish(guard.left)) return guard.right.name;
+  }
+  if (t2.isLogicalExpression(guard) && guard.operator === "||") {
+    return earlyReturnFalsyBindingName(guard.left) || earlyReturnFalsyBindingName(guard.right);
+  }
+  return null;
+}
+function optionalizeMemberChainsFromBindingRoot(expr, rootName) {
+  const visit = (e) => {
+    if (t2.isMemberExpression(e) && !e.computed) {
+      const obj = visit(e.object);
+      if (t2.isIdentifier(e.object, { name: rootName })) {
+        return t2.optionalMemberExpression(e.object, e.property, false, true);
+      }
+      if (t2.isOptionalMemberExpression(obj)) {
+        return t2.optionalMemberExpression(obj, e.property, false, true);
+      }
+      return t2.memberExpression(obj, e.property, false);
+    }
+    if (t2.isOptionalMemberExpression(e)) {
+      return t2.optionalMemberExpression(
+        visit(e.object),
+        e.property,
+        e.computed,
+        e.optional
+      );
+    }
+    if (t2.isOptionalCallExpression(e)) {
+      return t2.optionalCallExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a),
+        e.optional
+      );
+    }
+    if (t2.isCallExpression(e)) {
+      return t2.callExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    if (t2.isConditionalExpression(e)) {
+      return t2.conditionalExpression(visit(e.test), visit(e.consequent), visit(e.alternate));
+    }
+    if (t2.isLogicalExpression(e)) {
+      return t2.logicalExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isBinaryExpression(e)) {
+      return t2.binaryExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isUnaryExpression(e)) {
+      return t2.unaryExpression(e.operator, visit(e.argument), e.prefix);
+    }
+    if (t2.isSequenceExpression(e)) {
+      return t2.sequenceExpression(e.expressions.map((x) => visit(x)));
+    }
+    if (t2.isAssignmentExpression(e)) {
+      return t2.assignmentExpression(e.operator, e.left, visit(e.right));
+    }
+    if (t2.isArrayExpression(e)) {
+      return t2.arrayExpression(
+        e.elements.map((el) => {
+          if (el === null) return null;
+          if (t2.isSpreadElement(el)) return t2.spreadElement(visit(el.argument));
+          return visit(el);
+        })
+      );
+    }
+    if (t2.isObjectExpression(e)) {
+      return t2.objectExpression(
+        e.properties.map((p) => {
+          if (t2.isSpreadElement(p)) return t2.spreadElement(visit(p.argument));
+          if (t2.isObjectProperty(p)) {
+            return t2.objectProperty(
+              p.computed ? visit(p.key) : p.key,
+              visit(p.value),
+              p.computed,
+              p.shorthand
+            );
+          }
+          return p;
+        })
+      );
+    }
+    if (t2.isTemplateLiteral(e)) {
+      return t2.templateLiteral(
+        e.quasis,
+        e.expressions.map((x) => visit(x))
+      );
+    }
+    if (t2.isTaggedTemplateExpression(e)) {
+      return t2.taggedTemplateExpression(visit(e.tag), visit(e.quasi));
+    }
+    if (t2.isNewExpression(e)) {
+      return t2.newExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    return e;
+  };
+  return visit(expr);
+}
+function optionalizeBindingRootInStatements(stmts, rootName) {
+  const mapStmt = (s) => {
+    if (t2.isVariableDeclaration(s)) {
+      return t2.variableDeclaration(
+        s.kind,
+        s.declarations.map(
+          (d) => t2.variableDeclarator(d.id, d.init ? optionalizeMemberChainsFromBindingRoot(d.init, rootName) : null)
+        )
+      );
+    }
+    if (t2.isExpressionStatement(s)) {
+      return t2.expressionStatement(optionalizeMemberChainsFromBindingRoot(s.expression, rootName));
+    }
+    if (t2.isReturnStatement(s)) {
+      return t2.returnStatement(s.argument ? optionalizeMemberChainsFromBindingRoot(s.argument, rootName) : null);
+    }
+    if (t2.isBlockStatement(s)) {
+      return t2.blockStatement(s.body.map(mapStmt));
+    }
+    if (t2.isIfStatement(s)) {
+      return t2.ifStatement(
+        optionalizeMemberChainsFromBindingRoot(s.test, rootName),
+        mapStmt(s.consequent),
+        s.alternate ? mapStmt(s.alternate) : null
+      );
+    }
+    return s;
+  };
+  return stmts.map((s) => mapStmt(t2.cloneNode(s, true)));
+}
+function optionalizeMemberChainsAfterComputedItemKey(expr, itemKeyName) {
+  const visit = (e) => {
+    if (t2.isMemberExpression(e) && !e.computed) {
+      const origObj = e.object;
+      const inner = visit(origObj);
+      if (t2.isMemberExpression(origObj) && origObj.computed && t2.isIdentifier(origObj.property, { name: itemKeyName })) {
+        return t2.optionalMemberExpression(inner, e.property, false, true);
+      }
+      if (t2.isOptionalMemberExpression(inner)) {
+        return t2.optionalMemberExpression(inner, e.property, false, true);
+      }
+      return t2.memberExpression(inner, e.property, false);
+    }
+    if (t2.isMemberExpression(e) && e.computed) {
+      return t2.memberExpression(
+        visit(e.object),
+        visit(e.property),
+        true
+      );
+    }
+    if (t2.isOptionalMemberExpression(e)) {
+      return t2.optionalMemberExpression(
+        visit(e.object),
+        e.property,
+        e.computed,
+        e.optional
+      );
+    }
+    if (t2.isOptionalCallExpression(e)) {
+      return t2.optionalCallExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a),
+        e.optional
+      );
+    }
+    if (t2.isCallExpression(e)) {
+      return t2.callExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    if (t2.isConditionalExpression(e)) {
+      return t2.conditionalExpression(visit(e.test), visit(e.consequent), visit(e.alternate));
+    }
+    if (t2.isLogicalExpression(e)) {
+      return t2.logicalExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isBinaryExpression(e)) {
+      return t2.binaryExpression(e.operator, visit(e.left), visit(e.right));
+    }
+    if (t2.isUnaryExpression(e)) {
+      return t2.unaryExpression(e.operator, visit(e.argument), e.prefix);
+    }
+    if (t2.isSequenceExpression(e)) {
+      return t2.sequenceExpression(e.expressions.map((x) => visit(x)));
+    }
+    if (t2.isAssignmentExpression(e)) {
+      return t2.assignmentExpression(e.operator, e.left, visit(e.right));
+    }
+    if (t2.isArrayExpression(e)) {
+      return t2.arrayExpression(
+        e.elements.map((el) => {
+          if (el === null) return null;
+          if (t2.isSpreadElement(el)) return t2.spreadElement(visit(el.argument));
+          return visit(el);
+        })
+      );
+    }
+    if (t2.isObjectExpression(e)) {
+      return t2.objectExpression(
+        e.properties.map((p) => {
+          if (t2.isSpreadElement(p)) return t2.spreadElement(visit(p.argument));
+          if (t2.isObjectProperty(p)) {
+            return t2.objectProperty(
+              p.computed ? visit(p.key) : p.key,
+              visit(p.value),
+              p.computed,
+              p.shorthand
+            );
+          }
+          return p;
+        })
+      );
+    }
+    if (t2.isTemplateLiteral(e)) {
+      return t2.templateLiteral(
+        e.quasis,
+        e.expressions.map((x) => visit(x))
+      );
+    }
+    if (t2.isTaggedTemplateExpression(e)) {
+      return t2.taggedTemplateExpression(visit(e.tag), visit(e.quasi));
+    }
+    if (t2.isNewExpression(e)) {
+      return t2.newExpression(
+        visit(e.callee),
+        e.arguments.map((a) => t2.isExpression(a) ? visit(a) : a)
+      );
+    }
+    if (t2.isParenthesizedExpression(e)) {
+      return t2.parenthesizedExpression(visit(e.expression));
+    }
+    return e;
+  };
+  return visit(expr);
+}
+function optionalizeComputedItemKeyInStatements(stmts, itemKeyName) {
+  const mapStmt = (s) => {
+    if (t2.isVariableDeclaration(s)) {
+      return t2.variableDeclaration(
+        s.kind,
+        s.declarations.map(
+          (d) => t2.variableDeclarator(d.id, d.init ? optionalizeMemberChainsAfterComputedItemKey(d.init, itemKeyName) : null)
+        )
+      );
+    }
+    if (t2.isExpressionStatement(s)) {
+      return t2.expressionStatement(optionalizeMemberChainsAfterComputedItemKey(s.expression, itemKeyName));
+    }
+    if (t2.isReturnStatement(s)) {
+      return t2.returnStatement(s.argument ? optionalizeMemberChainsAfterComputedItemKey(s.argument, itemKeyName) : null);
+    }
+    if (t2.isBlockStatement(s)) {
+      return t2.blockStatement(s.body.map(mapStmt));
+    }
+    if (t2.isIfStatement(s)) {
+      return t2.ifStatement(
+        optionalizeMemberChainsAfterComputedItemKey(s.test, itemKeyName),
+        mapStmt(s.consequent),
+        s.alternate ? mapStmt(s.alternate) : null
+      );
+    }
+    return s;
+  };
+  return stmts.map((s) => mapStmt(t2.cloneNode(s, true)));
+}
+function testBranchesOnValueNullish(test) {
+  if (t2.isIdentifier(test, { name: "value" })) return true;
+  if (t2.isBinaryExpression(test) && ["==", "===", "!=", "!=="].includes(test.operator)) {
+    const isValue = (e) => t2.isIdentifier(e, { name: "value" });
+    const isNullishLit = (e) => t2.isNullLiteral(e) || t2.isIdentifier(e) && e.name === "undefined";
+    return isValue(test.left) && isNullishLit(test.right) || isValue(test.right) && isNullishLit(test.left);
+  }
+  if (t2.isUnaryExpression(test) && test.operator === "!" && t2.isIdentifier(test.argument, { name: "value" })) {
+    return true;
+  }
+  if (t2.isLogicalExpression(test)) {
+    return testBranchesOnValueNullish(test.left) || testBranchesOnValueNullish(test.right);
+  }
+  return false;
+}
 function replacePropRefsInNode(node, propNames, wholeParamName, propDefaults) {
   if (t2.isIdentifier(node) && wholeParamName && node.name === wholeParamName) {
     return t2.memberExpression(t2.thisExpression(), t2.identifier("props"));
@@ -632,6 +1046,17 @@ function replacePropRefsInNode(node, propNames, wholeParamName, propDefaults) {
   }
   return node;
 }
+function loggingCatchClause(extra = []) {
+  return t2.catchClause(
+    t2.identifier("__err"),
+    t2.blockStatement([
+      t2.expressionStatement(
+        t2.callExpression(t2.memberExpression(t2.identifier("console"), t2.identifier("error")), [t2.identifier("__err")])
+      ),
+      ...extra
+    ])
+  );
+}
 
 // src/hmr.ts
 import { createRequire as createRequire2 } from "module";
@@ -781,6 +1206,14 @@ function resolveExpr(expr, stateRefs) {
       }
     }
   }
+  if (t4.isTemplateLiteral(expr)) {
+    for (const inner of expr.expressions) {
+      if (t4.isExpression(inner)) {
+        const result = resolveExpr(inner, stateRefs);
+        if (result?.parts?.length) return result;
+      }
+    }
+  }
   return null;
 }
 function applyImportedState(binding, result, stateProps) {
@@ -855,7 +1288,8 @@ function normalizeDestructuredMapCallback(arrowFn) {
     const rewriteNode2 = (node) => {
       if (!node || typeof node !== "object") return;
       for (const key of Object.keys(node)) {
-        if (key === "type" || key === "start" || key === "end" || key === "loc" || key === "leadingComments" || key === "trailingComments" || key === "innerComments") continue;
+        if (key === "type" || key === "start" || key === "end" || key === "loc" || key === "leadingComments" || key === "trailingComments" || key === "innerComments")
+          continue;
         const child = node[key];
         if (Array.isArray(child)) {
           for (let i = 0; i < child.length; i++) {
@@ -863,7 +1297,11 @@ function normalizeDestructuredMapCallback(arrowFn) {
               if (t4.isIdentifier(child[i]) && indexMap.has(child[i].name)) {
                 if (t4.isMemberExpression(node) && key === "property" && !node.computed) continue;
                 if (t4.isObjectProperty(node) && key === "key") continue;
-                child[i] = t4.memberExpression(t4.identifier(itemName), t4.numericLiteral(indexMap.get(child[i].name)), true);
+                child[i] = t4.memberExpression(
+                  t4.identifier(itemName),
+                  t4.numericLiteral(indexMap.get(child[i].name)),
+                  true
+                );
               } else {
                 rewriteNode2(child[i]);
               }
@@ -873,7 +1311,11 @@ function normalizeDestructuredMapCallback(arrowFn) {
           if (t4.isIdentifier(child) && indexMap.has(child.name)) {
             if (t4.isMemberExpression(node) && key === "property" && !node.computed) continue;
             if (t4.isObjectProperty(node) && key === "key") continue;
-            node[key] = t4.memberExpression(t4.identifier(itemName), t4.numericLiteral(indexMap.get(child.name)), true);
+            node[key] = t4.memberExpression(
+              t4.identifier(itemName),
+              t4.numericLiteral(indexMap.get(child.name)),
+              true
+            );
           } else {
             rewriteNode2(child);
           }
@@ -896,7 +1338,8 @@ function normalizeDestructuredMapCallback(arrowFn) {
   const rewriteNode = (node) => {
     if (!node || typeof node !== "object") return;
     for (const key of Object.keys(node)) {
-      if (key === "type" || key === "start" || key === "end" || key === "loc" || key === "leadingComments" || key === "trailingComments" || key === "innerComments") continue;
+      if (key === "type" || key === "start" || key === "end" || key === "loc" || key === "leadingComments" || key === "trailingComments" || key === "innerComments")
+        continue;
       const child = node[key];
       if (Array.isArray(child)) {
         for (let i = 0; i < child.length; i++) {
@@ -1002,7 +1445,7 @@ function detectContainerSelector(node, tagName) {
 // src/analyze-map.ts
 import { createRequire as createRequire3 } from "module";
 var require4 = createRequire3(import.meta.url);
-var traverse2 = require4("@babel/traverse").default;
+var traverse3 = require4("@babel/traverse").default;
 function analyzeJSXInMap(node, arrayPath, itemVar, itemBindings, relationalBindings, conditionalBindings, elementPath, isImportedState, itemIdProperty, stateRefs, childIndices = [], storeVar) {
   const context = { inMap: true, mapItemVar: itemVar };
   node.openingElement.attributes.forEach((attr) => {
@@ -1205,8 +1648,8 @@ function analyzeItemTemplateLiteral(expr, arrayPath, itemVar, itemBindings, rela
 function collectConditionalBindings(expr, type, attributeName, conditionalBindings, arrayPath, itemVar, elementPath, childPath, stateRefs, storeVar) {
   const dependencies = /* @__PURE__ */ new Map();
   const requiresRerender = conditionalExpressionRequiresRerender(expr);
-  const program9 = t5.program([t5.expressionStatement(t5.cloneNode(expr, true))]);
-  traverse2(program9, {
+  const program10 = t5.program([t5.expressionStatement(t5.cloneNode(expr, true))]);
+  traverse3(program10, {
     noScope: true,
     MemberExpression(path) {
       const parent = path.parentPath;
@@ -1249,8 +1692,8 @@ function collectConditionalBindings(expr, type, attributeName, conditionalBindin
 }
 function conditionalExpressionRequiresRerender(expr) {
   let needsRerender = false;
-  const program9 = t5.program([t5.expressionStatement(t5.cloneNode(expr, true))]);
-  traverse2(program9, {
+  const program10 = t5.program([t5.expressionStatement(t5.cloneNode(expr, true))]);
+  traverse3(program10, {
     noScope: true,
     JSXElement(path) {
       needsRerender = true;
@@ -1345,7 +1788,7 @@ function extractClassName(node) {
 import * as t6 from "@babel/types";
 import { createRequire as createRequire4 } from "module";
 var require5 = createRequire4(import.meta.url);
-var traverse3 = require5("@babel/traverse").default;
+var traverse4 = require5("@babel/traverse").default;
 function buildComponentPropsExpression(jsxElement, imports, componentInstances, eventHandlers, stateRefs, templateSetupContext, transformExpression, transformFragment) {
   const props = [];
   const dependencies = /* @__PURE__ */ new Map();
@@ -1358,7 +1801,9 @@ function buildComponentPropsExpression(jsxElement, imports, componentInstances,
     else if (t6.isJSXExpressionContainer(attr.value) && !t6.isJSXEmptyExpression(attr.value.expression)) {
       const expr = attr.value.expression;
       propValue = transformExpression(expr);
-      if (propValue && (/^on[A-Z]/.test(propName) || /^(click|input|change|submit|focus|blur|keydown|keyup|keypress|mousedown|mouseup|mouseover|mouseout|mouseenter|mouseleave|touchstart|touchend|touchmove|pointerdown|pointerup|pointermove|scroll|resize|drag|dragstart|dragend|dragover|drop|reset)$/.test(propName)) && t6.isMemberExpression(propValue)) {
+      if (propValue && (/^on[A-Z]/.test(propName) || /^(click|input|change|submit|focus|blur|keydown|keyup|keypress|mousedown|mouseup|mouseover|mouseout|mouseenter|mouseleave|touchstart|touchend|touchmove|pointerdown|pointerup|pointermove|scroll|resize|drag|dragstart|dragend|dragover|drop|reset)$/.test(
+        propName
+      )) && t6.isMemberExpression(propValue)) {
         const argsId = t6.identifier("args");
         propValue = t6.arrowFunctionExpression(
           [t6.restElement(argsId)],
@@ -1430,11 +1875,11 @@ function collectExpressionDependenciesInto(expr, stateRefs, dependencies, setupS
       });
     });
   });
-  const program9 = t6.program([
+  const program10 = t6.program([
     ...setupStatements.map((statement) => t6.cloneNode(statement, true)),
     t6.expressionStatement(t6.cloneNode(expr, true))
   ]);
-  traverse3(program9, {
+  traverse4(program10, {
     noScope: true,
     MemberExpression(path) {
       const parent = path.parentPath;
@@ -1514,6 +1959,28 @@ function collectTemplateSetupStatements(expr, templateSetupContext) {
   };
   collectReferencedIdentifiers(expr).forEach(includeName);
   ordered.sort((a, b) => a.index - b.index);
+  const barrier = templateSetupContext.earlyReturnBarrierIndex;
+  if (barrier !== void 0 && ordered.length > 0) {
+    const stmtIndices = ordered.filter((e) => e.index >= 0).map((e) => e.index);
+    if (stmtIndices.length > 0) {
+      const maxIdx = Math.max(...stmtIndices);
+      const minIdx = Math.min(...stmtIndices);
+      if (maxIdx > barrier || minIdx <= barrier) {
+        const have = new Set(ordered.map((e) => e.index));
+        const extra = [];
+        for (let bi = 0; bi <= barrier; bi++) {
+          if (!have.has(bi)) {
+            extra.push({
+              index: bi,
+              statement: t6.cloneNode(templateSetupContext.statements[bi], true)
+            });
+          }
+        }
+        ordered.push(...extra);
+        ordered.sort((a, b) => a.index - b.index);
+      }
+    }
+  }
   for (const entry of ordered) {
     if (entry.index !== -1) continue;
     if (!t6.isVariableDeclaration(entry.statement)) continue;
@@ -1559,10 +2026,10 @@ function collectPatternIdentifiers(pattern) {
 }
 function collectReferencedIdentifiers(node) {
   const names = /* @__PURE__ */ new Set();
-  const program9 = t6.program([
+  const program10 = t6.program([
     t6.isStatement(node) ? t6.cloneNode(node, true) : t6.expressionStatement(t6.cloneNode(node, true))
   ]);
-  traverse3(program9, {
+  traverse4(program10, {
     noScope: true,
     Identifier(path) {
       if (!path.isReferencedIdentifier()) return;
@@ -1575,7 +2042,7 @@ function collectReferencedIdentifiers(node) {
 // src/analyze.ts
 import { createRequire as createRequire5 } from "module";
 var require6 = createRequire5(import.meta.url);
-var traverse4 = require6("@babel/traverse").default;
+var traverse5 = require6("@babel/traverse").default;
 function buildTextTemplateExpressionFromParts(textTemplate, textExpressions) {
   const templateParts = textTemplate.split(/\$\{(\d+)\}/g);
   const quasis = [];
@@ -1668,16 +2135,8 @@ function analyzeTemplate(templateMethod, stateRefs, classBody2) {
       conditionalSlotScopedStoreKeys: /* @__PURE__ */ new Set(),
       conditionalSlotNodeMap: /* @__PURE__ */ new Map()
     };
-  let earlyReturnGuard;
   const bodyStmts = templateMethod.body.body;
-  for (let i = 0; i < bodyStmts.length - 1; i++) {
-    const s = bodyStmts[i];
-    if (t7.isIfStatement(s) && !s.alternate && t7.isBlockStatement(s.consequent) && s.consequent.body.length === 1 && t7.isReturnStatement(s.consequent.body[0]) && s.consequent.body[0].argument && t7.isReturnStatement(bodyStmts[i + 1])) {
-      earlyReturnGuard = t7.cloneNode(s.test, true);
-      break;
-    }
-  }
-  const returnStmt = templateMethod.body.body.find((s) => t7.isReturnStatement(s) && s.argument !== null);
+  const returnStmt = bodyStmts.find((s) => t7.isReturnStatement(s) && s.argument !== null);
   if (!returnStmt?.argument)
     return {
       bindings,
@@ -1693,7 +2152,25 @@ function analyzeTemplate(templateMethod, stateRefs, classBody2) {
       conditionalSlotScopedStoreKeys: /* @__PURE__ */ new Set(),
       conditionalSlotNodeMap: /* @__PURE__ */ new Map()
     };
-  const returnIndex = templateMethod.body.body.indexOf(returnStmt);
+  const returnIndex = bodyStmts.indexOf(returnStmt);
+  let earlyReturnGuard;
+  let earlyReturnBarrierIndex;
+  const earlyReturnFromIf = (s) => {
+    if (t7.isReturnStatement(s.consequent) && s.consequent.argument) return s.consequent;
+    if (t7.isBlockStatement(s.consequent) && s.consequent.body.length === 1 && t7.isReturnStatement(s.consequent.body[0]) && s.consequent.body[0].argument) {
+      return s.consequent.body[0];
+    }
+    return null;
+  };
+  for (let i = 0; i < returnIndex; i++) {
+    const s = bodyStmts[i];
+    if (!t7.isIfStatement(s) || s.alternate) continue;
+    const earlyRet = earlyReturnFromIf(s);
+    if (!earlyRet?.argument) continue;
+    earlyReturnGuard = t7.cloneNode(s.test, true);
+    earlyReturnBarrierIndex = i;
+    break;
+  }
   const templateSetupContext = {
     params: templateMethod.params.filter(
       (param) => !t7.isTSParameterProperty(param)
@@ -1818,7 +2295,8 @@ function analyzeTemplate(templateMethod, stateRefs, classBody2) {
     elementPathToBindingId,
     conditionalSlotScopedStoreKeys,
     conditionalSlotNodeMap,
-    earlyReturnGuard
+    earlyReturnGuard,
+    earlyReturnBarrierIndex
   };
 }
 function computeConditionalSlotScopedStoreKeys(conditionalSlots, stateProps, stateRefs, templateSetupContext) {
@@ -1973,8 +2451,24 @@ function collectTextChildren(node, stateRefs, stateProps) {
       const expr = child.expression;
       const isMap = t7.isCallExpression(expr) && t7.isMemberExpression(expr.callee) && t7.isIdentifier(expr.callee.property) && expr.callee.property.name === "map";
       if (!isMap) {
-        textChildren.push({ type: "expression", expression: expr });
-        hasExpr = true;
+        if (t7.isTemplateLiteral(expr)) {
+          for (let i = 0; i < expr.quasis.length; i++) {
+            const quasi = expr.quasis[i];
+            if (quasi.value.raw) {
+              textChildren.push({ type: "text", value: quasi.value.raw });
+            }
+            if (i < expr.expressions.length) {
+              const innerExpr = expr.expressions[i];
+              if (t7.isExpression(innerExpr)) {
+                textChildren.push({ type: "expression", expression: innerExpr });
+                hasExpr = true;
+              }
+            }
+          }
+        } else {
+          textChildren.push({ type: "expression", expression: expr });
+          hasExpr = true;
+        }
       }
     }
   });
@@ -2123,8 +2617,8 @@ function isMapCall(expr) {
 function collectNestedMapCalls(expr) {
   if (t7.isJSXEmptyExpression(expr)) return [];
   const maps = [];
-  const program9 = t7.program([t7.expressionStatement(t7.cloneNode(expr, true))]);
-  traverse4(program9, {
+  const program10 = t7.program([t7.expressionStatement(t7.cloneNode(expr, true))]);
+  traverse5(program10, {
     noScope: true,
     CallExpression(path) {
       if (isMapCall(path.node)) {
@@ -2623,12 +3117,12 @@ function buildDerivedPropBindings(expr, type, attributeName, elementPath, propsP
 }
 function collectDependentPropNames(expr, setupStatements, propsParamName, destructuredPropNames, classBody2) {
   const names = /* @__PURE__ */ new Set();
-  const program9 = t7.program([
+  const program10 = t7.program([
     ...setupStatements.map((statement) => t7.cloneNode(statement, true)),
     t7.expressionStatement(t7.cloneNode(expr, true))
   ]);
   const getterNamesToExpand = /* @__PURE__ */ new Set();
-  traverse4(program9, {
+  traverse5(program10, {
     noScope: true,
     Identifier(path) {
       if (!path.isReferencedIdentifier()) return;
@@ -2647,7 +3141,7 @@ function collectDependentPropNames(expr, setupStatements, propsParamName, destru
       if (!t7.isClassMethod(member) || member.kind !== "get" || !t7.isIdentifier(member.key) || !getterNamesToExpand.has(member.key.name))
         continue;
       const getterProgram = t7.program(member.body.body.map((s) => t7.cloneNode(s, true)));
-      traverse4(getterProgram, {
+      traverse5(getterProgram, {
         noScope: true,
         Identifier(path) {
           if (!path.isReferencedIdentifier()) return;
@@ -2671,13 +3165,17 @@ function collectDependentPropNames(expr, setupStatements, propsParamName, destru
 function collectAllStateAccesses(templateMethod, stateRefs, stateProps) {
   const params = templateMethod.params.filter((param) => !t7.isTSParameterProperty(param));
   const prog = t7.program([t7.expressionStatement(t7.arrowFunctionExpression(params, templateMethod.body))]);
-  traverse4(prog, {
+  traverse5(prog, {
     noScope: true,
     Identifier(path) {
       if (!stateRefs.has(path.node.name)) return;
       const ref = stateRefs.get(path.node.name);
-      if (path.parentPath && t7.isMemberExpression(path.parentPath.node) && path.parentPath.node.object === path.node)
-        return;
+      if (path.parentPath && t7.isMemberExpression(path.parentPath.node) && path.parentPath.node.object === path.node && t7.isIdentifier(path.parentPath.node.property) && !path.parentPath.node.computed) {
+        const grandParent = path.parentPath.parentPath;
+        if (!(grandParent && t7.isCallExpression(grandParent.node) && grandParent.node.callee === path.parentPath.node)) {
+          return;
+        }
+      }
       if (ref.kind === "local-destructured" && ref.propName) {
         const observeKey = buildObserveKey([ref.propName]);
         if (!stateProps.has(observeKey)) stateProps.set(observeKey, [ref.propName]);
@@ -2686,11 +3184,8 @@ function collectAllStateAccesses(templateMethod, stateRefs, stateProps) {
       if (ref.kind === "imported-destructured" && ref.propName && ref.storeVar) {
         const storeRef = stateRefs.get(ref.storeVar);
         if (storeRef?.getterDeps?.has(ref.propName)) {
-          const depPaths = storeRef.getterDeps.get(ref.propName);
-          for (const depPath of depPaths) {
-            const observeKey = buildObserveKey(depPath, ref.storeVar);
-            if (!stateProps.has(observeKey)) stateProps.set(observeKey, [...depPath]);
-          }
+          const observeKey = buildObserveKey([ref.propName], ref.storeVar);
+          if (!stateProps.has(observeKey)) stateProps.set(observeKey, [ref.propName]);
         } else if (storeRef?.reactiveFields?.has(ref.propName)) {
           const observeKey = buildObserveKey([ref.propName], ref.storeVar);
           if (!stateProps.has(observeKey)) stateProps.set(observeKey, [ref.propName]);
@@ -2730,7 +3225,7 @@ function collectAllStateAccesses(templateMethod, stateRefs, stateProps) {
 function collectItemTemplateStoreDependencies(itemTemplate, itemVar, stateRefs, dependencies) {
   if (!itemTemplate) return;
   const prog = t7.program([t7.expressionStatement(t7.cloneNode(itemTemplate, true))]);
-  traverse4(prog, {
+  traverse5(prog, {
     noScope: true,
     MemberExpression(path) {
       let root = path.node;
@@ -2890,7 +3385,8 @@ function extractSingleCallExpression(expr) {
 }
 function getHoistableRootEvent(attrName, expr, elementPath, context, selector) {
   if (elementPath.length !== 0 || !selector) return null;
-  if (attrName.startsWith("data-") || attrName === "class" || attrName === "className" || attrName === "style" || attrName === "id") return null;
+  if (attrName.startsWith("data-") || attrName === "class" || attrName === "className" || attrName === "style" || attrName === "id")
+    return null;
   const eventType = toGeaEventType(attrName);
   const directProp = resolvePropCallbackName(expr, context);
   if (directProp) return { eventType, propName: directProp, selector };
@@ -3146,6 +3642,46 @@ function pascalToKebabCase(tagName) {
 function camelToKebab2(name) {
   return name.replace(/([A-Z])/g, "-$1").toLowerCase();
 }
+function tryStaticClassObjectToString(expr) {
+  const parts = [];
+  for (const prop of expr.properties) {
+    if (!t9.isObjectProperty(prop) || prop.computed) return null;
+    const key = t9.isIdentifier(prop.key) ? prop.key.name : t9.isStringLiteral(prop.key) ? prop.key.value : null;
+    if (!key) return null;
+    if (t9.isBooleanLiteral(prop.value)) {
+      if (prop.value.value) parts.push(key);
+    } else {
+      return null;
+    }
+  }
+  return parts.join(" ");
+}
+function buildClassObjectExpression(expr) {
+  return t9.callExpression(
+    t9.memberExpression(
+      t9.callExpression(
+        t9.memberExpression(
+          t9.callExpression(
+            t9.memberExpression(
+              t9.callExpression(t9.memberExpression(t9.identifier("Object"), t9.identifier("entries")), [expr]),
+              t9.identifier("filter")
+            ),
+            [
+              t9.arrowFunctionExpression(
+                [t9.arrayPattern([t9.identifier("__k"), t9.identifier("__v")])],
+                t9.identifier("__v")
+              )
+            ]
+          ),
+          t9.identifier("map")
+        ),
+        [t9.arrowFunctionExpression([t9.arrayPattern([t9.identifier("__k")])], t9.identifier("__k"))]
+      ),
+      t9.identifier("join")
+    ),
+    [t9.stringLiteral(" ")]
+  );
+}
 function tryStaticStyleObjectToCSS(expr) {
   const parts = [];
   for (const prop of expr.properties) {
@@ -3176,10 +3712,10 @@ function buildStyleObjectExpression(expr) {
             t9.templateElement({ raw: "", cooked: "" }, true)
           ],
           [
-            t9.callExpression(
-              t9.memberExpression(t9.identifier("__k"), t9.identifier("replace")),
-              [t9.regExpLiteral("[A-Z]", "g"), t9.stringLiteral("-$&")]
-            ),
+            t9.callExpression(t9.memberExpression(t9.identifier("__k"), t9.identifier("replace")), [
+              t9.regExpLiteral("[A-Z]", "g"),
+              t9.stringLiteral("-$&")
+            ]),
             t9.conditionalExpression(
               t9.logicalExpression(
                 "&&",
@@ -3223,20 +3759,20 @@ function extractHtmlTemplatesFromConditional(expr) {
   }
   return {};
 }
-function extractEnsureChildCall(expr) {
+function extractChildInstanceRef(expr) {
   if (!t9.isLogicalExpression(expr) || expr.operator !== "&&") return null;
   const right = expr.right;
-  let ensureCallExpr = null;
+  let memberExpr = null;
   if (t9.isTemplateLiteral(right) && right.expressions.length === 1) {
-    ensureCallExpr = right.expressions[0];
-  } else if (t9.isCallExpression(right)) {
-    ensureCallExpr = right;
+    const inner = right.expressions[0];
+    if (t9.isMemberExpression(inner)) memberExpr = inner;
+  } else if (t9.isMemberExpression(right)) {
+    memberExpr = right;
   }
-  if (!ensureCallExpr || !t9.isCallExpression(ensureCallExpr) || !t9.isMemberExpression(ensureCallExpr.callee) || !t9.isThisExpression(ensureCallExpr.callee.object) || !t9.isIdentifier(ensureCallExpr.callee.property) || !ensureCallExpr.callee.property.name.startsWith("__ensureChild_"))
+  if (!memberExpr || !t9.isThisExpression(memberExpr.object) || !t9.isIdentifier(memberExpr.property) || !memberExpr.property.name.startsWith("_"))
     return null;
-  const ensureMethod = ensureCallExpr.callee.property.name;
-  const instanceVar = "_" + ensureMethod.replace("__ensureChild_", "");
-  return { instanceVar, ensureMethod, guardExpr: expr.left };
+  const instanceVar = memberExpr.property.name;
+  return { instanceVar, guardExpr: expr.left };
 }
 function expressionMayBeFalsy(expr) {
   if (t9.isLogicalExpression(expr) && expr.operator === "&&") return true;
@@ -3251,6 +3787,7 @@ function canBeBoolean(expr) {
 }
 function isAlwaysTruthy(expr) {
   if (t9.isStringLiteral(expr) || t9.isNumericLiteral(expr) || t9.isTemplateLiteral(expr)) return true;
+  if (t9.isObjectExpression(expr) || t9.isArrayExpression(expr)) return true;
   if (t9.isConditionalExpression(expr)) return isAlwaysTruthy(expr.consequent) && isAlwaysTruthy(expr.alternate);
   return false;
 }
@@ -3500,10 +4037,7 @@ function replaceJSXInExpression(node, mapJSXNodes, ctx) {
       );
     }
     const newBody = replaceJSXInExpression(callee.body, mapJSXNodes, ctx);
-    return t9.callExpression(
-      t9.arrowFunctionExpression(callee.params, newBody, callee.async),
-      node.arguments
-    );
+    return t9.callExpression(t9.arrowFunctionExpression(callee.params, newBody, callee.async), node.arguments);
   }
   return node;
 }
@@ -3629,13 +4163,7 @@ function processElement(node, parts, ctx, elementPath = []) {
       pushString(parts, "");
       parts.push({
         type: "expression",
-        value: t9.callExpression(
-          t9.memberExpression(
-            t9.thisExpression(),
-            t9.identifier(`__ensureChild_${instance.instanceVar.replace(/^_/, "")}`)
-          ),
-          []
-        )
+        value: t9.memberExpression(t9.thisExpression(), t9.identifier(instance.instanceVar))
       });
       return;
     }
@@ -3860,6 +4388,21 @@ function processElement(node, parts, ctx, elementPath = []) {
           err.__geaCompileError = true;
           throw err;
         }
+        if (propAttrName === "class" && t9.isObjectExpression(rawExpr)) {
+          const staticClass = tryStaticClassObjectToString(rawExpr);
+          if (staticClass !== null) {
+            if (staticClass) {
+              html += ` class="${staticClass}"`;
+            }
+            return;
+          }
+          parts.push({ type: "string", value: html });
+          const classExpr = buildClassObjectExpression(rawExpr);
+          parts.push({ type: "string", value: ` class="` });
+          parts.push({ type: "expression", value: classExpr });
+          html = '"';
+          return;
+        }
         if (propAttrName === "style" && t9.isObjectExpression(rawExpr)) {
           const staticCSS = tryStaticStyleObjectToCSS(rawExpr);
           if (staticCSS) {
@@ -3872,27 +4415,33 @@ function processElement(node, parts, ctx, elementPath = []) {
             [t9.stringLiteral("; ")]
           );
           const skipCondition2 = buildAttrSkipCondition(styleExpr, rawExpr);
-          parts.push({
-            type: "expression",
-            value: t9.conditionalExpression(
-              skipCondition2,
-              t9.stringLiteral(""),
-              t9.templateLiteral(
-                [
-                  t9.templateElement({ raw: ' style="', cooked: ' style="' }, false),
-                  t9.templateElement({ raw: '"', cooked: '"' }, true)
-                ],
-                [styleExpr]
+          if (t9.isBooleanLiteral(skipCondition2) && !skipCondition2.value) {
+            parts.push({ type: "string", value: ` style="` });
+            parts.push({ type: "expression", value: styleExpr });
+            html = '"';
+          } else {
+            parts.push({
+              type: "expression",
+              value: t9.conditionalExpression(
+                skipCondition2,
+                t9.stringLiteral(""),
+                t9.templateLiteral(
+                  [
+                    t9.templateElement({ raw: ' style="', cooked: ' style="' }, false),
+                    t9.templateElement({ raw: '"', cooked: '"' }, true)
+                  ],
+                  [styleExpr]
+                )
               )
-            )
-          });
-          html = "";
+            });
+            html = "";
+          }
           return;
         }
         parts.push({ type: "string", value: html });
         const expr = transformJSXExpression(rawExpr, ctx);
         const skipCondition = buildAttrSkipCondition(expr, rawExpr);
-        const templateExpr = propAttrName === "class" ? t9.callExpression(t9.memberExpression(expr, t9.identifier("trim")), []) : expr;
+        const templateExpr = expr;
         if (t9.isBooleanLiteral(skipCondition) && !skipCondition.value) {
           parts.push({ type: "string", value: ` ${propAttrName}="` });
           parts.push({ type: "expression", value: templateExpr });
@@ -4000,7 +4549,7 @@ function processChildren(children, parts, ctx, elementPath, dcCursor, directChil
         let expr = transformJSXExpression(rawExpr, ctx);
         const stateSlots = ctx.stateChildSlots;
         const stateCounter = ctx.stateChildSlotCounter;
-        const childCallInfo = stateSlots && stateCounter && expressionMayBeFalsy(rawExpr) ? extractEnsureChildCall(expr) : null;
+        const childCallInfo = stateSlots && stateCounter && expressionMayBeFalsy(rawExpr) ? extractChildInstanceRef(expr) : null;
         if (childCallInfo && stateSlots && stateCounter) {
           const markerId = `sc${stateCounter.value}`;
           stateCounter.value++;
@@ -4008,7 +4557,6 @@ function processChildren(children, parts, ctx, elementPath, dcCursor, directChil
           stateSlots.push({
             markerId,
             childInstanceVar: childCallInfo.instanceVar,
-            ensureMethodName: childCallInfo.ensureMethod,
             guardExpr: childCallInfo.guardExpr,
             dependencies: collectExpressionDependencies(childCallInfo.guardExpr, ctx.stateRefs, setupStatements)
           });
@@ -4120,12 +4668,7 @@ function ensureMapItemHelper(classBody2, ctx, helperName) {
     if (ctx.arrayPathParts.length === 0) return base;
     const [, ...rest] = ctx.arrayPathParts;
     const isIndex = /^\d+$/.test(first);
-    const optionalFirst = t10.optionalMemberExpression(
-      base,
-      isIndex ? t10.numericLiteral(Number(first)) : t10.identifier(first),
-      isIndex,
-      true
-    );
+    const optionalFirst = ctx.isImportedState ? t10.memberExpression(base, isIndex ? t10.numericLiteral(Number(first)) : t10.identifier(first), isIndex) : t10.optionalMemberExpression(base, isIndex ? t10.numericLiteral(Number(first)) : t10.identifier(first), isIndex, true);
     return rest.length > 0 ? buildMemberChainFromParts(optionalFirst, rest) : optionalFirst;
   })();
   const findPredicate = ctx.itemIdProperty && ctx.itemIdProperty !== ITEM_IS_KEY ? t10.arrowFunctionExpression(
@@ -4146,7 +4689,11 @@ function ensureMapItemHelper(classBody2, ctx, helperName) {
     )
   ) : t10.arrowFunctionExpression(
     [t10.identifier("_"), t10.identifier("__i")],
-    t10.binaryExpression("===", t10.callExpression(t10.identifier("String"), [t10.identifier("__i")]), t10.identifier("__itemId"))
+    t10.binaryExpression(
+      "===",
+      t10.callExpression(t10.identifier("String"), [t10.identifier("__i")]),
+      t10.identifier("__itemId")
+    )
   );
   const method = jsMethod`${id3(helperName)}(e) {
     const __el = e.target.closest('[data-gea-item-id]');
@@ -4472,13 +5019,13 @@ function findClassMethod(classBody2, name) {
 
 // src/generate-components.ts
 import * as t11 from "@babel/types";
-import { appendToBody, id as id4, js as js2, jsMethod as jsMethod2 } from "eszter";
+import { appendToBody, id as id4, jsMethod as jsMethod2 } from "eszter";
 import { createRequire as createRequire6 } from "module";
 function childHasNoProps(child) {
   return t11.isObjectExpression(child.propsExpression) && child.propsExpression.properties.length === 0;
 }
 var require7 = createRequire6(import.meta.url);
-var traverse5 = require7("@babel/traverse").default;
+var traverse6 = require7("@babel/traverse").default;
 function getDirectPropMappings(child, templatePropNames) {
   if (!child.propsExpression || !t11.isObjectExpression(child.propsExpression)) return null;
   const mappings = [];
@@ -4496,9 +5043,10 @@ function injectChildComponents(ast, componentInstances, directForwardingChildren
   if (componentInstances.size === 0) return;
   const childComponents = Array.from(componentInstances.values()).flat();
   const constructionOrder = [...childComponents].sort((a, b) => (b.dfsIndex ?? 0) - (a.dfsIndex ?? 0));
-  const instanceStatements = buildInstanceStatements(constructionOrder);
+  const instanceStatements = buildInstanceStatements(constructionOrder, directForwardingChildren);
+  const lazyChildren = constructionOrder.filter((child) => child.lazy);
   let injected = false;
-  traverse5(ast, {
+  traverse6(ast, {
     ClassDeclaration(path) {
       if (!t11.isIdentifier(path.node.superClass)) return;
       const existingCtor = path.node.body.body.find(
@@ -4516,22 +5064,68 @@ function injectChildComponents(ast, componentInstances, directForwardingChildren
         path.node.body.body.unshift(ctor);
         injected = true;
       }
+      for (const child of lazyChildren) {
+        const isDirect = directForwardingChildren?.has(child.instanceVar);
+        const noProps = childHasNoProps(child);
+        const hasPropsBuilder = !isDirect && !noProps;
+        const backingField = `__lazy${child.instanceVar}`;
+        let propsArg;
+        if (hasPropsBuilder) {
+          propsArg = t11.callExpression(
+            t11.memberExpression(t11.thisExpression(), t11.identifier(getPropsBuilderMethodName(child))),
+            []
+          );
+        } else if (child.directMappings && child.directMappings.length > 0) {
+          propsArg = t11.objectExpression(
+            child.directMappings.map(
+              (m) => t11.objectProperty(
+                t11.identifier(m.childPropName),
+                t11.memberExpression(
+                  t11.memberExpression(t11.thisExpression(), t11.identifier("props")),
+                  t11.identifier(m.parentPropName)
+                )
+              )
+            )
+          );
+        } else {
+          propsArg = t11.objectExpression([]);
+        }
+        const getter = t11.classMethod(
+          "get",
+          t11.identifier(child.instanceVar),
+          [],
+          t11.blockStatement([
+            t11.ifStatement(
+              t11.unaryExpression("!", t11.memberExpression(t11.thisExpression(), t11.identifier(backingField))),
+              t11.expressionStatement(
+                t11.assignmentExpression(
+                  "=",
+                  t11.memberExpression(t11.thisExpression(), t11.identifier(backingField)),
+                  t11.callExpression(t11.memberExpression(t11.thisExpression(), t11.identifier("__child")), [
+                    t11.identifier(child.tagName),
+                    propsArg
+                  ])
+                )
+              )
+            ),
+            t11.returnStatement(t11.memberExpression(t11.thisExpression(), t11.identifier(backingField)))
+          ])
+        );
+        path.node.body.body.push(getter);
+      }
       childComponents.forEach((child) => {
         const isDirect = directForwardingChildren?.has(child.instanceVar);
         const noProps = childHasNoProps(child);
         const hasPropsBuilder = !isDirect && !noProps;
         if (hasPropsBuilder) {
           path.node.body.body.push(buildPropsBuilderMethod(child));
-          path.node.body.body.push(buildRefreshMethod(child));
         }
-        path.node.body.body.push(buildEnsureMethod(child, hasPropsBuilder));
       });
-      ensureDisposeMethod(path.node.body, childComponents);
     }
   });
 }
 function injectComponentRegistrations(ast, componentInstances) {
-  traverse5(ast, {
+  traverse6(ast, {
     ClassMethod(path) {
       if (!t11.isIdentifier(path.node.key) || path.node.key.name !== "template") return;
       const registrations = Array.from(componentInstances.keys()).map(
@@ -4545,22 +5139,55 @@ function injectComponentRegistrations(ast, componentInstances) {
     }
   });
 }
-function buildInstanceStatements(instances) {
+function buildInstanceStatements(instances, directForwardingChildren) {
   const stmts = [];
   instances.forEach((child) => {
-    stmts.push(js2`this.${id4(child.instanceVar)} = null;`);
-  });
-  return stmts;
-}
-function getPropsBuilderMethodName(child) {
-  return `__buildProps_${child.instanceVar.replace(/^_/, "")}`;
-}
-function getEnsureChildMethodName(child) {
-  return `__ensureChild_${child.instanceVar.replace(/^_/, "")}`;
-}
-function collectBindingNames(stmt) {
-  if (t11.isVariableDeclaration(stmt)) {
-    const names = [];
+    if (child.lazy) return;
+    let propsArg;
+    const isDirect = directForwardingChildren?.has(child.instanceVar);
+    const noProps = childHasNoProps(child);
+    const hasPropsBuilder = !isDirect && !noProps;
+    if (hasPropsBuilder) {
+      propsArg = t11.callExpression(
+        t11.memberExpression(t11.thisExpression(), t11.identifier(getPropsBuilderMethodName(child))),
+        []
+      );
+    } else if (child.directMappings && child.directMappings.length > 0) {
+      propsArg = t11.objectExpression(
+        child.directMappings.map(
+          (m) => t11.objectProperty(
+            t11.identifier(m.childPropName),
+            t11.memberExpression(
+              t11.memberExpression(t11.thisExpression(), t11.identifier("props")),
+              t11.identifier(m.parentPropName)
+            )
+          )
+        )
+      );
+    } else {
+      propsArg = t11.objectExpression([]);
+    }
+    stmts.push(
+      t11.expressionStatement(
+        t11.assignmentExpression(
+          "=",
+          t11.memberExpression(t11.thisExpression(), t11.identifier(child.instanceVar)),
+          t11.callExpression(t11.memberExpression(t11.thisExpression(), t11.identifier("__child")), [
+            t11.identifier(child.tagName),
+            propsArg
+          ])
+        )
+      )
+    );
+  });
+  return stmts;
+}
+function getPropsBuilderMethodName(child) {
+  return `__buildProps_${child.instanceVar.replace(/^_/, "")}`;
+}
+function collectBindingNames(stmt) {
+  if (t11.isVariableDeclaration(stmt)) {
+    const names = [];
     const collect = (node) => {
       if (t11.isIdentifier(node)) names.push(node.name);
       else if (t11.isObjectPattern(node))
@@ -4621,102 +5248,16 @@ function buildPropsBuilderMethod(child) {
   );
   if (hasPropsDestructure) {
     const tryBlock = t11.blockStatement([...prunedSetup, returnStmt]);
-    const catchBlock = t11.blockStatement([t11.returnStatement(t11.objectExpression([]))]);
-    const tryCatch = t11.tryStatement(tryBlock, t11.catchClause(null, catchBlock));
+    const tryCatch = t11.tryStatement(tryBlock, loggingCatchClause([t11.returnStatement(t11.objectExpression([]))]));
     return appendToBody(jsMethod2`${id4(getPropsBuilderMethodName(child))}() {}`, tryCatch);
   }
   return appendToBody(jsMethod2`${id4(getPropsBuilderMethodName(child))}() {}`, ...prunedSetup, returnStmt);
 }
-function buildEnsureMethod(child, hasPropsBuilder = true) {
-  let propsArg;
-  if (hasPropsBuilder && !childHasNoProps(child)) {
-    propsArg = t11.callExpression(
-      t11.memberExpression(t11.thisExpression(), t11.identifier(getPropsBuilderMethodName(child))),
-      []
-    );
-  } else if (child.directMappings && child.directMappings.length > 0) {
-    propsArg = t11.objectExpression(
-      child.directMappings.map(
-        (m) => t11.objectProperty(
-          t11.identifier(m.childPropName),
-          t11.memberExpression(
-            t11.memberExpression(t11.thisExpression(), t11.identifier("props")),
-            t11.identifier(m.parentPropName)
-          )
-        )
-      )
-    );
-  } else {
-    propsArg = t11.objectExpression([]);
-  }
-  const refreshPropsStmt = hasPropsBuilder && !childHasNoProps(child) ? t11.expressionStatement(
-    t11.callExpression(
-      t11.memberExpression(
-        t11.memberExpression(t11.thisExpression(), t11.identifier(child.instanceVar)),
-        t11.identifier("__geaUpdateProps")
-      ),
-      [
-        t11.callExpression(
-          t11.memberExpression(t11.thisExpression(), t11.identifier(getPropsBuilderMethodName(child))),
-          []
-        )
-      ]
-    )
-  ) : null;
-  return appendToBody(
-    jsMethod2`${id4(getEnsureChildMethodName(child))}() {}`,
-    t11.ifStatement(
-      t11.unaryExpression("!", t11.memberExpression(t11.thisExpression(), t11.identifier(child.instanceVar))),
-      t11.blockStatement([
-        t11.expressionStatement(
-          t11.assignmentExpression(
-            "=",
-            t11.memberExpression(t11.thisExpression(), t11.identifier(child.instanceVar)),
-            t11.newExpression(t11.identifier(child.tagName), [propsArg])
-          )
-        ),
-        js2`this.${id4(child.instanceVar)}.parentComponent = this;`,
-        js2`this.${id4(child.instanceVar)}.__geaCompiledChild = true;`
-      ]),
-      refreshPropsStmt ? t11.blockStatement([refreshPropsStmt]) : void 0
-    ),
-    t11.returnStatement(t11.memberExpression(t11.thisExpression(), t11.identifier(child.instanceVar)))
-  );
-}
-function buildRefreshMethod(child) {
-  const method = jsMethod2`${id4(`__refreshChildProps_${child.instanceVar.replace(/^_/, "")}`)}() {}`;
-  method.body.body.push(js2`const child = this.${id4(child.instanceVar)};`);
-  if (child.lazy) {
-    method.body.body.push(
-      t11.ifStatement(t11.unaryExpression("!", t11.identifier("child")), t11.blockStatement([t11.returnStatement()]))
-    );
-  } else {
-    method.body.body.push(
-      t11.ifStatement(t11.unaryExpression("!", t11.identifier("child")), t11.blockStatement([t11.returnStatement()]))
-    );
-  }
-  method.body.body.push(
-    js2`child.__geaUpdateProps(this.${id4(getPropsBuilderMethodName(child))}());`
-  );
-  return method;
-}
-function ensureDisposeMethod(classBody2, children) {
-  const disposeCalls = children.map((child) => js2`this.${id4(child.instanceVar)}?.dispose?.();`);
-  const existingDispose = classBody2.body.find(
-    (member) => t11.isClassMethod(member) && t11.isIdentifier(member.key) && member.key.name === "dispose"
-  );
-  if (existingDispose) {
-    existingDispose.body.body.unshift(...disposeCalls);
-    return;
-  }
-  classBody2.body.push(
-    appendToBody(jsMethod2`${id4("dispose")}() {}`, ...disposeCalls, js2`super.dispose();`)
-  );
-}
 
 // src/apply-reactivity.ts
+import babelGenerator from "@babel/generator";
 import * as t18 from "@babel/types";
-import { appendToBody as appendToBody5, id as id11, js as js7, jsBlockBody as jsBlockBody5, jsExpr as jsExpr5, jsMethod as jsMethod8 } from "eszter";
+import { appendToBody as appendToBody5, id as id11, js as js7, jsBlockBody as jsBlockBody4, jsExpr as jsExpr4, jsMethod as jsMethod8 } from "eszter";
 
 // src/generate-observe.ts
 import * as t13 from "@babel/types";
@@ -4727,7 +5268,7 @@ import * as t12 from "@babel/types";
 import { id as id5, js as js3, jsBlockBody as jsBlockBody2, jsExpr as jsExpr2 } from "eszter";
 import { createRequire as createRequire7 } from "module";
 var require8 = createRequire7(import.meta.url);
-var traverse6 = require8("@babel/traverse").default;
+var traverse7 = require8("@babel/traverse").default;
 function buildPathPartsEquals(expr, parts) {
   return parts.reduce(
     (acc, part, index) => t12.logicalExpression(
@@ -4773,10 +5314,7 @@ function buildValueExpression(textExpr, stateRefs) {
   }
   if (textExpr.isImportedState && textExpr.storeVar) {
     return buildMemberChainFromParts(
-      t12.memberExpression(
-        t12.memberExpression(t12.thisExpression(), t12.identifier("__stores")),
-        t12.identifier(textExpr.storeVar)
-      ),
+      t12.memberExpression(t12.identifier(textExpr.storeVar), t12.identifier("__store")),
       textExpr.pathParts
     );
   }
@@ -4784,7 +5322,7 @@ function buildValueExpression(textExpr, stateRefs) {
 }
 function rewriteStateRefs(expr, stateRefs) {
   const prog = t12.program([t12.expressionStatement(expr)]);
-  traverse6(prog, {
+  traverse7(prog, {
     noScope: true,
     Identifier(path) {
       if (path.parentPath && t12.isMemberExpression(path.parentPath.node) && path.parentPath.node.property === path.node)
@@ -4793,13 +5331,20 @@ function rewriteStateRefs(expr, stateRefs) {
       const ref = stateRefs.get(path.node.name);
       if (ref.kind === "local") {
         path.replaceWith(t12.thisExpression());
-      } else {
+      } else if (ref.kind === "imported-destructured" && ref.storeVar && ref.propName) {
         path.replaceWith(
           t12.memberExpression(
-            t12.memberExpression(t12.thisExpression(), t12.identifier("__stores")),
-            t12.identifier(path.node.name)
+            t12.memberExpression(t12.identifier(ref.storeVar), t12.identifier("__store")),
+            t12.identifier(ref.propName)
           )
         );
+        path.skip();
+      } else if (ref.kind === "local-destructured" && ref.propName) {
+        path.replaceWith(t12.memberExpression(t12.thisExpression(), t12.identifier(ref.propName)));
+        path.skip();
+      } else {
+        path.replaceWith(t12.memberExpression(t12.identifier(path.node.name), t12.identifier("__store")));
+        path.skip();
       }
     }
   });
@@ -4834,6 +5379,10 @@ function buildSimpleUpdate(binding, param, stateRefs) {
     const idx = t12.numericLiteral(binding.textNodeIndex);
     return js3`if (${el}) { const __tn = ${jsExpr2`${el}.childNodes[${idx}]`}; if (__tn && __tn.nodeValue !== ${valueExpr}) __tn.nodeValue = ${valueExpr}; }`;
   }
+  if (target === "textContent" && binding.bindingId && binding.bindingId !== "") {
+    const suffix = t12.stringLiteral(binding.bindingId);
+    return js3`${jsExpr2`this.__updateText(${suffix}, ${valueExpr})`};`;
+  }
   return js3`if (${el}) { ${jsExpr2`${el}.${id5(target)}`} = ${valueExpr}; }`;
 }
 function buildWildcardUpdate(binding, param, stateRefs) {
@@ -4976,7 +5525,7 @@ import * as t14 from "@babel/types";
 import { appendToBody as appendToBody2, id as id7, js as js4, jsMethod as jsMethod4 } from "eszter";
 import { createRequire as createRequire8 } from "module";
 var require9 = createRequire8(import.meta.url);
-var traverse7 = require9("@babel/traverse").default;
+var traverse8 = require9("@babel/traverse").default;
 var EVENT_NAMES = /* @__PURE__ */ new Set([
   "click",
   "dblclick",
@@ -5009,23 +5558,50 @@ var EVENT_NAMES = /* @__PURE__ */ new Set([
   "dragleave",
   "drop"
 ]);
-function collectItemTemplateProps(template, itemVar) {
-  const props = /* @__PURE__ */ new Set();
-  const program9 = t14.program([t14.expressionStatement(t14.cloneNode(template, true))]);
-  traverse7(program9, {
+function collectItemTemplatePropTree(template, itemVar) {
+  const tree = {};
+  const program10 = t14.program([t14.expressionStatement(t14.cloneNode(template, true))]);
+  traverse8(program10, {
     noScope: true,
     MemberExpression(path) {
-      if (!t14.isIdentifier(path.node.object, { name: itemVar })) return;
-      if (!t14.isIdentifier(path.node.property) || path.node.computed) return;
-      props.add(path.node.property.name);
+      const chain = [];
+      let node = path.node;
+      while (t14.isMemberExpression(node) && !node.computed && t14.isIdentifier(node.property)) {
+        chain.unshift(node.property.name);
+        node = node.object;
+      }
+      if (!t14.isIdentifier(node, { name: itemVar }) || chain.length === 0) return;
+      let cursor = tree;
+      for (let i = 0; i < chain.length; i++) {
+        const key = chain[i];
+        if (i === chain.length - 1) {
+          if (!(key in cursor)) cursor[key] = true;
+        } else {
+          if (!(key in cursor) || cursor[key] === true) cursor[key] = {};
+          cursor = cursor[key];
+        }
+      }
     }
   });
-  return Array.from(props);
+  return tree;
+}
+function buildDummyFromTree(tree, keyProp) {
+  const props = [];
+  for (const [key, value] of Object.entries(tree)) {
+    if (key === keyProp) {
+      props.push(t14.objectProperty(t14.identifier(key), t14.numericLiteral(0)));
+    } else if (value === true) {
+      props.push(t14.objectProperty(t14.identifier(key), t14.stringLiteral("")));
+    } else {
+      props.push(t14.objectProperty(t14.identifier(key), buildDummyFromTree(value, null)));
+    }
+  }
+  return t14.objectExpression(props);
 }
 function collectPatchEntries(arrayMap) {
   const cloned = t14.cloneNode(arrayMap.itemTemplate, true);
   const tempFile = t14.file(t14.program([t14.expressionStatement(cloned)]));
-  traverse7(tempFile, {
+  traverse8(tempFile, {
     Identifier(path) {
       if (path.node.name === arrayMap.itemVariable) path.node.name = "item";
       else if (arrayMap.indexVariable && path.node.name === arrayMap.indexVariable) path.node.name = "__idx";
@@ -5039,6 +5615,9 @@ function collectPatchEntries(arrayMap) {
     const rootIsComponent = isComponentTag(rootTagName);
     walkJSXForPatch(modified, [], entries, rootIsComponent);
   }
+  for (const ent of entries) {
+    ent.expression = optionalizeMemberChainsAfterComputedItemKey(ent.expression, "item");
+  }
   return { entries, requiresRerender };
 }
 function walkJSXForPatch(node, path, entries, rootIsComponent = false) {
@@ -5125,14 +5704,17 @@ function buildElementNavExpr(base, childPath) {
   }
   return expr;
 }
+function childPathRefName(path) {
+  return `__ref_${path.join("_")}`;
+}
 function hoistStoreReads(entries, storeVar) {
   if (!storeVar) return { hoists: [], patchedEntries: entries };
   const hoistMap = /* @__PURE__ */ new Map();
   let counter = 0;
   function replaceStoreReads(expr) {
     const cloned = t14.cloneNode(expr, true);
-    const program9 = t14.program([t14.expressionStatement(cloned)]);
-    traverse7(program9, {
+    const program10 = t14.program([t14.expressionStatement(cloned)]);
+    traverse8(program10, {
       noScope: true,
       MemberExpression(path) {
         if (!t14.isIdentifier(path.node.object, { name: storeVar })) return;
@@ -5147,7 +5729,7 @@ function hoistStoreReads(entries, storeVar) {
         path.replaceWith(t14.identifier(hoist.varName));
       }
     });
-    return program9.body[0].expression;
+    return program10.body[0].expression;
   }
   const patchedEntries = entries.map((entry) => ({
     ...entry,
@@ -5187,7 +5769,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
     if (setupVarNames.size > 0) {
       const freeVars = /* @__PURE__ */ new Set();
       for (const entry of entries) {
-        traverse7(t14.expressionStatement(t14.cloneNode(entry.expression, true)), {
+        traverse8(t14.expressionStatement(t14.cloneNode(entry.expression, true)), {
           noScope: true,
           Identifier(p) {
             if (t14.isMemberExpression(p.parent) && p.parent.property === p.node && !p.parent.computed) return;
@@ -5240,7 +5822,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
         if (!t14.isJSXExpressionContainer(attr.value) || t14.isJSXEmptyExpression(attr.value.expression)) continue;
         const exprClone = t14.cloneNode(attr.value.expression, true);
         const tempProg = t14.file(t14.program([t14.expressionStatement(exprClone)]));
-        traverse7(tempProg, {
+        traverse8(tempProg, {
           Identifier(path) {
             if (path.node.name === arrayMap.itemVariable) path.node.name = "item";
             else if (arrayMap.indexVariable && path.node.name === arrayMap.indexVariable) path.node.name = "__idx";
@@ -5259,7 +5841,8 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
                 else if (t14.isObjectPattern(decl.id)) {
                   for (const prop of decl.id.properties) {
                     if (t14.isObjectProperty(prop) && t14.isIdentifier(prop.value)) setupVarNames.add(prop.value.name);
-                    else if (t14.isRestElement(prop) && t14.isIdentifier(prop.argument)) setupVarNames.add(prop.argument.name);
+                    else if (t14.isRestElement(prop) && t14.isIdentifier(prop.argument))
+                      setupVarNames.add(prop.argument.name);
                   }
                 }
               }
@@ -5267,7 +5850,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
           }
           const propsRefsFreeVars = /* @__PURE__ */ new Set();
           for (const prop of propsProperties) {
-            traverse7(t14.expressionStatement(t14.cloneNode(prop.value, true)), {
+            traverse8(t14.expressionStatement(t14.cloneNode(prop.value, true)), {
               noScope: true,
               Identifier(p) {
                 if (t14.isMemberExpression(p.parent) && p.parent.property === p.node && !p.parent.computed) return;
@@ -5287,7 +5870,11 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
             for (const stmt of templateSetupContext.statements) {
               let clonedStmt = t14.cloneNode(stmt, true);
               if (propRefsNames.size > 0 || wholeParamName) {
-                clonedStmt = replacePropRefsInExpression(clonedStmt, propRefsNames, wholeParamName);
+                clonedStmt = replacePropRefsInExpression(
+                  clonedStmt,
+                  propRefsNames,
+                  wholeParamName
+                );
               }
               rerenderBody.push(clonedStmt);
             }
@@ -5309,7 +5896,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
   }
   if (entries.length === 0) return null;
   const { hoists, patchedEntries } = hoistStoreReads(entries, arrayMap.storeVar);
-  const itemProps = collectItemTemplateProps(arrayMap.itemTemplate, arrayMap.itemVariable);
+  const propTree = collectItemTemplatePropTree(arrayMap.itemTemplate, arrayMap.itemVariable);
   const containerRef = t14.memberExpression(t14.thisExpression(), t14.identifier(containerProp));
   const cVar = t14.identifier("__c");
   const elVar = t14.identifier("el");
@@ -5317,25 +5904,16 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
   body.push(t14.variableDeclaration("var", [t14.variableDeclarator(cVar, containerRef)]));
   const isPrimitiveKey = !itemIdProperty || itemIdProperty === ITEM_IS_KEY;
   const dummyItem = isPrimitiveKey ? t14.stringLiteral("__dummy__") : (() => {
-    const dummyProps = [];
-    const seen = /* @__PURE__ */ new Set();
-    for (const prop of [itemIdProperty, ...itemProps]) {
-      if (seen.has(prop)) continue;
-      seen.add(prop);
-      dummyProps.push(
-        t14.objectProperty(t14.identifier(prop), prop === itemIdProperty ? t14.numericLiteral(0) : t14.stringLiteral(""))
-      );
-    }
-    return t14.objectExpression(dummyProps);
+    if (itemIdProperty && !(itemIdProperty in propTree)) propTree[itemIdProperty] = true;
+    return buildDummyFromTree(propTree, itemIdProperty);
   })();
   const tplInit = [
     t14.variableDeclaration("var", [
       t14.variableDeclarator(
         t14.identifier("__tw"),
-        t14.callExpression(
-          t14.memberExpression(t14.identifier("document"), t14.identifier("createElement")),
-          [t14.stringLiteral("template")]
-        )
+        t14.callExpression(t14.memberExpression(t14.identifier("document"), t14.identifier("createElement")), [
+          t14.stringLiteral("template")
+        ])
       )
     ]),
     t14.expressionStatement(
@@ -5362,7 +5940,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
   body.push(
     t14.ifStatement(
       t14.unaryExpression("!", t14.memberExpression(cVar, t14.identifier("__geaTpl"))),
-      t14.blockStatement([t14.tryStatement(t14.blockStatement(tplInit), t14.catchClause(null, t14.blockStatement([])))])
+      t14.blockStatement([t14.tryStatement(t14.blockStatement(tplInit), loggingCatchClause())])
     )
   );
   if (arrayMap.containerBindingId) {
@@ -5401,10 +5979,9 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
         t14.variableDeclaration("var", [
           t14.variableDeclarator(
             t14.identifier("__fw"),
-            t14.callExpression(
-              t14.memberExpression(t14.identifier("document"), t14.identifier("createElement")),
-              [t14.stringLiteral("template")]
-            )
+            t14.callExpression(t14.memberExpression(t14.identifier("document"), t14.identifier("createElement")), [
+              t14.stringLiteral("template")
+            ])
           )
         ]),
         t14.expressionStatement(
@@ -5432,8 +6009,20 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
   for (const hoist of hoists) {
     body.push(t14.variableDeclaration("var", [t14.variableDeclarator(t14.identifier(hoist.varName), hoist.expression)]));
   }
+  const refMap = /* @__PURE__ */ new Map();
   for (const entry of patchedEntries) {
+    if (entry.childPath.length === 0) continue;
+    const key = entry.childPath.join("_");
+    if (refMap.has(key)) continue;
+    const refName = childPathRefName(entry.childPath);
     const navExpr = buildElementNavExpr(elVar, entry.childPath);
+    body.push(
+      t14.expressionStatement(t14.assignmentExpression("=", t14.memberExpression(elVar, t14.identifier(refName)), navExpr))
+    );
+    refMap.set(key, t14.memberExpression(elVar, t14.identifier(refName)));
+  }
+  for (const entry of patchedEntries) {
+    const navExpr = entry.childPath.length > 0 ? refMap.get(entry.childPath.join("_")) || buildElementNavExpr(elVar, entry.childPath) : elVar;
     switch (entry.type) {
       case "className":
         body.push(
@@ -5475,17 +6064,26 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
                       t14.memberExpression(
                         t14.callExpression(
                           t14.memberExpression(
-                            t14.callExpression(t14.memberExpression(t14.identifier("Object"), t14.identifier("entries")), [attrVal]),
+                            t14.callExpression(t14.memberExpression(t14.identifier("Object"), t14.identifier("entries")), [
+                              attrVal
+                            ]),
                             t14.identifier("map")
                           ),
                           [
                             t14.arrowFunctionExpression(
                               [t14.arrayPattern([t14.identifier("k"), t14.identifier("v")])],
-                              t14.binaryExpression("+", t14.binaryExpression(
+                              t14.binaryExpression(
                                 "+",
-                                t14.callExpression(t14.memberExpression(t14.identifier("k"), t14.identifier("replace")), [t14.regExpLiteral("[A-Z]", "g"), t14.stringLiteral("-$&")]),
-                                t14.stringLiteral(": ")
-                              ), t14.identifier("v"))
+                                t14.binaryExpression(
+                                  "+",
+                                  t14.callExpression(t14.memberExpression(t14.identifier("k"), t14.identifier("replace")), [
+                                    t14.regExpLiteral("[A-Z]", "g"),
+                                    t14.stringLiteral("-$&")
+                                  ]),
+                                  t14.stringLiteral(": ")
+                                ),
+                                t14.identifier("v")
+                              )
                             )
                           ]
                         ),
@@ -5561,7 +6159,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
       if (!t14.isJSXExpressionContainer(attr.value) || t14.isJSXEmptyExpression(attr.value.expression)) continue;
       const exprClone = t14.cloneNode(attr.value.expression, true);
       const tempProg = t14.file(t14.program([t14.expressionStatement(exprClone)]));
-      traverse7(tempProg, {
+      traverse8(tempProg, {
         Identifier(path) {
           if (path.node.name === arrayMap.itemVariable) path.node.name = "item";
           else if (arrayMap.indexVariable && path.node.name === arrayMap.indexVariable) path.node.name = "__idx";
@@ -5596,7 +6194,7 @@ function generateCreateItemMethod(arrayMap, templatePropNames, wholeParamName, t
 }
 function templateRequiresRerender(file2) {
   let requiresRerender = false;
-  traverse7(file2, {
+  traverse8(file2, {
     noScope: true,
     ConditionalExpression(path) {
       if (branchContainsJSX(path.node.consequent) || branchContainsJSX(path.node.alternate)) {
@@ -5615,8 +6213,8 @@ function templateRequiresRerender(file2) {
 }
 function branchContainsJSX(expr) {
   let containsJSX = false;
-  const program9 = t14.program([t14.expressionStatement(t14.cloneNode(expr, true))]);
-  traverse7(program9, {
+  const program10 = t14.program([t14.expressionStatement(t14.cloneNode(expr, true))]);
+  traverse8(program10, {
     noScope: true,
     JSXElement(path) {
       containsJSX = true;
@@ -5633,7 +6231,7 @@ function branchContainsJSX(expr) {
 // src/generate-array.ts
 import { createRequire as createRequire9 } from "module";
 var require10 = createRequire9(import.meta.url);
-var traverse8 = require10("@babel/traverse").default;
+var traverse9 = require10("@babel/traverse").default;
 function getArrayPathParts(arrayMap) {
   return arrayMap.arrayPathParts || normalizePathParts(arrayMap.arrayPath || "");
 }
@@ -5702,22 +6300,35 @@ function buildPropPatcherFunction(binding, propName) {
         "=",
         t15.memberExpression(t15.memberExpression(target, t15.identifier("style")), t15.identifier("cssText")),
         t15.conditionalExpression(
-          t15.binaryExpression("===", t15.unaryExpression("typeof", t15.identifier("__attrValue")), t15.stringLiteral("object")),
+          t15.binaryExpression(
+            "===",
+            t15.unaryExpression("typeof", t15.identifier("__attrValue")),
+            t15.stringLiteral("object")
+          ),
           t15.callExpression(
             t15.memberExpression(
               t15.callExpression(
                 t15.memberExpression(
-                  t15.callExpression(t15.memberExpression(t15.identifier("Object"), t15.identifier("entries")), [t15.identifier("__attrValue")]),
+                  t15.callExpression(t15.memberExpression(t15.identifier("Object"), t15.identifier("entries")), [
+                    t15.identifier("__attrValue")
+                  ]),
                   t15.identifier("map")
                 ),
                 [
                   t15.arrowFunctionExpression(
                     [t15.arrayPattern([t15.identifier("k"), t15.identifier("v")])],
-                    t15.binaryExpression("+", t15.binaryExpression(
+                    t15.binaryExpression(
                       "+",
-                      t15.callExpression(t15.memberExpression(t15.identifier("k"), t15.identifier("replace")), [t15.regExpLiteral("[A-Z]", "g"), t15.stringLiteral("-$&")]),
-                      t15.stringLiteral(": ")
-                    ), t15.identifier("v"))
+                      t15.binaryExpression(
+                        "+",
+                        t15.callExpression(t15.memberExpression(t15.identifier("k"), t15.identifier("replace")), [
+                          t15.regExpLiteral("[A-Z]", "g"),
+                          t15.stringLiteral("-$&")
+                        ]),
+                        t15.stringLiteral(": ")
+                      ),
+                      t15.identifier("v")
+                    )
                   )
                 ]
               ),
@@ -5783,8 +6394,8 @@ function buildPropPatcherFunction(binding, propName) {
 }
 function collectItemExpressionKeys(expr) {
   const keys = /* @__PURE__ */ new Set();
-  const program9 = t15.program([t15.expressionStatement(t15.cloneNode(expr, true))]);
-  traverse8(program9, {
+  const program10 = t15.program([t15.expressionStatement(t15.cloneNode(expr, true))]);
+  traverse9(program10, {
     noScope: true,
     MemberExpression(path) {
       if (!t15.isIdentifier(path.node.object, { name: "item" })) return;
@@ -5799,22 +6410,25 @@ function buildPatchEntryPropPatcher(entry) {
   const value = t15.identifier("value");
   const item = t15.identifier("item");
   const target = t15.identifier("__target");
-  const targetExpr = buildChildAccessExpr2(row, entry.childPath);
+  const targetExpr = entry.childPath.length > 0 ? t15.memberExpression(row, t15.identifier(childPathRefName(entry.childPath))) : row;
   if (entry.type === "className") {
-    return t15.arrowFunctionExpression(
-      [row, value, item],
-      t15.blockStatement([
-        t15.variableDeclaration("const", [t15.variableDeclarator(target, targetExpr)]),
-        t15.ifStatement(t15.unaryExpression("!", target), t15.returnStatement()),
-        t15.expressionStatement(
-          t15.assignmentExpression(
-            "=",
-            t15.memberExpression(target, t15.identifier("className")),
-            t15.callExpression(t15.memberExpression(t15.cloneNode(entry.expression, true), t15.identifier("trim")), [])
-          )
+    const isRoot2 = entry.childPath.length === 0;
+    const stmts2 = [];
+    if (!isRoot2) {
+      stmts2.push(t15.variableDeclaration("const", [t15.variableDeclarator(target, targetExpr)]));
+      stmts2.push(t15.ifStatement(t15.unaryExpression("!", target), t15.returnStatement()));
+    }
+    const ref2 = isRoot2 ? row : target;
+    stmts2.push(
+      t15.expressionStatement(
+        t15.assignmentExpression(
+          "=",
+          t15.memberExpression(ref2, t15.identifier("className")),
+          t15.cloneNode(entry.expression, true)
         )
-      ])
+      )
     );
+    return t15.arrowFunctionExpression([row, value, item], t15.blockStatement(stmts2));
   }
   if (entry.type === "attribute") {
     const attrName = entry.attributeName || "class";
@@ -5823,22 +6437,35 @@ function buildPatchEntryPropPatcher(entry) {
         "=",
         t15.memberExpression(t15.memberExpression(target, t15.identifier("style")), t15.identifier("cssText")),
         t15.conditionalExpression(
-          t15.binaryExpression("===", t15.unaryExpression("typeof", t15.identifier("__attrValue")), t15.stringLiteral("object")),
+          t15.binaryExpression(
+            "===",
+            t15.unaryExpression("typeof", t15.identifier("__attrValue")),
+            t15.stringLiteral("object")
+          ),
           t15.callExpression(
             t15.memberExpression(
               t15.callExpression(
                 t15.memberExpression(
-                  t15.callExpression(t15.memberExpression(t15.identifier("Object"), t15.identifier("entries")), [t15.identifier("__attrValue")]),
+                  t15.callExpression(t15.memberExpression(t15.identifier("Object"), t15.identifier("entries")), [
+                    t15.identifier("__attrValue")
+                  ]),
                   t15.identifier("map")
                 ),
                 [
                   t15.arrowFunctionExpression(
                     [t15.arrayPattern([t15.identifier("k"), t15.identifier("v")])],
-                    t15.binaryExpression("+", t15.binaryExpression(
+                    t15.binaryExpression(
                       "+",
-                      t15.callExpression(t15.memberExpression(t15.identifier("k"), t15.identifier("replace")), [t15.regExpLiteral("[A-Z]", "g"), t15.stringLiteral("-$&")]),
-                      t15.stringLiteral(": ")
-                    ), t15.identifier("v"))
+                      t15.binaryExpression(
+                        "+",
+                        t15.callExpression(t15.memberExpression(t15.identifier("k"), t15.identifier("replace")), [
+                          t15.regExpLiteral("[A-Z]", "g"),
+                          t15.stringLiteral("-$&")
+                        ]),
+                        t15.stringLiteral(": ")
+                      ),
+                      t15.identifier("v")
+                    )
                   )
                 ]
               ),
@@ -5881,32 +6508,35 @@ function buildPatchEntryPropPatcher(entry) {
       ])
     );
   }
-  return t15.arrowFunctionExpression(
-    [row, value, item],
-    t15.blockStatement([
-      t15.variableDeclaration("const", [t15.variableDeclarator(target, targetExpr)]),
-      t15.ifStatement(t15.unaryExpression("!", target), t15.returnStatement()),
-      t15.expressionStatement(
+  const isRoot = entry.childPath.length === 0;
+  const stmts = [];
+  if (!isRoot) {
+    stmts.push(t15.variableDeclaration("const", [t15.variableDeclarator(target, targetExpr)]));
+    stmts.push(t15.ifStatement(t15.unaryExpression("!", target), t15.returnStatement()));
+  }
+  const ref = isRoot ? row : target;
+  stmts.push(
+    t15.expressionStatement(
+      t15.logicalExpression(
+        "||",
         t15.logicalExpression(
-          "||",
-          t15.logicalExpression(
-            "&&",
-            t15.memberExpression(target, t15.identifier("firstChild")),
-            t15.assignmentExpression(
-              "=",
-              t15.memberExpression(t15.memberExpression(target, t15.identifier("firstChild")), t15.identifier("nodeValue")),
-              t15.cloneNode(entry.expression, true)
-            )
-          ),
+          "&&",
+          t15.memberExpression(ref, t15.identifier("firstChild")),
           t15.assignmentExpression(
             "=",
-            t15.memberExpression(target, t15.identifier("textContent")),
+            t15.memberExpression(t15.memberExpression(ref, t15.identifier("firstChild")), t15.identifier("nodeValue")),
             t15.cloneNode(entry.expression, true)
           )
+        ),
+        t15.assignmentExpression(
+          "=",
+          t15.memberExpression(ref, t15.identifier("textContent")),
+          t15.cloneNode(entry.expression, true)
         )
       )
-    ])
+    )
   );
+  return t15.arrowFunctionExpression([row, value, item], t15.blockStatement(stmts));
 }
 function buildPropPatchersObject(arrayMap) {
   const groups = /* @__PURE__ */ new Map();
@@ -5965,19 +6595,22 @@ function generateEnsureArrayConfigsMethod(arrayMaps) {
       ),
       t15.objectProperty(
         t15.identifier("render"),
-        t15.arrowFunctionExpression(
-          renderLambdaParams,
-          t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier(renderMethodName)), renderCallArgs)
+        t15.callExpression(
+          t15.memberExpression(
+            t15.memberExpression(t15.thisExpression(), t15.identifier(renderMethodName)),
+            t15.identifier("bind")
+          ),
+          [t15.thisExpression()]
         )
       ),
       t15.objectProperty(
         t15.identifier("create"),
-        t15.arrowFunctionExpression(
-          renderLambdaParams.map((p) => t15.cloneNode(p)),
-          t15.callExpression(
+        t15.callExpression(
+          t15.memberExpression(
             t15.memberExpression(t15.thisExpression(), t15.identifier(createMethodName)),
-            renderCallArgs.map((a) => t15.cloneNode(a))
-          )
+            t15.identifier("bind")
+          ),
+          [t15.thisExpression()]
         )
       )
     ];
@@ -6065,10 +6698,7 @@ function generateArrayConditionalPatchObserver(arrayMap, bindings, methodName) {
   const containerName = `__${arrayPath.replace(/\./g, "_")}_container`;
   const containerRef = t15.memberExpression(t15.thisExpression(), t15.identifier(containerName));
   const proxiedArr = arrayMap.isImportedState ? buildMemberChain(
-    t15.memberExpression(
-      t15.memberExpression(t15.thisExpression(), t15.identifier("__stores")),
-      t15.identifier(arrayMap.storeVar || "store")
-    ),
+    t15.memberExpression(t15.identifier(arrayMap.storeVar || "store"), t15.identifier("__store")),
     arrayPath
   ) : buildMemberChain(t15.thisExpression(), arrayPath);
   const rawArrExpr = t15.logicalExpression(
@@ -6126,10 +6756,7 @@ function generateArrayConditionalRerenderObserver(arrayMap, methodName) {
   const containerRef = t15.memberExpression(t15.thisExpression(), t15.identifier(containerName));
   const configRef = t15.memberExpression(t15.thisExpression(), t15.identifier(getArrayConfigPropName(arrayMap)));
   const proxiedArr = arrayMap.isImportedState ? buildMemberChain(
-    t15.memberExpression(
-      t15.memberExpression(t15.thisExpression(), t15.identifier("__stores")),
-      t15.identifier(arrayMap.storeVar || "store")
-    ),
+    t15.memberExpression(t15.identifier(arrayMap.storeVar || "store"), t15.identifier("__store")),
     arrayPath
   ) : buildMemberChain(t15.thisExpression(), arrayPath);
   const rawArrExpr = t15.logicalExpression(
@@ -6212,15 +6839,8 @@ function generateArrayConditionalRerenderObserver(arrayMap, methodName) {
       t15.ifStatement(
         t15.unaryExpression("!", t15.identifier("__skipArrayConditionalRerender")),
         t15.blockStatement([
-          t15.ifStatement(
-            t15.binaryExpression(
-              "===",
-              t15.unaryExpression("typeof", t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs"))),
-              t15.stringLiteral("function")
-            ),
-            t15.expressionStatement(
-              t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs")), [])
-            )
+          t15.expressionStatement(
+            t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs")), [])
           ),
           t15.variableDeclaration("const", [
             t15.variableDeclarator(
@@ -6251,7 +6871,7 @@ function buildConditionalPatchStatement(binding, target, itemVariable) {
     return js5`${jsExpr3`${target}.textContent`} = ${expression};`;
   }
   if (binding.type === "className") {
-    return js5`${jsExpr3`${target}.className`} = (${expression}).trim();`;
+    return js5`${jsExpr3`${target}.className`} = ${expression};`;
   }
   if (binding.attributeName === "style") {
     return t15.blockStatement(
@@ -6280,32 +6900,30 @@ function buildConditionalPatchStatement(binding, target, itemVariable) {
 }
 function renameItemVariable(expr, itemVariable) {
   const cloned = t15.cloneNode(expr, true);
-  const program9 = t15.program([t15.expressionStatement(cloned)]);
-  traverse8(program9, {
+  const program10 = t15.program([t15.expressionStatement(cloned)]);
+  traverse9(program10, {
     noScope: true,
     Identifier(path) {
       if (path.node.name === itemVariable) path.node.name = "item";
     }
   });
-  return program9.body[0].expression;
+  return program10.body[0].expression;
 }
 function buildRelationalClassStatements(rowExpr, bindings, isMatch, phase) {
   return bindings.flatMap((binding, index) => {
-    const targetVar = `__target_${phase}_${index}`;
     const enabled = binding.classWhenMatch ? isMatch : !isMatch;
-    const targetExpr = binding.selector === ":scope" ? t15.cloneNode(rowExpr, true) : t15.cloneNode(rowExpr, true);
     if (binding.selector === ":scope") {
+      const expr = t15.cloneNode(rowExpr, true);
       return jsBlockBody3`
-        var ${id8(targetVar)} = ${targetExpr};
-        if (${id8(targetVar)}) {
-          if (${id8(targetVar)}.className === '' || ${id8(targetVar)}.className === ${binding.classToggleName}) {
-            ${id8(targetVar)}.className = ${enabled ? binding.classToggleName : ""};
-          } else {
-            ${id8(targetVar)}.classList.toggle(${binding.classToggleName}, ${enabled});
-          }
+        if (${expr}.className === '' || ${expr}.className === ${binding.classToggleName}) {
+          ${expr}.className = ${enabled ? binding.classToggleName : ""};
+        } else {
+          ${expr}.classList.toggle(${binding.classToggleName}, ${enabled});
         }
       `;
     }
+    const targetVar = `__target_${phase}_${index}`;
+    const targetExpr = t15.cloneNode(rowExpr, true);
     return jsBlockBody3`
       var ${id8(targetVar)} = ${targetExpr};
       if (${id8(targetVar)}) {
@@ -6365,15 +6983,8 @@ function generateArrayHandlers(arrayMap, methodName) {
         t15.returnStatement()
       ])
     ),
-    t15.ifStatement(
-      t15.binaryExpression(
-        "===",
-        t15.unaryExpression("typeof", t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs"))),
-        t15.stringLiteral("function")
-      ),
-      t15.expressionStatement(
-        t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs")), [])
-      )
+    t15.expressionStatement(
+      t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier("__ensureArrayConfigs")), [])
     ),
     t15.expressionStatement(
       t15.callExpression(t15.memberExpression(t15.thisExpression(), t15.identifier("__applyListChanges")), [
@@ -6563,7 +7174,8 @@ function unwrapComparisonOperands(node) {
 }
 function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCounter, classBody2, templateSetupContext) {
   const renderEventHandlers = [];
-  if (!arrayMap.itemTemplate) return { method: null, handlers: renderEventHandlers, handlerPropsInMap: [] };
+  if (!arrayMap.itemTemplate)
+    return { method: null, handlers: renderEventHandlers, handlerPropsInMap: [], needsUnwrapHelper: false };
   const arrayPath = pathPartsToString(arrayMap.arrayPathParts || normalizePathParts(arrayMap.arrayPath || ""));
   const modified = t16.cloneNode(arrayMap.itemTemplate, true);
   const handlerPropsInMap = [];
@@ -6601,8 +7213,12 @@ function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCount
       wholeParam = templateMethod.params[0].name;
     }
   }
+  const itemKey = arrayMap.itemVariable;
   wrapped.expressions = wrapped.expressions.map(
-    (expr) => replacePropRefsInExpression(unwrapComparisonOperands(expr), propNames, wholeParam)
+    (expr) => optionalizeMemberChainsAfterComputedItemKey(
+      replacePropRefsInExpression(unwrapComparisonOperands(expr), propNames, wholeParam),
+      itemKey
+    )
   );
   const handlerRegStmts = buildHandlerRegistrationStatements(
     handlerPropsInMap,
@@ -6616,8 +7232,14 @@ function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCount
     t16.expressionStatement(wrapped)
   ]) : wrapped;
   const setupStmts = collectTemplateSetupStatements(setupScope, templateSetupContext);
-  const rewrittenSetup = setupStmts.map((stmt) => replacePropRefsInStatements([t16.cloneNode(stmt, true)], propNames, wholeParam)).flat();
-  const rewrittenCallbackBody = callbackBodyStmts.map((stmt) => replacePropRefsInStatements([t16.cloneNode(stmt, true)], propNames, wholeParam)).flat();
+  const rewrittenSetup = optionalizeComputedItemKeyInStatements(
+    setupStmts.map((stmt) => replacePropRefsInStatements([t16.cloneNode(stmt, true)], propNames, wholeParam)).flat(),
+    itemKey
+  );
+  const rewrittenCallbackBody = optionalizeComputedItemKeyInStatements(
+    callbackBodyStmts.map((stmt) => replacePropRefsInStatements([t16.cloneNode(stmt, true)], propNames, wholeParam)).flat(),
+    itemKey
+  );
   const baseMethod = jsMethod6`${id9(methodName)}(${id9(arrayMap.itemVariable)}) {}`;
   if (arrayMap.indexVariable) {
     baseMethod.params.push(t16.identifier(arrayMap.indexVariable));
@@ -6638,14 +7260,7 @@ function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCount
     return false;
   }
   const needsUnwrapHelper = [...rewrittenCallbackBody, returnStmt].some((stmt) => containsVCall(stmt));
-  const method = appendToBody4(
-    baseMethod,
-    ...rewrittenSetup,
-    ...needsUnwrapHelper ? [buildValueUnwrapHelper()] : [],
-    ...rewrittenCallbackBody,
-    ...handlerRegStmts,
-    returnStmt
-  );
+  const method = appendToBody4(baseMethod, ...rewrittenSetup, ...rewrittenCallbackBody, ...handlerRegStmts, returnStmt);
   if (handlerPropsInMap.length > 0 && classBody2) {
     const handleItemHandler = jsMethod6`__handleItemHandler(itemId, e) {
     const fn = this.__itemHandlers_?.[itemId];
@@ -6665,15 +7280,15 @@ function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCount
     };
   });
   if (eventHandlers) renderEventHandlers.forEach((h) => eventHandlers.push(h));
-  return { method, handlers: renderEventHandlers, handlerPropsInMap };
+  return { method, handlers: renderEventHandlers, handlerPropsInMap, needsUnwrapHelper };
 }
 
 // src/generate-array-slot-sync.ts
 import * as t17 from "@babel/types";
-import { id as id10, jsBlockBody as jsBlockBody4, jsExpr as jsExpr4, jsMethod as jsMethod7 } from "eszter";
+import { id as id10, jsMethod as jsMethod7 } from "eszter";
 import { createRequire as createRequire10 } from "module";
 var require11 = createRequire10(import.meta.url);
-var traverse9 = require11("@babel/traverse").default;
+var traverse10 = require11("@babel/traverse").default;
 function isUnresolvedMapWithComponentChild(um, imports) {
   const template = um.itemTemplate;
   if (!template) return null;
@@ -6689,20 +7304,14 @@ function getArrayCapName2(arrayPropName) {
 function getComponentArrayItemsName(arrayPropName) {
   return `_${arrayPropName}Items`;
 }
-function getComponentArrayBuildMethodName(arrayPropName) {
-  return `_build${getArrayCapName2(arrayPropName)}Items`;
-}
 function getComponentArrayRefreshMethodName(arrayPropName) {
   return `__refresh${getArrayCapName2(arrayPropName)}Items`;
 }
-function getComponentArrayMountMethodName(arrayPropName) {
-  return `__mount${getArrayCapName2(arrayPropName)}Items`;
-}
-function generateComponentArrayMethods(um, arrayPropName, imports, propNames, _classBody, storeArrayAccess, wholeParamName, templateSetupContext) {
+function generateComponentArrayResult(um, arrayPropName, imports, propNames, _classBody, storeArrayAccess, wholeParamName, templateSetupContext) {
   const comp = isUnresolvedMapWithComponentChild(um, imports);
-  if (!comp) return [];
+  if (!comp) return null;
   const itemTemplate = um.itemTemplate;
-  if (!itemTemplate || !t17.isJSXElement(itemTemplate)) return [];
+  if (!itemTemplate || !t17.isJSXElement(itemTemplate)) return null;
   const mapJsxCtx = {
     imports,
     componentInstances: /* @__PURE__ */ new Map(),
@@ -6733,7 +7342,7 @@ function generateComponentArrayMethods(um, arrayPropName, imports, propNames, _c
   let finalPropsExpr = propsExpr;
   if (needsRename || needsIndexRename) {
     const cloned = t17.cloneNode(propsExpr, true);
-    traverse9(cloned, {
+    traverse10(cloned, {
       noScope: true,
       Identifier(path) {
         if (needsRename && path.node.name === itemVar) {
@@ -6761,17 +7370,6 @@ function generateComponentArrayMethods(um, arrayPropName, imports, propNames, _c
     finalPropsExpr = cloned;
   }
   const itemsName = getComponentArrayItemsName(arrayPropName);
-  const buildMethodName = getComponentArrayBuildMethodName(arrayPropName);
-  const refreshMethodName = getComponentArrayRefreshMethodName(arrayPropName);
-  const mountMethodName = `__mount${getArrayCapName2(arrayPropName)}Items`;
-  const containerName = `__${arrayPropName}ItemsContainer`;
-  const containerLookupExpr = um.containerBindingId ? t17.callExpression(t17.memberExpression(t17.identifier("document"), t17.identifier("getElementById")), [
-    t17.binaryExpression(
-      "+",
-      t17.memberExpression(t17.thisExpression(), t17.identifier("id")),
-      t17.stringLiteral(`-${um.containerBindingId}`)
-    )
-  ]) : jsExpr4`this.$(":scope")`;
   let arrAccessExpr;
   let arrSetupStatements = [];
   if (storeArrayAccess) {
@@ -6798,175 +7396,64 @@ function generateComponentArrayMethods(um, arrayPropName, imports, propNames, _c
     itemPropsCallArgs
   );
   const itemPropsSetup = collectTemplateSetupStatements(finalPropsExpr, templateSetupContext);
+  const storeVarNames = /* @__PURE__ */ new Set();
+  if (storeArrayAccess) storeVarNames.add(storeArrayAccess.storeVar);
+  for (const stmt of [...itemPropsSetup, ...arrSetupStatements]) {
+    if (!t17.isVariableDeclaration(stmt)) continue;
+    for (const decl of stmt.declarations) {
+      if (t17.isIdentifier(decl.init) && imports.has(decl.init.name)) {
+        storeVarNames.add(decl.init.name);
+      }
+    }
+  }
+  const rewriteStoreDestructuring = (stmts) => {
+    if (storeVarNames.size === 0) return;
+    for (const stmt of stmts) {
+      if (!t17.isVariableDeclaration(stmt)) continue;
+      for (const decl of stmt.declarations) {
+        if (t17.isIdentifier(decl.init) && storeVarNames.has(decl.init.name)) {
+          decl.init = t17.memberExpression(t17.identifier(decl.init.name), t17.identifier("__raw"));
+        }
+      }
+    }
+  };
+  rewriteStoreDestructuring(itemPropsSetup);
+  rewriteStoreDestructuring(arrSetupStatements);
   const itemPropsMethod = jsMethod7`${id10(itemPropsMethodName)}(opt) {}`;
   if (indexVar) itemPropsMethod.params.push(t17.identifier("__k"));
   itemPropsMethod.body.body.push(...itemPropsSetup, t17.returnStatement(finalPropsExpr));
   const itemIdProp = um.itemIdProperty;
   const keyExpr = itemIdProp && itemIdProp !== ITEM_IS_KEY ? t17.callExpression(t17.identifier("String"), [t17.memberExpression(t17.identifier("opt"), t17.identifier(itemIdProp))]) : itemIdProp === ITEM_IS_KEY ? t17.callExpression(t17.identifier("String"), [t17.identifier("opt")]) : t17.binaryExpression("+", t17.stringLiteral("__idx_"), t17.identifier("__k"));
-  const buildMethod = jsMethod7`${id10(buildMethodName)}() {}`;
-  buildMethod.body.body.push(
-    ...arrSetupStatements,
-    ...itemIdProp ? jsBlockBody4`
-           const arr = ${arrAccessExpr} ?? [];
-           this.${id10(itemsName)} = arr.map((opt, __k) => {
-             const item = new ${id10(comp.componentTag)}(${t17.cloneNode(itemPropsCall, true)});
-             item.parentComponent = this;
-             item.__geaCompiledChild = true;
-             item.__geaItemKey = ${t17.cloneNode(keyExpr, true)};
-             return item;
-           });
-         ` : jsBlockBody4`
-           const arr = ${arrAccessExpr} ?? [];
-           this.${id10(itemsName)} = arr.map(opt => {
-             const item = new ${id10(comp.componentTag)}(${t17.cloneNode(itemPropsCall, true)});
-             item.parentComponent = this;
-             item.__geaCompiledChild = true;
-             return item;
-           });
-         `
-  );
-  const mountMethod = jsMethod7`${id10(mountMethodName)}() {}`;
-  mountMethod.body.body.push(
-    ...jsBlockBody4`
-      if (!this.${id10(containerName)} || !this.${id10(containerName)}.isConnected) {
-        this.${id10(containerName)} = ${containerLookupExpr};
-      }
-      if (!this.${id10(containerName)}) return;
-      for (let i = 0; i < (this.${id10(itemsName)}?.length ?? 0); i++) {
-        const item = this.${id10(itemsName)}[i];
-        if (!item) continue;
-        if (!this.__childComponents.includes(item)) {
-          this.__childComponents.push(item);
-        }
-        item.render(this.${id10(containerName)});
-      }
-    `
+  const mapParams = [t17.identifier("opt")];
+  if (indexVar || !itemIdProp) mapParams.push(t17.identifier("__k"));
+  const childCall = t17.callExpression(t17.memberExpression(t17.thisExpression(), t17.identifier("__child")), [
+    t17.identifier(comp.componentTag),
+    t17.cloneNode(itemPropsCall, true),
+    t17.cloneNode(keyExpr, true)
+  ]);
+  const mapCallback = t17.arrowFunctionExpression(mapParams, childCall);
+  const nullishCoalesce = t17.logicalExpression("??", t17.cloneNode(arrAccessExpr, true), t17.arrayExpression([]));
+  const parenthesized = t17.parenthesizedExpression ? t17.parenthesizedExpression(nullishCoalesce) : nullishCoalesce;
+  const mapCallExpr = t17.callExpression(t17.memberExpression(parenthesized, t17.identifier("map")), [mapCallback]);
+  const constructorInit = t17.expressionStatement(
+    t17.assignmentExpression("=", t17.memberExpression(t17.thisExpression(), t17.identifier(itemsName)), mapCallExpr)
   );
-  const refreshMethod = jsMethod7`${id10(refreshMethodName)}() {}`;
-  if (itemIdProp) {
-    refreshMethod.body.body.push(
-      ...arrSetupStatements.map((stmt) => t17.cloneNode(stmt, true)),
-      ...jsBlockBody4`
-         const arr = ${t17.cloneNode(arrAccessExpr, true)} ?? [];
-         const __old = this.${id10(itemsName)} ?? [];
-         const __keyMap = new Map();
-         for (let __k = 0; __k < __old.length; __k++) {
-           if (__old[__k].__geaItemKey != null) {
-             __keyMap.set(__old[__k].__geaItemKey, __old[__k]);
-           }
-         }
-         const __new = [];
-         for (let __k = 0; __k < arr.length; __k++) {
-           const opt = arr[__k];
-           const __key = ${t17.cloneNode(keyExpr, true)};
-           const __existing = __keyMap.get(__key);
-           if (__existing) {
-             __existing.__geaUpdateProps(${t17.cloneNode(itemPropsCall, true)});
-             __new.push(__existing);
-             __keyMap.delete(__key);
-           } else {
-             const __item = new ${id10(comp.componentTag)}(${t17.cloneNode(itemPropsCall, true)});
-             __item.parentComponent = this;
-             __item.__geaCompiledChild = true;
-             __item.__geaItemKey = __key;
-             __new.push(__item);
-           }
-         }
-         for (const [, __removed] of __keyMap) {
-           __removed.dispose?.();
-         }
-         if ((!this.${id10(containerName)} || !this.${id10(containerName)}.isConnected) && this.rendered_) {
-           this.${id10(containerName)} = ${t17.cloneNode(containerLookupExpr, true)};
-         }
-         const __container = this.${id10(containerName)};
-         if (__container && this.rendered_) {
-           for (let __k = 0; __k < __new.length; __k++) {
-             if (!__new[__k].rendered_) {
-               if (!this.__childComponents.includes(__new[__k])) {
-                 this.__childComponents.push(__new[__k]);
-               }
-               __new[__k].render(__container);
-             }
-           }
-           let __cursor = __container.firstChild;
-           for (let __k = 0; __k < __new.length; __k++) {
-             let __el = __new[__k].element_;
-             if (!__el) continue;
-             while (__el.parentElement && __el.parentElement !== __container) __el = __el.parentElement;
-             if (__el !== __cursor) {
-               __container.insertBefore(__el, __cursor || null);
-             } else {
-               __cursor = __cursor.nextSibling;
-             }
-           }
-         }
-         this.${id10(itemsName)} = __new;
-         this.__childComponents = (this.__childComponents || []).filter(
-           child => !__old.includes(child) || __new.includes(child)
-         );
-       `
-    );
-  } else {
-    refreshMethod.body.body.push(
-      ...arrSetupStatements.map((stmt) => t17.cloneNode(stmt, true)),
-      ...jsBlockBody4`
-         const arr = ${t17.cloneNode(arrAccessExpr, true)} ?? [];
-         const __old = this.${id10(itemsName)} ?? [];
-         const __oldLen = __old.length;
-         const __newLen = arr.length;
-         if (__oldLen !== __newLen) {
-           if (__newLen > __oldLen) {
-             for (let __k = 0; __k < __oldLen; __k++) {
-               const opt = arr[__k];
-               __old[__k].__geaUpdateProps(${t17.cloneNode(itemPropsCall, true)});
-             }
-             if ((!this.${id10(containerName)} || !this.${id10(containerName)}.isConnected) && this.rendered_) {
-               this.${id10(containerName)} = ${t17.cloneNode(containerLookupExpr, true)};
-             }
-             for (let __k = __oldLen; __k < __newLen; __k++) {
-               const opt = arr[__k];
-               const __item = new ${id10(comp.componentTag)}(${t17.cloneNode(itemPropsCall, true)});
-               __item.parentComponent = this;
-               __item.__geaCompiledChild = true;
-               this.${id10(itemsName)}.push(__item);
-               if (!this.__childComponents.includes(__item)) {
-                 this.__childComponents.push(__item);
-               }
-               if (this.rendered_ && this.${id10(containerName)}) {
-                 __item.render(this.${id10(containerName)});
-               }
-             }
-             return;
-           }
-           if (__newLen < __oldLen) {
-             for (let __k = __newLen; __k < __oldLen; __k++) {
-               __old[__k]?.dispose?.();
-             }
-             this.${id10(itemsName)}.length = __newLen;
-             this.__childComponents = (this.__childComponents || []).filter(
-               child => !__old.slice(__newLen).includes(child)
-             );
-             for (let __k = 0; __k < __newLen; __k++) {
-               const opt = arr[__k];
-               this.${id10(itemsName)}[__k].__geaUpdateProps(${t17.cloneNode(itemPropsCall, true)});
-             }
-             return;
-           }
-         }
-         for (let i = 0; i < arr.length; i++) {
-           const opt = arr[i];
-           this.${id10(itemsName)}[i].__geaUpdateProps(${t17.cloneNode(itemPropsCall, true)});
-         }
-       `
-    );
-  }
-  return [itemPropsMethod, buildMethod, mountMethod, refreshMethod];
+  return {
+    itemPropsMethod,
+    constructorInit,
+    componentTag: comp.componentTag,
+    containerBindingId: um.containerBindingId,
+    itemIdProperty: itemIdProp,
+    arrAccessExpr,
+    arrSetupStatements
+  };
 }
 
 // src/apply-reactivity.ts
 import { createRequire as createRequire11 } from "module";
+var generate2 = "default" in babelGenerator ? babelGenerator.default : babelGenerator;
 var require12 = createRequire11(import.meta.url);
-var traverse10 = require12("@babel/traverse").default;
+var traverse11 = require12("@babel/traverse").default;
 var BOOLEAN_HTML_ATTRS = /* @__PURE__ */ new Set([
   "disabled",
   "hidden",
@@ -6987,30 +7474,140 @@ var BOOLEAN_HTML_ATTRS = /* @__PURE__ */ new Set([
 ]);
 function rewriteTemplateBodyForImportedState(_templateMethod, _stateRefs, _storeImports) {
 }
-function generateCreatedHooks(stores) {
-  const body = jsBlockBody5`
-    if (!this.__observer_removers__) { this.__observer_removers__ = []; }
-    if (!this.__stores) { this.__stores = {}; }
-    this.__observer_removers__.forEach(fn => fn());
-    this.__observer_removers__ = [];
-    if (typeof this.__ensureArrayConfigs === 'function') { this.__ensureArrayConfigs(); }
-  `;
+function generateCreatedHooks(stores, hasArrayConfigs, observeListConfigs = []) {
+  const body = [];
+  if (hasArrayConfigs) {
+    body.push(js7`this.__ensureArrayConfigs();`);
+  }
+  const observeListPathKeys = /* @__PURE__ */ new Set();
+  for (const config of observeListConfigs) {
+    observeListPathKeys.add(`${config.storeVar}:${JSON.stringify(config.pathParts)}`);
+  }
   for (const store of stores) {
-    const storeRef = t18.memberExpression(
-      t18.memberExpression(t18.thisExpression(), t18.identifier("__stores")),
-      t18.identifier(store.storeVar)
-    );
-    body.push(js7`${storeRef} = ${t18.cloneNode(store.captureExpression, true)};`);
-    for (const observeHandler of store.observeHandlers) {
+    const byPath = /* @__PURE__ */ new Map();
+    for (const handler of store.observeHandlers) {
+      const pathKey = JSON.stringify(handler.pathParts);
+      const listKey = `${store.storeVar}:${pathKey}`;
+      if (observeListPathKeys.has(listKey)) continue;
+      if (!byPath.has(pathKey)) byPath.set(pathKey, []);
+      byPath.get(pathKey).push({ methodName: handler.methodName, isVia: handler.isVia, rereadExpr: handler.rereadExpr });
+    }
+    const storeVarExpr = t18.identifier(store.storeVar);
+    for (const [pathKey, handlers] of byPath) {
+      const pathParts = JSON.parse(pathKey);
+      const pathArray = t18.arrayExpression(pathParts.map((part) => t18.stringLiteral(part)));
+      if (handlers.length === 1 && !handlers[0].isVia) {
+        body.push(
+          t18.expressionStatement(
+            t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__observe")), [
+              storeVarExpr,
+              pathArray,
+              t18.memberExpression(t18.thisExpression(), t18.identifier(handlers[0].methodName))
+            ])
+          )
+        );
+      } else {
+        const vParam = t18.identifier("__v");
+        const cParam = t18.identifier("__c");
+        const callStmts = [];
+        for (const h of handlers) {
+          if (h.isVia && h.rereadExpr) {
+            callStmts.push(
+              t18.expressionStatement(
+                t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(h.methodName)), [
+                  t18.cloneNode(h.rereadExpr, true),
+                  t18.nullLiteral()
+                ])
+              )
+            );
+          } else {
+            callStmts.push(
+              t18.expressionStatement(
+                t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(h.methodName)), [vParam, cParam])
+              )
+            );
+          }
+        }
+        body.push(
+          t18.expressionStatement(
+            t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__observe")), [
+              storeVarExpr,
+              pathArray,
+              t18.arrowFunctionExpression([vParam, cParam], t18.blockStatement(callStmts))
+            ])
+          )
+        );
+      }
+    }
+    for (const config of observeListConfigs.filter((c) => c.storeVar === store.storeVar)) {
+      const pathArray = t18.arrayExpression(config.pathParts.map((part) => t18.stringLiteral(part)));
+      const itemsName = getComponentArrayItemsName(config.arrayPropName);
+      const itemPropsMethodName = `__itemProps_${config.arrayPropName}`;
+      const configProps = [
+        t18.objectProperty(t18.identifier("items"), t18.memberExpression(t18.thisExpression(), t18.identifier(itemsName))),
+        t18.objectProperty(t18.identifier("itemsKey"), t18.stringLiteral(itemsName)),
+        t18.objectProperty(
+          t18.identifier("container"),
+          t18.arrowFunctionExpression(
+            [],
+            config.containerBindingId ? t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__el")), [
+              t18.stringLiteral(config.containerBindingId)
+            ]) : jsExpr4`this.$(":scope")`
+          )
+        ),
+        t18.objectProperty(t18.identifier("Ctor"), t18.identifier(config.componentTag)),
+        t18.objectProperty(
+          t18.identifier("props"),
+          t18.arrowFunctionExpression(
+            [t18.identifier("opt"), t18.identifier("__k")],
+            t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(itemPropsMethodName)), [
+              t18.identifier("opt"),
+              t18.identifier("__k")
+            ])
+          )
+        ),
+        t18.objectProperty(
+          t18.identifier("key"),
+          config.itemIdProperty && config.itemIdProperty !== ITEM_IS_KEY ? t18.arrowFunctionExpression(
+            [t18.identifier("opt")],
+            t18.memberExpression(t18.identifier("opt"), t18.identifier(config.itemIdProperty))
+          ) : config.itemIdProperty === ITEM_IS_KEY ? t18.arrowFunctionExpression([t18.identifier("opt")], t18.identifier("opt")) : t18.arrowFunctionExpression(
+            [t18.identifier("opt"), t18.identifier("__k")],
+            t18.binaryExpression("+", t18.stringLiteral("__idx_"), t18.identifier("__k"))
+          )
+        )
+      ];
+      const samePathHandlers = [];
+      const pathKey = JSON.stringify(config.pathParts);
+      for (const handler of store.observeHandlers) {
+        if (JSON.stringify(handler.pathParts) === pathKey) {
+          samePathHandlers.push(handler);
+        }
+      }
+      if (samePathHandlers.length > 0) {
+        const onchangeStmts = samePathHandlers.map(
+          (h) => t18.expressionStatement(
+            h.isVia && h.rereadExpr ? t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(h.methodName)), [
+              t18.cloneNode(h.rereadExpr, true),
+              t18.nullLiteral()
+            ]) : t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(h.methodName)), [
+              t18.memberExpression(t18.identifier(config.storeVar), t18.identifier(config.pathParts[0])),
+              t18.nullLiteral()
+            ])
+          )
+        );
+        configProps.push(
+          t18.objectProperty(t18.identifier("onchange"), t18.arrowFunctionExpression([], t18.blockStatement(onchangeStmts)))
+        );
+      }
       body.push(
-        js7`
-          this.__observer_removers__.push(
-            ${storeRef}.observe(
-              ${t18.arrayExpression(observeHandler.pathParts.map((part) => t18.stringLiteral(part)))},
-              (__v, __c) => { try { this.${id11(observeHandler.methodName)}(__v, __c) } catch(_e) {} }
-            )
-          );
-        `
+        t18.expressionStatement(
+          t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__observeList")), [
+            storeVarExpr,
+            pathArray,
+            t18.objectExpression(configProps)
+          ])
+        )
       );
     }
   }
@@ -7018,30 +7615,31 @@ function generateCreatedHooks(stores) {
   method.body.body.push(...body);
   return method;
 }
-function generateLocalStateObserverSetup(observeHandlers) {
+function generateLocalStateObserverSetup(observeHandlers, hasArrayConfigs) {
   const localStore = t18.memberExpression(t18.thisExpression(), t18.identifier("__store"));
-  const body = [
-    js7`if (typeof this.__ensureArrayConfigs === 'function') { this.__ensureArrayConfigs(); }`,
-    js7`if (!${localStore}) { return; }`
-  ];
-  observeHandlers.forEach((observeHandler) => {
+  const body = [];
+  if (hasArrayConfigs) {
+    body.push(js7`this.__ensureArrayConfigs();`);
+  }
+  body.push(js7`if (!${localStore}) { return; }`);
+  for (const observeHandler of observeHandlers) {
     body.push(
-      js7`
-        this.__observer_removers__.push(
-          ${localStore}.observe(
-            ${t18.arrayExpression(observeHandler.pathParts.map((part) => t18.stringLiteral(part)))},
-            (__v, __c) => { try { this.${id11(observeHandler.methodName)}(__v, __c) } catch(_e) {} }
-          )
-        );
-      `
+      t18.expressionStatement(
+        t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__observe")), [
+          t18.thisExpression(),
+          t18.arrayExpression(observeHandler.pathParts.map((part) => t18.stringLiteral(part))),
+          t18.memberExpression(t18.thisExpression(), t18.identifier(observeHandler.methodName))
+        ])
+      )
     );
-  });
+  }
   const method = jsMethod8`${id11("__setupLocalStateObservers")}() {}`;
   method.body.body.push(...body);
   return method;
 }
 function applyStaticReactivity(ast, originalAST, className, sourceFile, imports, stateRefs, storeImports, compiledChildren = [], eventIdCounter = { value: 0 }, preTransformAnalysis) {
   let applied = false;
+  let needsModuleLevelUnwrapHelper = false;
   const astToTraverse = preTransformAnalysis?.has(className) ? ast : originalAST;
   const getAnalysis = (clsName, origPath) => {
     const cached = preTransformAnalysis?.get(clsName);
@@ -7049,7 +7647,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
     const classBody2 = t18.isClassBody(origPath.parent) ? origPath.parent : void 0;
     return analyzeTemplate(origPath.node, stateRefs, classBody2);
   };
-  traverse10(astToTraverse, {
+  traverse11(astToTraverse, {
     ClassMethod(origPath) {
       if (!t18.isIdentifier(origPath.node.key) || origPath.node.key.name !== "template") return;
       const analysis = getAnalysis(className, origPath);
@@ -7057,7 +7655,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
       const hasCompiledChildStoreDeps = compiledChildren.some((child) => child.dependencies.some((dep) => dep.storeVar));
       if (analysis.bindings.length === 0 && analysis.propBindings.length === 0 && analysis.arrayMaps.length === 0 && analysis.stateProps.size === 0 && analysis.unresolvedMaps.length === 0 && !hasCompiledChildStoreDeps)
         return;
-      traverse10(ast, {
+      traverse11(ast, {
         ClassDeclaration(classPath) {
           if (!t18.isIdentifier(classPath.node.id) || classPath.node.id.name !== className) return;
           const templateMethod = classPath.node.body.body.find(
@@ -7089,7 +7687,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             }
             if (renameMap.size === 0) return bodyStatements;
             const tempProgram = t18.program(bodyStatements);
-            traverse10(tempProgram, {
+            traverse11(tempProgram, {
               noScope: true,
               Identifier(path) {
                 const nextName = renameMap.get(path.node.name);
@@ -7200,23 +7798,39 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 consequent
               );
             } else if (pb.type === "class") {
-              updateStmt = t18.blockStatement([
-                t18.variableDeclaration("const", [
-                  t18.variableDeclarator(
-                    t18.identifier("__newClass"),
-                    t18.conditionalExpression(
-                      t18.binaryExpression("!=", valueExpr, t18.nullLiteral()),
+              const isObjectClass = pb.expression && t18.isObjectExpression(pb.expression);
+              const classValueExpr = isObjectClass ? t18.callExpression(
+                t18.memberExpression(
+                  t18.callExpression(
+                    t18.memberExpression(
                       t18.callExpression(
                         t18.memberExpression(
-                          t18.callExpression(t18.identifier("String"), [t18.cloneNode(valueExpr, true)]),
-                          t18.identifier("trim")
+                          t18.callExpression(t18.memberExpression(t18.identifier("Object"), t18.identifier("entries")), [
+                            t18.cloneNode(valueExpr, true)
+                          ]),
+                          t18.identifier("filter")
                         ),
-                        []
+                        [
+                          t18.arrowFunctionExpression(
+                            [t18.arrayPattern([t18.identifier("__k"), t18.identifier("__v")])],
+                            t18.identifier("__v")
+                          )
+                        ]
                       ),
-                      t18.stringLiteral("")
-                    )
-                  )
-                ]),
+                      t18.identifier("map")
+                    ),
+                    [t18.arrowFunctionExpression([t18.arrayPattern([t18.identifier("__k")])], t18.identifier("__k"))]
+                  ),
+                  t18.identifier("join")
+                ),
+                [t18.stringLiteral(" ")]
+              ) : t18.conditionalExpression(
+                t18.binaryExpression("!=", valueExpr, t18.nullLiteral()),
+                t18.callExpression(t18.identifier("String"), [t18.cloneNode(valueExpr, true)]),
+                t18.stringLiteral("")
+              );
+              updateStmt = t18.blockStatement([
+                t18.variableDeclaration("const", [t18.variableDeclarator(t18.identifier("__newClass"), classValueExpr)]),
                 t18.ifStatement(
                   t18.binaryExpression(
                     "!==",
@@ -7333,22 +7947,35 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             } else {
               continue;
             }
-            const blockStatements = [
-              t18.variableDeclaration("const", [t18.variableDeclarator(t18.identifier("__el"), elExpr)])
-            ];
-            if (pb.expression && pb.setupStatements) {
+            const useDerivedPropExpr = Boolean(pb.expression && pb.setupStatements);
+            const elDecl = t18.variableDeclaration("const", [t18.variableDeclarator(t18.identifier("__el"), elExpr)]);
+            const corePatch = [elDecl];
+            let derivedRewrittenExpr;
+            let derivedPrunedSetup = [];
+            if (useDerivedPropExpr) {
               const rewrittenSetup = replacePropRefsInStatements(
                 pb.setupStatements,
                 templatePropNames,
                 templateWholeParam
               );
-              const rewrittenExpr = replacePropRefsInExpression(pb.expression, templatePropNames, templateWholeParam);
-              blockStatements.push(...pruneDeadParamDestructuring(rewrittenSetup, [rewrittenExpr]));
-              blockStatements.push(
+              let rewrittenExpr = replacePropRefsInExpression(pb.expression, templatePropNames, templateWholeParam);
+              rewrittenExpr = replaceThisPropsRootWithValueParam(rewrittenExpr, pb.propName);
+              derivedRewrittenExpr = rewrittenExpr;
+              derivedPrunedSetup = pruneDeadParamDestructuring(rewrittenSetup, [rewrittenExpr]);
+              corePatch.push(...derivedPrunedSetup);
+              corePatch.push(
                 t18.variableDeclaration("const", [t18.variableDeclarator(t18.identifier("__boundValue"), rewrittenExpr)])
               );
             }
-            blockStatements.push(t18.ifStatement(t18.identifier("__el"), updateStmt));
+            corePatch.push(t18.ifStatement(t18.identifier("__el"), updateStmt));
+            const nullishValue = t18.logicalExpression(
+              "||",
+              t18.binaryExpression("===", t18.identifier("value"), t18.nullLiteral()),
+              t18.binaryExpression("===", t18.identifier("value"), t18.identifier("undefined"))
+            );
+            const guardsNullishInExpr = Boolean(derivedRewrittenExpr) && derivedExprGuardsValueWhenNullish(derivedRewrittenExpr);
+            const needsValueNullishGuard = useDerivedPropExpr && !guardsNullishInExpr && expressionAccessesValueProperties(derivedRewrittenExpr, derivedPrunedSetup);
+            const blockStatements = needsValueNullishGuard ? [t18.ifStatement(t18.unaryExpression("!", nullishValue), t18.blockStatement(corePatch))] : corePatch;
             patchStatementsByBinding.set(pb, blockStatements);
             applied = true;
           }
@@ -7394,7 +8021,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               }
               bindings.add(pb);
             };
-            traverse10(scanProg, {
+            traverse11(scanProg, {
               noScope: true,
               Identifier(path) {
                 if (path.parentPath && t18.isMemberExpression(path.parentPath.node) && path.parentPath.node.object === path.node)
@@ -7428,9 +8055,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             if (!hasStateOnly) continue;
             for (const pb of bindings) {
               if (pb.stateOnly) continue;
-              const dup = [...bindings].some(
-                (b) => b.stateOnly && b.selector === pb.selector && b.type === pb.type
-              );
+              const dup = [...bindings].some((b) => b.stateOnly && b.selector === pb.selector && b.type === pb.type);
               if (dup) bindings.delete(pb);
             }
           }
@@ -7440,9 +8065,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
           if (analysis.earlyReturnGuard) {
             const guardExpr = analysis.earlyReturnGuard;
             const localToStoreExpr = /* @__PURE__ */ new Map();
-            const setupStmts = templateMethod?.body.body.filter(
-              (s) => t18.isVariableDeclaration(s)
-            ) || [];
+            const setupStmts = templateMethod?.body.body.filter((s) => t18.isVariableDeclaration(s)) || [];
             for (const decl of setupStmts) {
               for (const d of decl.declarations) {
                 if (t18.isIdentifier(d.id) && t18.isMemberExpression(d.init)) {
@@ -7459,19 +8082,14 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 rerenderStoreKeys.push({ observeKey: key, pathParts: parts });
               }
             };
-            const guardScanProg = t18.program([
-              t18.expressionStatement(t18.cloneNode(guardExpr, true))
-            ]);
-            traverse10(guardScanProg, {
+            const guardScanProg = t18.program([t18.expressionStatement(t18.cloneNode(guardExpr, true))]);
+            traverse11(guardScanProg, {
               noScope: true,
               MemberExpression(path) {
                 const resolved = resolvePath(path.node, stateRefs);
                 if (!resolved?.parts?.length) return;
                 if (resolved.isImportedState || resolved.storeVar) {
-                  addRerenderDep(
-                    resolved.parts,
-                    resolved.isImportedState ? resolved.storeVar : void 0
-                  );
+                  addRerenderDep(resolved.parts, resolved.isImportedState ? resolved.storeVar : void 0);
                 }
               },
               Identifier(path) {
@@ -7501,7 +8119,8 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               const parsed = JSON.parse(entry.observeKey);
               const storeVarName = parsed.storeVar || void 0;
               const methodNameStr = getObserveMethodName(propPath, storeVarName);
-              const rerenderMethod = jsMethod8`${id11(methodNameStr)}(__v, __c) { this.__rerender(); }`;
+              const prevProp = `__geaPrev_guard_${methodNameStr}`;
+              const rerenderMethod = jsMethod8`${id11(methodNameStr)}(__v, __c) { if (!__v === !this.${id11(prevProp)}) return; this.${id11(prevProp)} = __v; this.__geaRequestRender(); }`;
               mergeObserveMethod(entry.observeKey, rerenderMethod);
               if (!stateProps.has(entry.observeKey)) {
                 stateProps.set(entry.observeKey, entry.pathParts);
@@ -7514,6 +8133,8 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
           const componentArrayDisposeTargets = [];
           const componentArrayMountMethods = [];
           const storeComponentArrayObservers = [];
+          const observeListConfigs = [];
+          const staticArrayRefreshOnMount = [];
           const mapItemAttrInfos = [];
           const tmplBody = templateMethod?.body.body ?? [];
           let tmplReturnIdx = -1;
@@ -7542,7 +8163,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 }
               }
               const propNames = getTemplatePropNames(classPath.node.body);
-              const methods = generateComponentArrayMethods(
+              const arrayResult = generateComponentArrayResult(
                 um,
                 arrayPropName,
                 imports,
@@ -7552,9 +8173,9 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 getTemplateParamIdentifier(classPath.node.body),
                 tmplSetupCtx
               );
-              if (methods.length > 0 && templateMethod) {
-                methods.forEach((method2) => classPath.node.body.body.push(method2));
-                const importSource = imports.get(isComponentSlot.componentTag);
+              if (arrayResult && templateMethod) {
+                classPath.node.body.body.push(arrayResult.itemPropsMethod);
+                const importSource = imports.get(arrayResult.componentTag);
                 if (importSource) {
                   const delegatedEvents = getHoistableRootEventsForImport(sourceFile, importSource).map((meta) => ({
                     eventType: meta.eventType,
@@ -7567,15 +8188,93 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                     appendCompiledEventMethods(classPath.node.body, delegatedEvents);
                   }
                 }
-                ensureConstructorCalls(classPath.node.body, getComponentArrayBuildMethodName(arrayPropName));
+                inlineIntoConstructor(classPath.node.body, [
+                  ...arrayResult.arrSetupStatements.map((s) => t18.cloneNode(s, true)),
+                  arrayResult.constructorInit
+                ]);
                 if (storeArrayAccess) {
-                  storeComponentArrayObservers.push({
+                  observeListConfigs.push({
                     storeVar: storeArrayAccess.storeVar,
-                    refreshMethodName: getComponentArrayRefreshMethodName(arrayPropName),
-                    pathParts: [storeArrayAccess.propName]
+                    pathParts: [storeArrayAccess.propName],
+                    arrayPropName,
+                    componentTag: arrayResult.componentTag,
+                    containerBindingId: arrayResult.containerBindingId,
+                    itemIdProperty: arrayResult.itemIdProperty
                   });
                 } else {
                   const computedDeps = (um.dependencies || collectUnresolvedDependencies([um], stateRefs, classPath.node.body)).filter((dep) => dep.storeVar || dep.pathParts[0] !== "props");
+                  const refreshMethodName = getComponentArrayRefreshMethodName(arrayPropName);
+                  const itemsName = getComponentArrayItemsName(arrayPropName);
+                  const itemPropsMethodNameRef = `__itemProps_${arrayPropName}`;
+                  const containerSuffix = arrayResult.containerBindingId;
+                  const containerExpr = containerSuffix ? t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__el")), [
+                    t18.stringLiteral(containerSuffix)
+                  ]) : jsExpr4`this.$(":scope")`;
+                  const itemIdProp = arrayResult.itemIdProperty;
+                  const keyFn = itemIdProp && itemIdProp !== ITEM_IS_KEY ? t18.arrowFunctionExpression(
+                    [t18.identifier("opt")],
+                    t18.memberExpression(t18.identifier("opt"), t18.identifier(itemIdProp))
+                  ) : itemIdProp === ITEM_IS_KEY ? t18.arrowFunctionExpression([t18.identifier("opt")], t18.identifier("opt")) : t18.arrowFunctionExpression(
+                    [t18.identifier("opt"), t18.identifier("__k")],
+                    t18.binaryExpression("+", t18.stringLiteral("__idx_"), t18.identifier("__k"))
+                  );
+                  const refreshMethod = t18.classMethod(
+                    "method",
+                    t18.identifier(refreshMethodName),
+                    [],
+                    t18.blockStatement([
+                      ...arrayResult.arrSetupStatements.map((s) => t18.cloneNode(s, true)),
+                      t18.variableDeclaration("const", [
+                        t18.variableDeclarator(
+                          t18.identifier("__arr"),
+                          t18.logicalExpression(
+                            "??",
+                            t18.cloneNode(arrayResult.arrAccessExpr, true),
+                            t18.arrayExpression([])
+                          )
+                        )
+                      ]),
+                      t18.variableDeclaration("const", [
+                        t18.variableDeclarator(
+                          t18.identifier("__new"),
+                          t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__reconcileList")), [
+                            t18.memberExpression(t18.thisExpression(), t18.identifier(itemsName)),
+                            t18.identifier("__arr"),
+                            t18.cloneNode(containerExpr, true),
+                            t18.identifier(arrayResult.componentTag),
+                            t18.arrowFunctionExpression(
+                              [t18.identifier("opt")],
+                              t18.callExpression(
+                                t18.memberExpression(t18.thisExpression(), t18.identifier(itemPropsMethodNameRef)),
+                                [t18.identifier("opt")]
+                              )
+                            ),
+                            t18.cloneNode(keyFn, true)
+                          ])
+                        )
+                      ]),
+                      t18.expressionStatement(
+                        t18.assignmentExpression(
+                          "=",
+                          t18.memberExpression(
+                            t18.memberExpression(t18.thisExpression(), t18.identifier(itemsName)),
+                            t18.identifier("length")
+                          ),
+                          t18.numericLiteral(0)
+                        )
+                      ),
+                      t18.expressionStatement(
+                        t18.callExpression(
+                          t18.memberExpression(
+                            t18.memberExpression(t18.thisExpression(), t18.identifier(itemsName)),
+                            t18.identifier("push")
+                          ),
+                          [t18.spreadElement(t18.identifier("__new"))]
+                        )
+                      )
+                    ])
+                  );
+                  classPath.node.body.body.push(refreshMethod);
                   if (computedDeps.length > 0) {
                     computedDeps.forEach((dep) => {
                       mergeObserveMethod(
@@ -7587,10 +8286,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                           t18.blockStatement([
                             t18.expressionStatement(
                               t18.callExpression(
-                                t18.memberExpression(
-                                  t18.thisExpression(),
-                                  t18.identifier(getComponentArrayRefreshMethodName(arrayPropName))
-                                ),
+                                t18.memberExpression(t18.thisExpression(), t18.identifier(refreshMethodName)),
                                 []
                               )
                             )
@@ -7600,13 +8296,13 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                       if (dep.storeVar) {
                         storeComponentArrayObservers.push({
                           storeVar: dep.storeVar,
-                          refreshMethodName: getComponentArrayRefreshMethodName(arrayPropName),
+                          refreshMethodName,
                           pathParts: dep.pathParts
                         });
                       }
                     });
                   }
-                  const itemPropsMethod = methods[0];
+                  const itemPropsMethod = arrayResult.itemPropsMethod;
                   if (itemPropsMethod && t18.isBlockStatement(itemPropsMethod.body)) {
                     const returnStmt = itemPropsMethod.body.body.find((s) => t18.isReturnStatement(s));
                     if (returnStmt?.argument && t18.isObjectExpression(returnStmt.argument)) {
@@ -7625,28 +8321,9 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                         const key = `${dep.storeVar}:${pathPartsToString(dep.pathParts)}`;
                         if (computedDepKeys.has(key)) continue;
                         computedDepKeys.add(key);
-                        mergeObserveMethod(
-                          dep.observeKey,
-                          t18.classMethod(
-                            "method",
-                            t18.identifier(getObserveMethodName(dep.pathParts, dep.storeVar)),
-                            [t18.identifier("value"), t18.identifier("change")],
-                            t18.blockStatement([
-                              t18.expressionStatement(
-                                t18.callExpression(
-                                  t18.memberExpression(
-                                    t18.thisExpression(),
-                                    t18.identifier(getComponentArrayRefreshMethodName(arrayPropName))
-                                  ),
-                                  []
-                                )
-                              )
-                            ])
-                          )
-                        );
                         storeComponentArrayObservers.push({
                           storeVar: dep.storeVar,
-                          refreshMethodName: getComponentArrayRefreshMethodName(arrayPropName),
+                          refreshMethodName,
                           pathParts: dep.pathParts
                         });
                       }
@@ -7655,17 +8332,19 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   const itemTemplateProps = collectPropNamesFromItemTemplate(um.itemTemplate, propNames);
                   const allStoreManaged = computedDeps.length > 0 && computedDeps.every((dep) => dep.storeVar);
                   componentArrayRefreshDeps.push({
-                    methodName: getComponentArrayRefreshMethodName(arrayPropName),
+                    methodName: refreshMethodName,
                     propNames: allStoreManaged ? [...itemTemplateProps] : [arrayPropName, ...itemTemplateProps]
                   });
                 }
                 componentArrayDisposeTargets.push(getComponentArrayItemsName(arrayPropName));
-                componentArrayMountMethods.push(getComponentArrayMountMethodName(arrayPropName));
-                replaceMapWithComponentArrayItems(
+                const wasReplacedInTemplate = replaceMapWithComponentArrayItems(
                   templateMethod,
                   um.computationExpr,
                   getComponentArrayItemsName(arrayPropName)
                 );
+                if (!wasReplacedInTemplate && !storeArrayAccess) {
+                  staticArrayRefreshOnMount.push(getComponentArrayRefreshMethodName(arrayPropName));
+                }
                 applied = true;
               }
               return;
@@ -7684,7 +8363,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             };
             unresolvedBindings.push({ info: um, binding: syntheticBinding });
             const prevEventLen = unresolvedEventHandlers.length;
-            const { method, handlerPropsInMap } = generateRenderItemMethod(
+            const { method, handlerPropsInMap, needsUnwrapHelper } = generateRenderItemMethod(
               syntheticBinding,
               imports,
               unresolvedEventHandlers,
@@ -7692,6 +8371,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               classPath.node.body,
               tmplSetupCtx
             );
+            if (needsUnwrapHelper) needsModuleLevelUnwrapHelper = true;
             const newHandlers = unresolvedEventHandlers.slice(prevEventLen);
             const tokenMatch = newHandlers[0]?.selector?.match(/data-gea-event="([^"]+)"/);
             mapItemAttrInfos.push({
@@ -7761,10 +8441,9 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   [t18.identifier("value"), t18.identifier("change")],
                   t18.blockStatement([
                     t18.expressionStatement(
-                      t18.callExpression(
-                        t18.memberExpression(t18.thisExpression(), t18.identifier("__geaSyncMap")),
-                        [t18.numericLiteral(mapIdx)]
-                      )
+                      t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__geaSyncMap")), [
+                        t18.numericLiteral(mapIdx)
+                      ])
                     )
                   ])
                 )
@@ -7782,7 +8461,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             }
             if (scanNodes.length > 0) {
               const prog = t18.program(scanNodes);
-              traverse10(prog, {
+              traverse11(prog, {
                 noScope: true,
                 Identifier(path) {
                   if (templatePropNames.has(path.node.name)) usedPropNames.add(path.node.name);
@@ -7865,7 +8544,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
           });
           const resolvedArrayMapDelegateKeys = /* @__PURE__ */ new Set();
           analysis.arrayMaps.forEach((arrayMap) => {
-            if (arrayMap.storeVar && arrayMap.arrayPathParts.length === 1) {
+            if (arrayMap.storeVar) {
               const storeRef = stateRefs.get(arrayMap.storeVar);
               const getterDepPaths = storeRef?.getterDeps?.get(arrayMap.arrayPathParts[0]);
               if (getterDepPaths && getterDepPaths.length > 0) {
@@ -7890,8 +8569,8 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             if (!t18.isClassMethod(member) || member.kind !== "get" || !t18.isIdentifier(member.key)) continue;
             const deps = [];
             const localRefs = /* @__PURE__ */ new Set();
-            const program9 = t18.program(member.body.body.map((s) => t18.cloneNode(s, true)));
-            traverse10(program9, {
+            const program10 = t18.program(member.body.body.map((s) => t18.cloneNode(s, true)));
+            traverse11(program10, {
               noScope: true,
               MemberExpression(mePath) {
                 if (t18.isThisExpression(mePath.node.object) && t18.isIdentifier(mePath.node.property)) {
@@ -7939,7 +8618,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 if (!t18.isIfStatement(stmt) || !(t18.isReturnStatement(stmt.consequent) || t18.isBlockStatement(stmt.consequent) && stmt.consequent.body.some((b) => t18.isReturnStatement(b))))
                   continue;
                 const guardProg = t18.program([t18.expressionStatement(t18.cloneNode(stmt.test, true))]);
-                traverse10(guardProg, {
+                traverse11(guardProg, {
                   noScope: true,
                   Identifier(idPath) {
                     if (t18.isMemberExpression(idPath.parent) && idPath.parent.property === idPath.node && !idPath.parent.computed)
@@ -8053,12 +8732,29 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             if (unresolvedMapKeys.has(observeKey)) continue;
             const handledByComponentArray = storeComponentArrayObservers.some(
               (obs) => obs.storeVar === storeVar && pathPartsToString(obs.pathParts) === pathPartsToString(propPath)
+            ) || observeListConfigs.some(
+              (olc) => olc.storeVar === storeVar && pathPartsToString(olc.pathParts) === pathPartsToString(propPath)
             );
             if (handledByComponentArray) continue;
             if (!childObserveGroups.has(observeKey)) {
               if (conditionalSlotIndices.length > 0) continue;
               if (analysis.conditionalSlotScopedStoreKeys?.has(observeKey)) continue;
-              mergeObserveMethod(observeKey, generateRerenderObserver(propPath, storeVar, guardStateKeys.has(observeKey)));
+              if (storeVar && propPath.length >= 1) {
+                const storeRef = stateRefs.get(storeVar);
+                const getterDepPaths = storeRef?.getterDeps?.get(propPath[0]);
+                if (getterDepPaths && getterDepPaths.length > 0) {
+                  const allDepsCovered = getterDepPaths.every(
+                    (depPath) => childObserveGroups.has(buildObserveKey(depPath, storeVar))
+                  );
+                  if (allDepsCovered) continue;
+                }
+              }
+              mergeObserveMethod(
+                observeKey,
+                generateRerenderObserver(propPath, storeVar, guardStateKeys.has(observeKey))
+              );
+            } else if (guardStateKeys.has(observeKey)) {
+              mergeObserveMethod(observeKey, generateRerenderObserver(propPath, storeVar, true));
             }
           }
           const childrenWithResolvedMap = /* @__PURE__ */ new Set();
@@ -8077,7 +8773,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               }
             };
             const wrapper = t18.expressionStatement(t18.cloneNode(childrenProp.value, true));
-            traverse10(t18.program([wrapper]), { noScope: true, ...check });
+            traverse11(t18.program([wrapper]), { noScope: true, ...check });
             if (hasMap) childrenWithResolvedMap.add(child.instanceVar);
           });
           if (childrenWithResolvedMap.size > 0 && analysis.arrayMaps.length > 0) {
@@ -8116,9 +8812,9 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             for (const member of classPath.node.body.body) {
               if (!t18.isClassMethod(member) || !t18.isIdentifier(member.key)) continue;
               const methodName = member.key.name;
-              const isRelevant = childrenWithResolvedMap.size > 0 && (methodName.startsWith("__buildProps_") || methodName.startsWith("__refreshChildProps_"));
+              const isRelevant = childrenWithResolvedMap.size > 0 && methodName.startsWith("__buildProps_");
               if (!isRelevant) continue;
-              traverse10(t18.program([t18.expressionStatement(t18.functionExpression(null, [], member.body))]), {
+              traverse11(t18.program([t18.expressionStatement(t18.functionExpression(null, [], member.body))]), {
                 noScope: true,
                 TemplateLiteral(tlPath) {
                   const tl = tlPath.node;
@@ -8161,19 +8857,33 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   return false;
                 }
                 return true;
-              }).map(
-                (child) => t18.expressionStatement(
+              }).map((child) => {
+                const updateExpr = t18.expressionStatement(
                   t18.callExpression(
                     t18.memberExpression(
-                      t18.thisExpression(),
-                      t18.identifier(`__refreshChildProps_${child.instanceVar.replace(/^_/, "")}`)
+                      t18.memberExpression(t18.thisExpression(), t18.identifier(child.instanceVar)),
+                      t18.identifier("__geaUpdateProps")
                     ),
-                    []
+                    [
+                      t18.callExpression(
+                        t18.memberExpression(
+                          t18.thisExpression(),
+                          t18.identifier(`__buildProps_${child.instanceVar.replace(/^_/, "")}`)
+                        ),
+                        []
+                      )
+                    ]
                   )
-                )
-              );
+                );
+                if (!child.lazy) return updateExpr;
+                const backingField = `__lazy${child.instanceVar}`;
+                return t18.ifStatement(
+                  t18.memberExpression(t18.thisExpression(), t18.identifier(backingField)),
+                  t18.blockStatement([updateExpr])
+                );
+              });
               if (existing && t18.isBlockStatement(existing.body)) {
-                existing.body.body.push(...calls);
+                existing.body.body.unshift(...calls);
               } else {
                 const method = t18.classMethod(
                   "method",
@@ -8266,10 +8976,15 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             addJoinToUnresolvedMapCalls(templateMethod, analysis.unresolvedMaps);
           }
           const componentArrayMaps = [];
+          const componentArrayItemPropsMethods = /* @__PURE__ */ new Map();
           const htmlArrayMaps = [];
           for (const arrayMap of analysis.arrayMaps) {
             const compChild = isUnresolvedMapWithComponentChild(
-              { itemTemplate: arrayMap.itemTemplate, itemVariable: arrayMap.itemVariable, containerSelector: arrayMap.containerSelector },
+              {
+                itemTemplate: arrayMap.itemTemplate,
+                itemVariable: arrayMap.itemVariable,
+                containerSelector: arrayMap.containerSelector
+              },
               imports
             );
             if (compChild) {
@@ -8308,7 +9023,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               computationExpr: computationExprSafe ?? computationExpr
             };
             const propNames = getTemplatePropNames(classPath.node.body);
-            const methods = generateComponentArrayMethods(
+            const arrayResult = generateComponentArrayResult(
               um,
               arrayPropName,
               imports,
@@ -8318,11 +9033,10 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               getTemplateParamIdentifier(classPath.node.body),
               tmplSetupCtx
             );
-            if (methods.length > 0 && templateMethod) {
-              methods.forEach((method) => classPath.node.body.body.push(method));
-              const importSource = imports.get(
-                isUnresolvedMapWithComponentChild(um, imports).componentTag
-              );
+            if (arrayResult && templateMethod) {
+              classPath.node.body.body.push(arrayResult.itemPropsMethod);
+              componentArrayItemPropsMethods.set(arrayMap, arrayResult.itemPropsMethod);
+              const importSource = imports.get(arrayResult.componentTag);
               if (importSource) {
                 const delegatedEvents = getHoistableRootEventsForImport(sourceFile, importSource).map((meta) => ({
                   eventType: meta.eventType,
@@ -8335,51 +9049,125 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   appendCompiledEventMethods(classPath.node.body, delegatedEvents);
                 }
               }
-              ensureConstructorCalls(classPath.node.body, getComponentArrayBuildMethodName(arrayPropName));
-              if (storeArrayAccess) {
-                storeComponentArrayObservers.push({
-                  storeVar: storeArrayAccess.storeVar,
-                  refreshMethodName: getComponentArrayRefreshMethodName(arrayPropName),
-                  pathParts: [storeArrayAccess.propName]
-                });
-              } else if (arrayMap.storeVar) {
-                const refreshMethodName = getComponentArrayRefreshMethodName(arrayPropName);
-                mergeObserveMethod(
-                  buildObserveKey(arrayMap.arrayPathParts, arrayMap.storeVar),
-                  t18.classMethod(
-                    "method",
-                    t18.identifier(getObserveMethodName(arrayMap.arrayPathParts, arrayMap.storeVar)),
-                    [t18.identifier("value"), t18.identifier("change")],
-                    t18.blockStatement([
-                      t18.expressionStatement(
-                        t18.callExpression(
-                          t18.memberExpression(t18.thisExpression(), t18.identifier(refreshMethodName)),
-                          []
-                        )
-                      )
-                    ])
-                  )
-                );
-                storeComponentArrayObservers.push({
+              inlineIntoConstructor(classPath.node.body, [
+                ...arrayResult.arrSetupStatements.map((s) => t18.cloneNode(s, true)),
+                arrayResult.constructorInit
+              ]);
+              if (arrayMap.storeVar) {
+                observeListConfigs.push({
                   storeVar: arrayMap.storeVar,
-                  refreshMethodName,
-                  pathParts: arrayMap.arrayPathParts
+                  pathParts: arrayMap.arrayPathParts,
+                  arrayPropName,
+                  componentTag: arrayResult.componentTag,
+                  containerBindingId: arrayResult.containerBindingId,
+                  itemIdProperty: arrayResult.itemIdProperty
                 });
               }
               componentArrayDisposeTargets.push(getComponentArrayItemsName(arrayPropName));
-              componentArrayMountMethods.push(getComponentArrayMountMethodName(arrayPropName));
               const mapReplaceExpr = storeArrayAccess ? t18.memberExpression(t18.identifier(storeArrayAccess.storeVar), t18.identifier(storeArrayAccess.propName)) : computationExpr;
-              replaceMapWithComponentArrayItems(
+              const wasReplaced = replaceMapWithComponentArrayItems(
                 templateMethod,
                 mapReplaceExpr,
                 getComponentArrayItemsName(arrayPropName)
               );
+              if (!wasReplaced && !arrayMap.storeVar) {
+                staticArrayRefreshOnMount.push(getComponentArrayRefreshMethodName(arrayPropName));
+              }
               applied = true;
             }
           }
+          for (const arrayMap of componentArrayMaps) {
+            if (!arrayMap.storeVar) continue;
+            const storeRef = stateRefs.get(arrayMap.storeVar);
+            const getterDepPaths = storeRef?.getterDeps?.get(arrayMap.arrayPathParts[0]);
+            if (!getterDepPaths || getterDepPaths.length === 0) continue;
+            const pathKey = arrayMap.arrayPathParts.join(".");
+            for (const depPath of getterDepPaths) {
+              const depObserveKey = buildObserveKey(depPath, arrayMap.storeVar);
+              const depMethodName = getObserveMethodName(depPath, arrayMap.storeVar);
+              const refreshStmt = t18.expressionStatement(
+                t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__refreshList")), [
+                  t18.stringLiteral(pathKey)
+                ])
+              );
+              const existing = addedMethods.get(depObserveKey);
+              if (existing && t18.isBlockStatement(existing.body)) {
+                const renderedGuardIdx = existing.body.body.findIndex(
+                  (s) => t18.isIfStatement(s) && t18.isMemberExpression(s.test) && t18.isIdentifier(s.test.property) && s.test.property.name === "rendered_"
+                );
+                if (renderedGuardIdx >= 0) {
+                  existing.body.body.splice(renderedGuardIdx, 0, refreshStmt);
+                } else {
+                  existing.body.body.push(refreshStmt);
+                }
+              } else {
+                const delegateMethod = t18.classMethod(
+                  "method",
+                  t18.identifier(depMethodName),
+                  [t18.identifier("__v"), t18.identifier("__c")],
+                  t18.blockStatement([refreshStmt])
+                );
+                mergeObserveMethod(depObserveKey, delegateMethod);
+              }
+            }
+          }
+          for (const arrayMap of componentArrayMaps) {
+            if (!arrayMap.storeVar) continue;
+            const itemPropsMethod = componentArrayItemPropsMethods.get(arrayMap);
+            if (!itemPropsMethod) continue;
+            const pathKey = arrayMap.arrayPathParts.join(".");
+            const storeRef = stateRefs.get(arrayMap.storeVar);
+            const getterDepPaths = storeRef?.getterDeps?.get(arrayMap.arrayPathParts[0]);
+            const getterDepKeys = new Set((getterDepPaths || []).map((dp) => buildObserveKey(dp, arrayMap.storeVar)));
+            const externalDeps = /* @__PURE__ */ new Map();
+            const clonedBody = t18.cloneNode(itemPropsMethod.body, true);
+            traverse11(t18.program([t18.expressionStatement(t18.arrowFunctionExpression([], clonedBody))]), {
+              noScope: true,
+              Identifier(idPath) {
+                if (idPath.parentPath && t18.isMemberExpression(idPath.parentPath.node) && idPath.parentPath.node.property === idPath.node && !idPath.parentPath.node.computed)
+                  return;
+                const ref = stateRefs.get(idPath.node.name);
+                if (!ref) return;
+                if (itemPropsMethod.params.some((p) => t18.isIdentifier(p) && p.name === idPath.node.name)) return;
+                if (ref.kind === "imported-destructured" && ref.storeVar && ref.propName) {
+                  const depKey = buildObserveKey([ref.propName], ref.storeVar);
+                  if (!getterDepKeys.has(depKey) && !externalDeps.has(depKey)) {
+                    externalDeps.set(depKey, { parts: [ref.propName], storeVar: ref.storeVar });
+                  }
+                }
+              },
+              MemberExpression(mePath) {
+                const resolved = resolvePath(mePath.node, stateRefs);
+                if (!resolved?.parts?.length || !resolved.isImportedState) return;
+                if (resolved.parts.some((p) => p === "__raw")) return;
+                const depKey = buildObserveKey(resolved.parts, resolved.storeVar);
+                if (!getterDepKeys.has(depKey) && !externalDeps.has(depKey)) {
+                  externalDeps.set(depKey, { parts: [...resolved.parts], storeVar: resolved.storeVar });
+                }
+              }
+            });
+            for (const [depKey, dep] of externalDeps) {
+              const depMethodName = getObserveMethodName(dep.parts, dep.storeVar);
+              if (!stateProps.has(depKey)) stateProps.set(depKey, dep.parts);
+              const delegateBody = t18.blockStatement([
+                t18.expressionStatement(
+                  t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__refreshList")), [
+                    t18.stringLiteral(pathKey)
+                  ])
+                )
+              ]);
+              const delegateMethod = t18.classMethod(
+                "method",
+                t18.identifier(depMethodName),
+                [t18.identifier("__v"), t18.identifier("__c")],
+                delegateBody
+              );
+              mergeObserveMethod(depKey, delegateMethod);
+            }
+          }
           const renderEventHandlers = [];
           htmlArrayMaps.forEach((arrayMap) => {
-            const { method } = generateRenderItemMethod(
+            const { method, needsUnwrapHelper } = generateRenderItemMethod(
               arrayMap,
               imports,
               renderEventHandlers,
@@ -8387,6 +9175,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               classPath.node.body,
               tmplSetupCtx
             );
+            if (needsUnwrapHelper) needsModuleLevelUnwrapHelper = true;
             if (method) {
               classPath.node.body.body.push(method);
               applied = true;
@@ -8405,42 +9194,9 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
             }
             const observeKey = buildObserveKey(arrayMap.arrayPathParts, arrayMap.storeVar);
             const arrayHandlerMethodName = getObserveMethodName(arrayMap.arrayPathParts, arrayMap.storeVar);
-            generateArrayHandlers(arrayMap, arrayHandlerMethodName).forEach(
-              (h) => {
-                mergeObserveMethod(observeKey, h);
-              }
-            );
-            if (arrayMap.storeVar && arrayMap.arrayPathParts.length === 1) {
-              const storeRef = stateRefs.get(arrayMap.storeVar);
-              const getterDepPaths = storeRef?.getterDeps?.get(arrayMap.arrayPathParts[0]);
-              if (getterDepPaths && getterDepPaths.length > 0) {
-                for (const depPath of getterDepPaths) {
-                  const depObserveKey = buildObserveKey(depPath, arrayMap.storeVar);
-                  const depMethodName = getObserveMethodName(depPath, arrayMap.storeVar);
-                  const delegateBody = t18.blockStatement([
-                    t18.expressionStatement(
-                      t18.callExpression(
-                        t18.memberExpression(t18.thisExpression(), t18.identifier(arrayHandlerMethodName)),
-                        [
-                          t18.memberExpression(
-                            t18.identifier(arrayMap.storeVar),
-                            t18.identifier(arrayMap.arrayPathParts[0])
-                          ),
-                          t18.nullLiteral()
-                        ]
-                      )
-                    )
-                  ]);
-                  const delegateMethod = t18.classMethod(
-                    "method",
-                    t18.identifier(depMethodName),
-                    [t18.identifier("__v"), t18.identifier("__c")],
-                    delegateBody
-                  );
-                  mergeObserveMethod(depObserveKey, delegateMethod);
-                }
-              }
-            }
+            generateArrayHandlers(arrayMap, arrayHandlerMethodName).forEach((h) => {
+              mergeObserveMethod(observeKey, h);
+            });
           });
           if ((analysis.conditionalSlots || []).length > 0) {
             const templatePropNames2 = getTemplatePropNames(classPath.node.body);
@@ -8448,7 +9204,8 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               classPath.node.body,
               analysis.conditionalSlots,
               templatePropNames2,
-              getTemplateParamIdentifier(classPath.node.body)
+              getTemplateParamIdentifier(classPath.node.body),
+              analysis.earlyReturnGuard
             );
           }
           if (htmlArrayMaps.length > 0) {
@@ -8468,17 +9225,14 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   t18.identifier(arrayMap.arrayPathParts[0])
                 );
               } else {
-                valueExpr = t18.memberExpression(
-                  t18.thisExpression(),
-                  t18.identifier(arrayMap.arrayPathParts[0])
-                );
+                valueExpr = t18.memberExpression(t18.thisExpression(), t18.identifier(arrayMap.arrayPathParts[0]));
               }
               afterRenderCalls.push(
                 t18.expressionStatement(
-                  t18.callExpression(
-                    t18.memberExpression(t18.thisExpression(), t18.identifier(methodName)),
-                    [valueExpr, t18.nullLiteral()]
-                  )
+                  t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(methodName)), [
+                    valueExpr,
+                    t18.nullLiteral()
+                  ])
                 )
               );
             });
@@ -8489,10 +9243,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 [],
                 t18.blockStatement([
                   t18.expressionStatement(
-                    t18.callExpression(
-                      t18.memberExpression(t18.super(), t18.identifier("onAfterRender")),
-                      []
-                    )
+                    t18.callExpression(t18.memberExpression(t18.super(), t18.identifier("onAfterRender")), [])
                   ),
                   ...afterRenderCalls
                 ])
@@ -8500,50 +9251,6 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               classPath.node.body.body.push(afterRenderMethod);
             }
           }
-          if (componentArrayMountMethods.length > 0) {
-            const mountCalls = componentArrayMountMethods.map(
-              (methodName) => t18.expressionStatement(
-                t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(methodName)), [])
-              )
-            );
-            const existingAfterRender = classPath.node.body.body.find(
-              (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === "onAfterRender"
-            );
-            if (existingAfterRender) {
-              existingAfterRender.body.body.push(...mountCalls);
-            } else {
-              const afterRenderMethod = t18.classMethod(
-                "method",
-                t18.identifier("onAfterRender"),
-                [],
-                t18.blockStatement([
-                  t18.expressionStatement(
-                    t18.callExpression(
-                      t18.memberExpression(t18.super(), t18.identifier("onAfterRender")),
-                      []
-                    )
-                  ),
-                  ...mountCalls
-                ])
-              );
-              classPath.node.body.body.push(afterRenderMethod);
-            }
-            const rerenderOverride = t18.classMethod(
-              "method",
-              t18.identifier("__geaRequestRender"),
-              [],
-              t18.blockStatement([
-                t18.expressionStatement(
-                  t18.callExpression(
-                    t18.memberExpression(t18.super(), t18.identifier("__geaRequestRender")),
-                    []
-                  )
-                ),
-                ...mountCalls.map((stmt) => t18.cloneNode(stmt, true))
-              ])
-            );
-            classPath.node.body.body.push(rerenderOverride);
-          }
           if (renderEventHandlers.length > 0) {
             applied = appendCompiledEventMethods(classPath.node.body, renderEventHandlers) || applied;
           }
@@ -8563,7 +9270,6 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               }
               return importedStores.get(storeVar);
             };
-            const prevValueInits = [];
             addedMethods.forEach((_method, observeKey) => {
               const { parts, storeVar } = parseObserveKey(observeKey);
               if (!storeVar) {
@@ -8572,82 +9278,39 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                   const compGetterDeps = componentGetterStoreDeps.get(parts[0]);
                   if (compGetterDeps && compGetterDeps.length > 0) {
                     const originalMethodName = getObserveMethodName(parts);
-                    const wrapperMethodName = `${originalMethodName}__via`;
-                    if (!classPath.node.body.body.some(
-                      (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === wrapperMethodName
-                    )) {
-                      classPath.node.body.body.push(
-                        t18.classMethod(
-                          "method",
-                          t18.identifier(wrapperMethodName),
-                          [t18.identifier("_v"), t18.identifier("change")],
-                          t18.blockStatement([
-                            t18.expressionStatement(
-                              t18.callExpression(
-                                t18.memberExpression(t18.thisExpression(), t18.identifier(originalMethodName)),
-                                [
-                                  t18.memberExpression(t18.thisExpression(), t18.identifier(parts[0])),
-                                  t18.nullLiteral()
-                                ]
-                              )
-                            )
-                          ])
-                        )
-                      );
-                    }
                     for (const dep of compGetterDeps) {
                       const depKey = buildObserveKey(dep.pathParts, dep.storeVar) + `__getter_${parts[0]}`;
                       ensureStoreGroup(dep.storeVar).observeHandlers.set(depKey, {
                         pathParts: dep.pathParts,
-                        methodName: wrapperMethodName
+                        methodName: originalMethodName,
+                        isVia: true,
+                        rereadExpr: t18.memberExpression(t18.thisExpression(), t18.identifier(parts[0]))
                       });
                     }
-                    const compPrevProp = `__geaPrev_${originalMethodName}`;
-                    prevValueInits.push(
-                      js7`try { this.${id11(compPrevProp)} = this.${id11(parts[0])}; } catch(_e) {}`
-                    );
                   }
                   return;
                 }
                 localObserveHandlers.set(observeKey, { pathParts: parts, methodName: getObserveMethodName(parts) });
                 return;
               }
-              if (parts.length === 1) {
+              {
                 const storeRef = stateRefs.get(storeVar);
                 const getterDepPaths = storeRef?.getterDeps?.get(parts[0]);
                 if (getterDepPaths && getterDepPaths.length > 0) {
                   const originalMethodName = getObserveMethodName(parts, storeVar);
-                  const wrapperMethodName = `${originalMethodName}__via`;
-                  if (!classPath.node.body.body.some(
-                    (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === wrapperMethodName
-                  )) {
-                    classPath.node.body.body.push(
-                      t18.classMethod(
-                        "method",
-                        t18.identifier(wrapperMethodName),
-                        [t18.identifier("_v"), t18.identifier("change")],
-                        t18.blockStatement([
-                          t18.expressionStatement(
-                            t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(originalMethodName)), [
-                              t18.memberExpression(t18.identifier(storeVar), t18.identifier(parts[0])),
-                              t18.nullLiteral()
-                            ])
-                          )
-                        ])
-                      )
-                    );
+                  let rereadExpr = t18.memberExpression(t18.identifier(storeVar), t18.identifier(parts[0]));
+                  for (let i = 1; i < parts.length; i++) {
+                    rereadExpr = t18.optionalMemberExpression(rereadExpr, t18.identifier(parts[i]), false, true);
                   }
                   for (const depPath of getterDepPaths) {
-                    const depKey = buildObserveKey(depPath, storeVar) + `__getter_${parts[0]}`;
+                    const depKey = buildObserveKey(depPath, storeVar) + `__getter_${parts.join("_")}`;
                     ensureStoreGroup(storeVar).observeHandlers.set(depKey, {
                       pathParts: depPath,
-                      methodName: wrapperMethodName
+                      methodName: originalMethodName,
+                      isVia: true,
+                      rereadExpr
                     });
                   }
-                  const prevProp = `__geaPrev_${originalMethodName}`;
-                  prevValueInits.push(
-                    js7`try { this.${id11(prevProp)} = ${t18.memberExpression(t18.identifier(storeVar), t18.identifier(parts[0]))}; } catch(_e) {}`
-                  );
                   return;
                 }
               }
@@ -8711,28 +9374,148 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 methodName: obs.refreshMethodName
               });
             }
+            if (guardStateKeys.size > 0) {
+              addedMethods.forEach((method, observeKey) => {
+                const { parts, storeVar: sv } = parseObserveKey(observeKey);
+                if (!sv) return;
+                if (parts.length >= 2) {
+                  for (let prefixLen = 1; prefixLen < parts.length; prefixLen++) {
+                    const prefixKey = buildObserveKey(parts.slice(0, prefixLen), sv);
+                    if (guardStateKeys.has(prefixKey)) {
+                      const guardCheck = t18.ifStatement(
+                        t18.binaryExpression(
+                          "==",
+                          t18.memberExpression(t18.identifier(sv), t18.identifier(parts[prefixLen - 1])),
+                          t18.nullLiteral()
+                        ),
+                        t18.returnStatement()
+                      );
+                      if (t18.isBlockStatement(method.body)) {
+                        method.body.body.unshift(guardCheck);
+                      }
+                      break;
+                    }
+                  }
+                } else if (parts.length === 1) {
+                  const storeRef = stateRefs.get(sv);
+                  if (storeRef?.getterDeps) {
+                    for (const [getterName, depPaths] of storeRef.getterDeps) {
+                      const isDepOfGetter = depPaths.some((dp) => dp.length === 1 && dp[0] === parts[0]);
+                      if (!isDepOfGetter) continue;
+                      const guardKey = buildObserveKey([getterName], sv);
+                      if (!guardStateKeys.has(guardKey)) continue;
+                      const guardCheck = t18.ifStatement(
+                        t18.binaryExpression(
+                          "==",
+                          t18.memberExpression(t18.identifier(sv), t18.identifier(getterName)),
+                          t18.nullLiteral()
+                        ),
+                        t18.returnStatement()
+                      );
+                      if (t18.isBlockStatement(method.body)) {
+                        method.body.body.unshift(guardCheck);
+                      }
+                      break;
+                    }
+                  }
+                }
+              });
+            }
+            {
+              const seen = /* @__PURE__ */ new Set();
+              const methodEntries = [];
+              addedMethods.forEach((method, observeKey) => {
+                if (seen.has(method)) return;
+                seen.add(method);
+                const name = getMethodName(method);
+                if (name) methodEntries.push({ observeKey, method, name });
+              });
+              const bodyGroups = /* @__PURE__ */ new Map();
+              for (const entry of methodEntries) {
+                const { storeVar } = parseObserveKey(entry.observeKey);
+                const bodyCode = (storeVar || "") + ":" + generate2(t18.blockStatement(entry.method.body.body)).code;
+                if (!bodyGroups.has(bodyCode)) bodyGroups.set(bodyCode, []);
+                bodyGroups.get(bodyCode).push(entry);
+              }
+              const renameMap = /* @__PURE__ */ new Map();
+              for (const [, group] of bodyGroups) {
+                if (group.length < 2) continue;
+                const canonical = group[0];
+                for (let i = 1; i < group.length; i++) {
+                  const dup = group[i];
+                  renameMap.set(dup.name, canonical.name);
+                  const idx = classPath.node.body.body.indexOf(dup.method);
+                  if (idx !== -1) classPath.node.body.body.splice(idx, 1);
+                }
+              }
+              if (renameMap.size > 0) {
+                for (const [, config] of importedStores) {
+                  for (const [key, entry] of config.observeHandlers) {
+                    if (renameMap.has(entry.methodName)) {
+                      config.observeHandlers.set(key, { ...entry, methodName: renameMap.get(entry.methodName) });
+                    }
+                  }
+                }
+                for (const [key, entry] of localObserveHandlers) {
+                  if (renameMap.has(entry.methodName)) {
+                    localObserveHandlers.set(key, { ...entry, methodName: renameMap.get(entry.methodName) });
+                  }
+                }
+              }
+            }
             if (importedStores.size > 0 || localObserveHandlers.size > 0 || mapRegistrations.length > 0) {
               const storeConfigs = Array.from(importedStores.entries()).map(([storeVar, config]) => ({
                 storeVar,
                 captureExpression: config.captureExpression,
-                observeHandlers: Array.from(config.observeHandlers.values()).map(({ pathParts, methodName }) => ({
-                  pathParts,
-                  methodName
-                }))
+                observeHandlers: Array.from(config.observeHandlers.values()).map(
+                  ({ pathParts, methodName, isVia, rereadExpr }) => ({
+                    pathParts,
+                    methodName,
+                    isVia,
+                    rereadExpr
+                  })
+                )
               }));
-              if (storeConfigs.length > 0 || mapRegistrations.length > 0) {
-                const createdHooksMethod = generateCreatedHooks(storeConfigs);
+              for (const olc of observeListConfigs) {
+                ensureStoreGroup(olc.storeVar);
+              }
+              if (storeConfigs.length > 0 || mapRegistrations.length > 0 || observeListConfigs.length > 0) {
+                const createdHooksMethod = generateCreatedHooks(
+                  storeConfigs,
+                  htmlArrayMaps.length > 0,
+                  observeListConfigs
+                );
                 if (mapRegistrations.length > 0) {
                   createdHooksMethod.body.body.push(...mapRegistrations);
                 }
-                if (prevValueInits.length > 0) {
-                  createdHooksMethod.body.body.push(...prevValueInits);
+                const generatedCreatedHooksBody = createdHooksMethod.body.body;
+                const existingCreatedHooks = classPath.node.body.body.find(
+                  (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === "createdHooks"
+                );
+                if (existingCreatedHooks) {
+                  existingCreatedHooks.body.body.unshift(...generatedCreatedHooksBody);
+                } else {
+                  classPath.node.body.body.push(createdHooksMethod);
                 }
-                classPath.node.body.body.push(createdHooksMethod);
+              }
+              if (staticArrayRefreshOnMount.length > 0) {
+                const refreshStmts = [...new Set(staticArrayRefreshOnMount)].map(
+                  (name) => t18.expressionStatement(
+                    t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(name)), [])
+                  )
+                );
+                const existingHook = classPath.node.body.body.find(
+                  (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === "onAfterRenderHooks"
+                );
+                if (existingHook) existingHook.body.body.push(...refreshStmts);
+                else
+                  classPath.node.body.body.push(
+                    t18.classMethod("method", t18.identifier("onAfterRenderHooks"), [], t18.blockStatement(refreshStmts))
+                  );
               }
               if (localObserveHandlers.size > 0) {
                 classPath.node.body.body.push(
-                  generateLocalStateObserverSetup(Array.from(localObserveHandlers.values()))
+                  generateLocalStateObserverSetup(Array.from(localObserveHandlers.values()), htmlArrayMaps.length > 0)
                 );
               }
             }
@@ -8741,6 +9524,14 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
       });
     }
   });
+  if (needsModuleLevelUnwrapHelper) {
+    const alreadyHas = ast.program.body.some(
+      (stmt) => t18.isVariableDeclaration(stmt) && stmt.declarations.some((d) => t18.isIdentifier(d.id) && d.id.name === "__v")
+    );
+    if (!alreadyHas) {
+      ast.program.body.unshift(buildValueUnwrapHelper());
+    }
+  }
   return applied;
 }
 function collectUnresolvedDependencies(unresolvedMaps, stateRefs, classBody2) {
@@ -8773,8 +9564,8 @@ function collectUnresolvedDependencies(unresolvedMaps, stateRefs, classBody2) {
     }
     const depExpr = resolveHelperCallExpressionForDeps(unresolvedMap.computationExpr, classBody2);
     const targetExpr = depExpr || unresolvedMap.computationExpr;
-    const program9 = t18.program([t18.expressionStatement(t18.cloneNode(targetExpr, true))]);
-    traverse10(program9, {
+    const program10 = t18.program([t18.expressionStatement(t18.cloneNode(targetExpr, true))]);
+    traverse11(program10, {
       noScope: true,
       MemberExpression(path) {
         const targetExpr2 = path.parentPath && t18.isCallExpression(path.parentPath.node) && path.parentPath.node.callee === path.node ? path.node.object : path.node;
@@ -8803,8 +9594,8 @@ function collectHelperMethodDependencies(expr, classBody2, stateRefs, deps) {
     (node) => t18.isClassMethod(node) && t18.isIdentifier(node.key) && node.key.name === helperMethodName
   );
   if (!helperMethod || !t18.isBlockStatement(helperMethod.body)) return false;
-  const program9 = t18.program(helperMethod.body.body.map((stmt) => t18.cloneNode(stmt, true)));
-  traverse10(program9, {
+  const program10 = t18.program(helperMethod.body.body.map((stmt) => t18.cloneNode(stmt, true)));
+  traverse11(program10, {
     noScope: true,
     MemberExpression(path) {
       const resolved = resolvePath(path.node, stateRefs);
@@ -8844,7 +9635,7 @@ function generateUnresolvedRelationalObserver(arrayMap, unresolvedMap, relBindin
       t18.memberExpression(t18.thisExpression(), t18.identifier("id")),
       t18.stringLiteral("-" + arrayMap.containerBindingId)
     )
-  ]) : jsExpr5`this.$(":scope")`;
+  ]) : jsExpr4`this.$(":scope")`;
   const setupStatements = replacePropRefsInStatements(
     (unresolvedMap.computationSetupStatements || []).map((s) => t18.cloneNode(s, true)),
     templatePropNames,
@@ -8866,7 +9657,7 @@ function generateUnresolvedRelationalObserver(arrayMap, unresolvedMap, relBindin
     method,
     js7`if (!this.rendered_) return;`,
     lazyInit2(containerName, containerLookup),
-    ...jsBlockBody5`if (!${containerRef}) return;`,
+    ...jsBlockBody4`if (!${containerRef}) return;`,
     ...setupStatements,
     t18.variableDeclaration("var", [
       t18.variableDeclarator(
@@ -8878,7 +9669,7 @@ function generateUnresolvedRelationalObserver(arrayMap, unresolvedMap, relBindin
         )
       )
     ]),
-    ...jsBlockBody5`
+    ...jsBlockBody4`
       var __items = ${containerRef}.querySelectorAll('[data-gea-item-id]');
       for (var __i = 0; __i < __items.length && __i < __arr.length; __i++) {
         var __child = __items[__i];
@@ -8909,18 +9700,14 @@ function generateMapRegistration(arrayMap, unresolvedMap, templatePropNames, who
       t18.memberExpression(t18.thisExpression(), t18.identifier("id")),
       t18.stringLiteral("-" + arrayMap.containerBindingId)
     )
-  ]) : jsExpr5`this.$(":scope")`;
+  ]) : jsExpr4`this.$(":scope")`;
   let arrExpr = t18.cloneNode(unresolvedMap.computationExpr || t18.arrayExpression([]), true);
-  let setupStatements = [];
+  let setupStatements = unresolvedMap.computationSetupStatements?.length ? unresolvedMap.computationSetupStatements.map((s) => t18.cloneNode(s, true)) : [];
   const needsReplace = templatePropNames && templatePropNames.size > 0 || wholeParamName;
   if (needsReplace) {
     arrExpr = replacePropRefsInExpression(arrExpr, templatePropNames || /* @__PURE__ */ new Set(), wholeParamName);
-    if (unresolvedMap.computationSetupStatements?.length) {
-      setupStatements = replacePropRefsInStatements(
-        unresolvedMap.computationSetupStatements.map((s) => t18.cloneNode(s, true)),
-        templatePropNames || /* @__PURE__ */ new Set(),
-        wholeParamName
-      );
+    if (setupStatements.length) {
+      setupStatements = replacePropRefsInStatements(setupStatements, templatePropNames || /* @__PURE__ */ new Set(), wholeParamName);
     }
   }
   const prunedSetup = pruneUnusedSetupStatements(setupStatements, arrExpr);
@@ -8948,7 +9735,7 @@ function generateMapRegistration(arrayMap, unresolvedMap, templatePropNames, who
 function collectFreeIdentifiers(nodes) {
   const names = /* @__PURE__ */ new Set();
   for (const node of nodes) {
-    traverse10(
+    traverse11(
       t18.isProgram(node) ? node : t18.program([t18.isStatement(node) ? node : t18.expressionStatement(node)]),
       {
         noScope: true,
@@ -9017,12 +9804,12 @@ function getArrayPropNameFromExpr(expr) {
   return null;
 }
 function replaceMapWithComponentArrayItems(templateMethod, arrayExpr, itemsName) {
-  if (!arrayExpr || !t18.isBlockStatement(templateMethod.body)) return;
+  if (!arrayExpr || !t18.isBlockStatement(templateMethod.body)) return false;
   const tempProg = t18.program([
     t18.expressionStatement(t18.arrowFunctionExpression(templateMethod.params, templateMethod.body))
   ]);
   let replaced = false;
-  traverse10(tempProg, {
+  traverse11(tempProg, {
     noScope: true,
     CallExpression(path) {
       if (replaced) return;
@@ -9038,19 +9825,12 @@ function replaceMapWithComponentArrayItems(templateMethod, arrayExpr, itemsName)
         toReplace = path.parentPath.parentPath;
       }
       const itemsAccess = t18.memberExpression(t18.thisExpression(), t18.identifier(itemsName));
-      const mapCallback = t18.arrowFunctionExpression(
-        [t18.identifier("__item")],
-        t18.templateLiteral(
-          [t18.templateElement({ raw: "", cooked: "" }), t18.templateElement({ raw: "", cooked: "" })],
-          [t18.identifier("__item")]
-        )
-      );
-      const mapCall = t18.callExpression(t18.memberExpression(itemsAccess, t18.identifier("map")), [mapCallback]);
-      const joinCall = t18.callExpression(t18.memberExpression(mapCall, t18.identifier("join")), [t18.stringLiteral("")]);
+      const joinCall = t18.callExpression(t18.memberExpression(itemsAccess, t18.identifier("join")), [t18.stringLiteral("")]);
       toReplace.replaceWith(joinCall);
       replaced = true;
     }
   });
+  return replaced;
 }
 function inlineIntoConstructor(classBody2, statements) {
   let ctor = classBody2.body.find(
@@ -9067,23 +9847,6 @@ function inlineIntoConstructor(classBody2, statements) {
   }
   ctor.body.body.push(...statements);
 }
-function ensureConstructorCalls(classBody2, methodName) {
-  let ctor = classBody2.body.find(
-    (member) => t18.isClassMethod(member) && t18.isIdentifier(member.key) && member.key.name === "constructor"
-  );
-  if (!ctor) {
-    ctor = appendToBody5(
-      jsMethod8`${id11("constructor")}(...args) {}`,
-      t18.expressionStatement(t18.callExpression(t18.super(), [t18.spreadElement(t18.identifier("args"))])),
-      t18.expressionStatement(t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(methodName)), []))
-    );
-    classBody2.body.unshift(ctor);
-    return;
-  }
-  ctor.body.body.push(
-    t18.expressionStatement(t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(methodName)), []))
-  );
-}
 function ensureDisposeCalls(classBody2, targets) {
   const disposeStatements = targets.map(
     (target) => js7`this.${id11(target)}?.forEach?.(item => item?.dispose?.());`
@@ -9151,28 +9914,47 @@ function ensureOnPropChangeMethod(classBody2, inlinePatchBodies, compiledChildre
       nonDirectChildren.push(child);
     }
   }
-  const childRefreshMethodNames = nonDirectChildren.filter((child) => child.dependencies.some((dep) => !dep.storeVar && dep.pathParts[0] === "props")).map((child) => `__refreshChildProps_${child.instanceVar.replace(/^_/, "")}`);
-  const arrayRefreshMethodNames = arrayRefreshDeps.filter((d) => d.propNames.length > 0).map((d) => d.methodName);
-  const refreshMethodNames = [.../* @__PURE__ */ new Set([...childRefreshMethodNames, ...arrayRefreshMethodNames])];
-  const refreshPropDeps = /* @__PURE__ */ new Map();
-  for (const child of nonDirectChildren) {
-    const methodName = `__refreshChildProps_${child.instanceVar.replace(/^_/, "")}`;
+  const childRefreshEntries = nonDirectChildren.filter((child) => child.dependencies.some((dep) => !dep.storeVar && dep.pathParts[0] === "props")).map((child) => {
     const depProps = /* @__PURE__ */ new Set();
     for (const dep of child.dependencies) {
       if (!dep.storeVar && dep.pathParts[0] === "props" && dep.pathParts.length > 1) {
         depProps.add(dep.pathParts[1]);
       }
     }
-    if (depProps.size > 0) {
-      refreshPropDeps.set(methodName, depProps);
-    }
-  }
+    return { child, depProps };
+  });
+  const arrayRefreshMethodNames = arrayRefreshDeps.filter((d) => d.propNames.length > 0).map((d) => d.methodName);
+  const refreshPropDeps = /* @__PURE__ */ new Map();
   for (const { methodName, propNames } of arrayRefreshDeps) {
     if (propNames.length > 0) {
       refreshPropDeps.set(methodName, new Set(propNames));
     }
   }
-  const refreshCalls = refreshMethodNames.map((name) => {
+  const childRefreshCalls = childRefreshEntries.map(({ child, depProps }) => {
+    const call = t18.expressionStatement(
+      t18.callExpression(
+        t18.memberExpression(
+          t18.memberExpression(t18.thisExpression(), t18.identifier(child.instanceVar)),
+          t18.identifier("__geaUpdateProps")
+        ),
+        [
+          t18.callExpression(
+            t18.memberExpression(t18.thisExpression(), t18.identifier(`__buildProps_${child.instanceVar.replace(/^_/, "")}`)),
+            []
+          )
+        ]
+      )
+    );
+    if (depProps.size > 0) {
+      const guard = Array.from(depProps).reduce((acc, prop) => {
+        const test = t18.binaryExpression("===", t18.identifier("key"), t18.stringLiteral(prop));
+        return acc ? t18.logicalExpression("||", acc, test) : test;
+      }, void 0);
+      return t18.ifStatement(guard, call);
+    }
+    return call;
+  });
+  const arrayRefreshCalls = arrayRefreshMethodNames.map((name) => {
     const deps = refreshPropDeps.get(name);
     const call = t18.expressionStatement(t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(name)), []));
     if (deps && deps.size > 0) {
@@ -9184,6 +9966,7 @@ function ensureOnPropChangeMethod(classBody2, inlinePatchBodies, compiledChildre
     }
     return call;
   });
+  const refreshCalls = [...childRefreshCalls, ...arrayRefreshCalls];
   const condPatchCalls = [];
   if (conditionalSlots.length > 0) {
     for (let i = 0; i < conditionalSlots.length; i++) {
@@ -9205,10 +9988,7 @@ function ensureOnPropChangeMethod(classBody2, inlinePatchBodies, compiledChildre
   const patchCalls = Array.from(inlinePatchBodies.entries()).map(
     ([propName, bodyStmts]) => t18.ifStatement(
       t18.binaryExpression("===", t18.identifier("key"), t18.stringLiteral(propName)),
-      t18.tryStatement(
-        t18.blockStatement(bodyStmts.map((s) => t18.cloneNode(s, true))),
-        t18.catchClause(null, t18.blockStatement([]))
-      )
+      t18.blockStatement(bodyStmts.map((s) => t18.cloneNode(s, true)))
     )
   );
   const unresolvedMapRefreshCalls = unresolvedMapPropRefreshDeps.map((dep) => {
@@ -9325,7 +10105,10 @@ function mergeKeyGuards(stmts) {
   }
   return result;
 }
-function generateConditionalPatchMethods(classBody2, slots, templatePropNames, wholeParamName) {
+function generateConditionalPatchMethods(classBody2, slots, templatePropNames, wholeParamName, earlyReturnGuard) {
+  const guardedRoot = earlyReturnGuard ? earlyReturnFalsyBindingName(earlyReturnGuard) : null;
+  const maybeOptStmts = (stmts) => guardedRoot ? optionalizeBindingRootInStatements(stmts, guardedRoot) : stmts;
+  const maybeOptExpr = (e) => guardedRoot ? optionalizeMemberChainsFromBindingRoot(e, guardedRoot) : e;
   const collectDeduped = (stmts, seen, out) => {
     for (const stmt of stmts) {
       if (t18.isVariableDeclaration(stmt)) {
@@ -9362,9 +10145,12 @@ function generateConditionalPatchMethods(classBody2, slots, templatePropNames, w
   const rpExpr = (e) => replacePropRefsInExpression(e, templatePropNames, wholeParamName);
   const rpStmts = (s) => replacePropRefsInStatements(s, templatePropNames, wholeParamName);
   const rewrittenCondExprs = slots.map((s) => rpExpr(t18.cloneNode(s.conditionExpr, true)));
-  const initSetup = pruneDeadParamDestructuring(
-    rpStmts(allSetupStatements.map((s) => t18.cloneNode(s, true))),
-    rewrittenCondExprs
+  const rewrittenCondExprsSafe = rewrittenCondExprs.map((e) => maybeOptExpr(e));
+  const initSetup = maybeOptStmts(
+    pruneDeadParamDestructuring(
+      rpStmts(allSetupStatements.map((s) => t18.cloneNode(s, true))),
+      rewrittenCondExprs
+    )
   );
   const condAssignments = [];
   for (let i = 0; i < slots.length; i++) {
@@ -9373,7 +10159,7 @@ function generateConditionalPatchMethods(classBody2, slots, templatePropNames, w
         t18.assignmentExpression(
           "=",
           t18.memberExpression(t18.thisExpression(), t18.identifier(`__geaCond_${i}`)),
-          t18.unaryExpression("!", t18.unaryExpression("!", rewrittenCondExprs[i]))
+          t18.unaryExpression("!", t18.unaryExpression("!", rewrittenCondExprsSafe[i]))
         )
       )
     );
@@ -9382,22 +10168,25 @@ function generateConditionalPatchMethods(classBody2, slots, templatePropNames, w
   for (let i = 0; i < slots.length; i++) {
     const slot = slots[i];
     const rewrittenCondExpr = rpExpr(t18.cloneNode(slot.conditionExpr, true));
-    const condSetup = pruneDeadParamDestructuring(
-      rpStmts(allSetupStatements.map((s) => t18.cloneNode(s, true))),
-      [rewrittenCondExpr]
+    const condSetup = maybeOptStmts(
+      pruneDeadParamDestructuring(rpStmts(allSetupStatements.map((s) => t18.cloneNode(s, true))), [
+        rewrittenCondExpr
+      ])
     );
-    const getCondBody = [...condSetup, t18.returnStatement(rewrittenCondExpr)];
+    const getCondBody = [...condSetup, t18.returnStatement(maybeOptExpr(rewrittenCondExpr))];
     const buildHtmlFn = (htmlExpr) => {
       if (!htmlExpr) return t18.nullLiteral();
       const clonedHtmlExpr = rpExpr(t18.cloneNode(htmlExpr, true));
-      const htmlSetup = pruneDeadParamDestructuring(
-        rpStmts(allHtmlSetupStatements.map((s) => t18.cloneNode(s, true))),
-        [clonedHtmlExpr]
+      const htmlSetup = maybeOptStmts(
+        pruneDeadParamDestructuring(rpStmts(allHtmlSetupStatements.map((s) => t18.cloneNode(s, true))), [
+          clonedHtmlExpr
+        ])
       );
+      const htmlExprSafe = maybeOptExpr(clonedHtmlExpr);
       if (htmlSetup.length > 0) {
-        return t18.arrowFunctionExpression([], t18.blockStatement([...htmlSetup, t18.returnStatement(clonedHtmlExpr)]));
+        return t18.arrowFunctionExpression([], t18.blockStatement([...htmlSetup, t18.returnStatement(htmlExprSafe)]));
       }
-      return t18.arrowFunctionExpression([], clonedHtmlExpr);
+      return t18.arrowFunctionExpression([], htmlExprSafe);
     };
     registerCondCalls.push(
       t18.expressionStatement(
@@ -9412,10 +10201,7 @@ function generateConditionalPatchMethods(classBody2, slots, templatePropNames, w
     );
   }
   const evalStatements = [...initSetup, ...condAssignments];
-  const initBody = evalStatements.length > 0 ? [
-    t18.tryStatement(t18.blockStatement(evalStatements), t18.catchClause(null, t18.blockStatement([]))),
-    ...registerCondCalls
-  ] : registerCondCalls;
+  const initBody = evalStatements.length > 0 ? [...evalStatements, ...registerCondCalls] : registerCondCalls;
   inlineIntoConstructor(classBody2, initBody);
 }
 function getTemplatePropNames(classBody2) {
@@ -9443,7 +10229,7 @@ function getTemplateParamIdentifier(classBody2) {
 function collectPropNamesFromItemTemplate(itemTemplate, templatePropNames) {
   if (!itemTemplate) return [];
   const used = /* @__PURE__ */ new Set();
-  traverse10(itemTemplate, {
+  traverse11(itemTemplate, {
     noScope: true,
     Identifier(path) {
       if (templatePropNames.has(path.node.name)) used.add(path.node.name);
@@ -9485,7 +10271,7 @@ function injectMapItemAttrsIntoTemplate(templateMethod, mapInfos) {
   const tempProg = t18.program([
     t18.expressionStatement(t18.arrowFunctionExpression(templateMethod.params, templateMethod.body))
   ]);
-  traverse10(tempProg, {
+  traverse11(tempProg, {
     noScope: true,
     CallExpression(path) {
       if (!t18.isMemberExpression(path.node.callee)) return;
@@ -9560,7 +10346,7 @@ function addJoinToUnresolvedMapCalls(templateMethod, _unresolvedMaps) {
   const tempProg = t18.program([
     t18.expressionStatement(t18.arrowFunctionExpression(templateMethod.params, templateMethod.body))
   ]);
-  traverse10(tempProg, {
+  traverse11(tempProg, {
     noScope: true,
     CallExpression(path) {
       if (!t18.isMemberExpression(path.node.callee)) return;
@@ -9593,7 +10379,7 @@ function replaceInlineMapWithRenderCall(classPath, arrayMap, renderMethodName) {
   const tempProg = t18.program([
     t18.expressionStatement(t18.arrowFunctionExpression(templateMethod.params, templateMethod.body))
   ]);
-  traverse10(tempProg, {
+  traverse11(tempProg, {
     noScope: true,
     CallExpression(path) {
       if (!t18.isMemberExpression(path.node.callee)) return;
@@ -9642,7 +10428,7 @@ function replaceMapInConditionalSlots(slots, arrayMap, renderMethodName) {
     for (const expr of [slot.truthyHtmlExpr, slot.falsyHtmlExpr]) {
       if (!expr) continue;
       const tempProg = t18.program([t18.expressionStatement(expr)]);
-      traverse10(tempProg, {
+      traverse11(tempProg, {
         noScope: true,
         CallExpression(path) {
           if (!t18.isMemberExpression(path.node.callee)) return;
@@ -9691,14 +10477,14 @@ function generateRerenderObserver(pathParts, storeVar, truthinessOnly) {
     const prevProp = `__geaPrev_${getObserveMethodName(pathParts, storeVar)}`;
     if (truthinessOnly) {
       method.body.body.push(
-        ...jsBlockBody5`
+        ...jsBlockBody4`
           if (!value === !this.${id11(prevProp)}) return;
           this.${id11(prevProp)} = value;
         `
       );
     } else {
       method.body.body.push(
-        ...jsBlockBody5`
+        ...jsBlockBody4`
           if (value === this.${id11(prevProp)}) return;
           this.${id11(prevProp)} = value;
         `
@@ -9707,15 +10493,7 @@ function generateRerenderObserver(pathParts, storeVar, truthinessOnly) {
   }
   method.body.body.push(
     t18.ifStatement(
-      t18.logicalExpression(
-        "&&",
-        t18.memberExpression(t18.thisExpression(), t18.identifier("rendered_")),
-        t18.binaryExpression(
-          "===",
-          t18.unaryExpression("typeof", t18.memberExpression(t18.thisExpression(), t18.identifier("__geaRequestRender"))),
-          t18.stringLiteral("function")
-        )
-      ),
+      t18.memberExpression(t18.thisExpression(), t18.identifier("rendered_")),
       t18.blockStatement([
         t18.expressionStatement(
           t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier("__geaRequestRender")), [])
@@ -9781,6 +10559,22 @@ function generateStateChildSwapMethod(classBody2, stateChildSlots) {
       setupStatements.push(t18.cloneNode(stmt, true));
     }
   }
+  const propsUpdateCalls = stateChildSlots.map((slot) => {
+    const buildPropsName = `__buildProps_${slot.childInstanceVar.replace(/^_/, "")}`;
+    const hasBuildProps = classBody2.body.some(
+      (m) => t18.isClassMethod(m) && t18.isIdentifier(m.key) && m.key.name === buildPropsName
+    );
+    if (!hasBuildProps) return null;
+    return t18.expressionStatement(
+      t18.callExpression(
+        t18.memberExpression(
+          t18.memberExpression(t18.thisExpression(), t18.identifier(slot.childInstanceVar)),
+          t18.identifier("__geaUpdateProps")
+        ),
+        [t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(buildPropsName)), [])]
+      )
+    );
+  }).filter(Boolean);
   const swapCalls = stateChildSlots.map((slot) => {
     const guardClone = t18.cloneNode(slot.guardExpr, true);
     return t18.expressionStatement(
@@ -9789,17 +10583,17 @@ function generateStateChildSwapMethod(classBody2, stateChildSlots) {
         t18.logicalExpression(
           "&&",
           guardClone,
-          t18.callExpression(t18.memberExpression(t18.thisExpression(), t18.identifier(slot.ensureMethodName)), [])
+          t18.memberExpression(t18.thisExpression(), t18.identifier(slot.childInstanceVar))
         )
       ])
     );
   });
-  const filteredSetup = pruneUnusedSetupDestructuring(setupStatements, swapCalls);
+  const filteredSetup = pruneUnusedSetupDestructuring(setupStatements, [...propsUpdateCalls, ...swapCalls]);
   const method = t18.classMethod(
     "method",
     t18.identifier("__geaSwapStateChildren"),
     [],
-    t18.blockStatement([...filteredSetup, ...swapCalls])
+    t18.blockStatement([...filteredSetup, ...propsUpdateCalls, ...swapCalls])
   );
   classBody2.body.push(method);
 }
@@ -9810,7 +10604,7 @@ import { existsSync as existsSync2, readFileSync as readFileSync2 } from "fs";
 import { dirname as dirname2, resolve as resolve2 } from "path";
 import { createRequire as createRequire12 } from "module";
 var require13 = createRequire12(import.meta.url);
-var traverse11 = require13("@babel/traverse").default;
+var traverse12 = require13("@babel/traverse").default;
 function resolveImportPath2(importer, source) {
   const base = resolve2(dirname2(importer), source);
   const candidates = [
@@ -9837,8 +10631,8 @@ function isPrivateName(name) {
 function extractGetterStatePaths(method) {
   if (!t19.isBlockStatement(method.body)) return null;
   const paths = /* @__PURE__ */ new Map();
-  const program9 = t19.program(method.body.body.map((stmt) => t19.cloneNode(stmt, true)));
-  traverse11(program9, {
+  const program10 = t19.program(method.body.body.map((stmt) => t19.cloneNode(stmt, true)));
+  traverse12(program10, {
     noScope: true,
     MemberExpression(path) {
       const node = path.node;
@@ -9878,7 +10672,7 @@ function analyzeStoreFile(filePath) {
   const parsed = parseSource(source);
   if (!parsed?.ast) return null;
   const result = /* @__PURE__ */ new Map();
-  traverse11(parsed.ast, {
+  traverse12(parsed.ast, {
     ClassDeclaration(classPath) {
       if (!classPath.node.superClass || !t19.isIdentifier(classPath.node.superClass) || classPath.node.superClass.name !== "Store") {
         return;
@@ -9935,7 +10729,7 @@ function getStoreFields(filePath) {
   const parsed = parseSource(source);
   if (!parsed?.ast) return null;
   const fields = /* @__PURE__ */ new Set();
-  traverse11(parsed.ast, {
+  traverse12(parsed.ast, {
     ClassDeclaration(classPath) {
       if (!classPath.node.superClass || !t19.isIdentifier(classPath.node.superClass) || classPath.node.superClass.name !== "Store") {
         return;
@@ -9978,7 +10772,7 @@ function analyzeStoreGetters(sourceFile, storeImports) {
 // src/transform-component.ts
 import { createRequire as createRequire13 } from "module";
 var require14 = createRequire13(import.meta.url);
-var traverse12 = require14("@babel/traverse").default;
+var traverse13 = require14("@babel/traverse").default;
 function transformComponentFile(ast, imports, storeImports, className, sourceFile, originalAST, compImportsUsedAsTags, knownComponentImports = /* @__PURE__ */ new Set()) {
   let transformed = false;
   const stateRefs = collectStateReferences(originalAST, storeImports);
@@ -9999,7 +10793,7 @@ function transformComponentFile(ast, imports, storeImports, className, sourceFil
   const compiledChildren = [];
   const eventIdCounter = { value: 0 };
   const preTransformAnalysis = /* @__PURE__ */ new Map();
-  traverse12(ast, {
+  traverse13(ast, {
     ClassMethod(path) {
       if (!t20.isIdentifier(path.node.key) || path.node.key.name !== "template") return;
       const ownerClass = path.findParent((p) => t20.isClassDeclaration(p.node));
@@ -10063,7 +10857,8 @@ function transformComponentFile(ast, imports, storeImports, className, sourceFil
         elementPathToBindingId: analysis.elementPathToBindingId,
         templateSetupContext: {
           params: path.node.params,
-          statements: returnIndex >= 0 ? body.slice(0, returnIndex) : []
+          statements: returnIndex >= 0 ? body.slice(0, returnIndex) : [],
+          earlyReturnBarrierIndex: analysis.earlyReturnBarrierIndex
         },
         sourceFile,
         isRoot: true,
@@ -10279,7 +11074,7 @@ function transformComponentFile(ast, imports, storeImports, className, sourceFil
 }
 function transformNonComponentJSX(ast, imports) {
   let transformed = false;
-  traverse12(ast, {
+  traverse13(ast, {
     ClassMethod(path) {
       if (!t20.isIdentifier(path.node.key) || path.node.key.name !== "template") return;
       const body = path.node.body.body;
@@ -10375,7 +11170,7 @@ function addJoinToMapCallsInTemplates(ast) {
 function ensureComponentImport(ast, imports) {
   if (imports.has("Component")) return;
   let geaImportPath = null;
-  traverse12(ast, {
+  traverse13(ast, {
     ImportDeclaration(path) {
       if (path.node.source.value === "@geajs/core") {
         geaImportPath = path;
@@ -10399,11 +11194,11 @@ function ensureComponentImport(ast, imports) {
   imports.set("Component", "@geajs/core");
 }
 function transformRemainingJSX(ast, imports) {
-  traverse12(ast, {
+  traverse13(ast, {
     noScope: true,
     JSXElement(path) {
-      const classMethod7 = path.findParent((p) => t20.isClassMethod(p.node));
-      if (classMethod7 && t20.isClassMethod(classMethod7.node) && t20.isIdentifier(classMethod7.node.key) && classMethod7.node.key.name === "template")
+      const classMethod8 = path.findParent((p) => t20.isClassMethod(p.node));
+      if (classMethod8 && t20.isClassMethod(classMethod8.node) && t20.isIdentifier(classMethod8.node.key) && classMethod8.node.key.name === "template")
         return;
       try {
         path.replaceWith(transformJSXToTemplate(path.node, { imports }));
@@ -10412,8 +11207,8 @@ function transformRemainingJSX(ast, imports) {
       }
     },
     JSXFragment(path) {
-      const classMethod7 = path.findParent((p) => t20.isClassMethod(p.node));
-      if (classMethod7 && t20.isClassMethod(classMethod7.node) && t20.isIdentifier(classMethod7.node.key) && classMethod7.node.key.name === "template")
+      const classMethod8 = path.findParent((p) => t20.isClassMethod(p.node));
+      if (classMethod8 && t20.isClassMethod(classMethod8.node) && t20.isIdentifier(classMethod8.node.key) && classMethod8.node.key.name === "template")
         return;
       try {
         path.replaceWith(transformJSXFragmentToTemplate(path.node, { imports }));
@@ -10428,13 +11223,13 @@ function transformRemainingJSX(ast, imports) {
 import * as t21 from "@babel/types";
 import { createRequire as createRequire14 } from "module";
 var require15 = createRequire14(import.meta.url);
-var traverse13 = require15("@babel/traverse").default;
+var traverse14 = require15("@babel/traverse").default;
 function convertFunctionalToClass(ast, info, imports) {
   let params = [t21.identifier("props")];
   let templateBody = [];
   let removeVarDeclPath = null;
   let exportPath = null;
-  traverse13(ast, {
+  traverse14(ast, {
     ExportDefaultDeclaration(path) {
       exportPath = path;
       const decl = path.node.declaration;
@@ -10490,16 +11285,16 @@ function convertFunctionalToClass(ast, info, imports) {
   if (removeVarDeclPath) {
     removeVarDeclPath.remove();
   }
-  const program9 = ast.program;
-  const idx = program9.body.indexOf(exportPath.node);
+  const program10 = ast.program;
+  const idx = program10.body.indexOf(exportPath.node);
   if (idx >= 0) {
-    program9.body[idx] = t21.exportDefaultDeclaration(classDecl);
+    program10.body[idx] = t21.exportDefaultDeclaration(classDecl);
   }
 }
 function ensureComponentImport2(ast, imports) {
   if (imports.get("Component")) return;
   let geaImportPath = null;
-  traverse13(ast, {
+  traverse14(ast, {
     ImportDeclaration(path) {
       if (path.node.source.value === "@geajs/core") {
         geaImportPath = path;
@@ -10526,8 +11321,8 @@ import { dirname as dirname3, relative, resolve as resolve3 } from "path";
 import { existsSync as existsSync3, readFileSync as readFileSync3, writeFileSync } from "fs";
 import { fileURLToPath } from "url";
 var pluginDir = dirname3(fileURLToPath(import.meta.url));
-var traverse14 = typeof babelTraverse.default === "function" ? babelTraverse.default : babelTraverse;
-var generate2 = typeof babelGenerator.default === "function" ? babelGenerator.default : babelGenerator;
+var traverse15 = typeof babelTraverse2.default === "function" ? babelTraverse2.default : babelTraverse2;
+var generate3 = typeof babelGenerator2.default === "function" ? babelGenerator2.default : babelGenerator2;
 var RECONCILE_ID = "virtual:gea-reconcile";
 var RESOLVED_RECONCILE_ID = "\0" + RECONCILE_ID;
 var HMR_RUNTIME_ID = "virtual:gea-hmr";
@@ -10865,7 +11660,7 @@ function geaPlugin() {
           convertFunctionalToClass(ast, functionalComponentInfo, imports);
           componentClassName = functionalComponentInfo.name;
           componentClassNames = [functionalComponentInfo.name];
-          const freshCode = generate2(ast, { retainLines: true }).code;
+          const freshCode = generate3(ast, { retainLines: true }).code;
           const freshParsed = parseSource(freshCode);
           if (freshParsed) {
             ast = freshParsed.ast;
@@ -10887,7 +11682,7 @@ function geaPlugin() {
         const storeImports = /* @__PURE__ */ new Map();
         const knownComponentImports = /* @__PURE__ */ new Set();
         const namedImportSources = /* @__PURE__ */ new Map();
-        traverse14(ast, {
+        traverse15(ast, {
           ExportDefaultDeclaration() {
             isDefaultExport = true;
           },
@@ -10910,7 +11705,8 @@ function geaPlugin() {
                     storeImports.set(spec.local.name, source);
                   }
                   const importedName = spec.imported?.name ?? spec.local.name;
-                  if (source === "@geajs/core" && isComponentTag(importedName)) {
+                  const geaCoreBaseClasses = ["Component", "Store"];
+                  if (source === "@geajs/core" && isComponentTag(importedName) && !geaCoreBaseClasses.includes(importedName)) {
                     knownComponentImports.add(spec.local.name);
                   }
                 }
@@ -10957,7 +11753,7 @@ function geaPlugin() {
           if (hmrAdded) transformed = true;
         }
         if (!transformed) return null;
-        const output = generate2(ast, { sourceMaps: true, sourceFileName: cleanId }, code);
+        const output = generate3(ast, { sourceMaps: true, sourceFileName: cleanId }, code);
         return { code: output.code, map: output.map };
       } catch (error) {
         if (error?.__geaCompileError) {