@geajs/vite-plugin 1.0.4 → 1.0.5

package/dist/index.js

@@ -632,6 +632,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 +792,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) {
@@ -1973,8 +1992,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;
+        }
       }
     }
   });
@@ -2676,8 +2711,12 @@ function collectAllStateAccesses(templateMethod, stateRefs, stateProps) {
     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 +2725,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]);
@@ -3146,6 +3182,51 @@ 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) {
@@ -3223,20 +3304,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;
@@ -3629,13 +3710,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 +3935,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) {
@@ -3892,7 +3982,7 @@ function processElement(node, parts, ctx, elementPath = []) {
         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 +4090,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 +4098,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,7 +4209,11 @@ 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(
+    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,
@@ -4472,7 +4565,7 @@ 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;
@@ -4496,7 +4589,8 @@ 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, {
     ClassDeclaration(path) {
@@ -4516,17 +4610,63 @@ 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);
     }
   });
 }
@@ -4545,19 +4685,52 @@ function injectComponentRegistrations(ast, componentInstances) {
     }
   });
 }
-function buildInstanceStatements(instances) {
+function buildInstanceStatements(instances, directForwardingChildren) {
   const stmts = [];
   instances.forEach((child) => {
-    stmts.push(js2`this.${id4(child.instanceVar)} = null;`);
+    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 getEnsureChildMethodName(child) {
-  return `__ensureChild_${child.instanceVar.replace(/^_/, "")}`;
-}
 function collectBindingNames(stmt) {
   if (t11.isVariableDeclaration(stmt)) {
     const names = [];
@@ -4621,102 +4794,15 @@ 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 * 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";
@@ -4774,8 +4860,8 @@ 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.identifier(textExpr.storeVar),
+        t12.identifier("__store")
       ),
       textExpr.pathParts
     );
@@ -4793,13 +4879,27 @@ function rewriteStateRefs(expr, stateRefs) {
       const ref = stateRefs.get(path.node.name);
       if (ref.kind === "local") {
         path.replaceWith(t12.thisExpression());
+      } else if (ref.kind === "imported-destructured" && ref.storeVar && ref.propName) {
+        path.replaceWith(
+          t12.memberExpression(
+            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.memberExpression(t12.thisExpression(), t12.identifier("__stores")),
-            t12.identifier(path.node.name)
+            t12.identifier(path.node.name),
+            t12.identifier("__store")
           )
         );
+        path.skip();
       }
     }
   });
@@ -4834,6 +4934,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) {
@@ -5125,6 +5229,9 @@ 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();
@@ -5362,7 +5469,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) {
@@ -5432,8 +5539,26 @@ 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(
@@ -5799,22 +5924,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";
@@ -5881,32 +6009,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 +6096,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()]
         )
       )
     ];
@@ -6066,8 +6200,8 @@ function generateArrayConditionalPatchObserver(arrayMap, bindings, methodName) {
   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.identifier(arrayMap.storeVar || "store"),
+      t15.identifier("__store")
     ),
     arrayPath
   ) : buildMemberChain(t15.thisExpression(), arrayPath);
@@ -6127,8 +6261,8 @@ function generateArrayConditionalRerenderObserver(arrayMap, methodName) {
   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.identifier(arrayMap.storeVar || "store"),
+      t15.identifier("__store")
     ),
     arrayPath
   ) : buildMemberChain(t15.thisExpression(), arrayPath);
@@ -6212,15 +6346,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 +6378,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(
@@ -6291,21 +6418,19 @@ function renameItemVariable(expr, itemVariable) {
 }
 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 +6490,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 +6681,7 @@ 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 = [];
@@ -6641,7 +6759,6 @@ function generateRenderItemMethod(arrayMap, imports, eventHandlers, eventIdCount
   const method = appendToBody4(
     baseMethod,
     ...rewrittenSetup,
-    ...needsUnwrapHelper ? [buildValueUnwrapHelper()] : [],
     ...rewrittenCallbackBody,
     ...handlerRegStmts,
     returnStmt
@@ -6665,12 +6782,12 @@ 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;
@@ -6689,20 +6806,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(),
@@ -6761,17 +6872,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,169 +6898,67 @@ 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 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 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 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 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];
+  const constructorInit = t17.expressionStatement(
+    t17.assignmentExpression(
+      "=",
+      t17.memberExpression(t17.thisExpression(), t17.identifier(itemsName)),
+      mapCallExpr
+    )
+  );
+  return {
+    itemPropsMethod,
+    constructorInit,
+    componentTag: comp.componentTag,
+    containerBindingId: um.containerBindingId,
+    itemIdProperty: itemIdProp,
+    arrAccessExpr,
+    arrSetupStatements
+  };
 }
 
 // src/apply-reactivity.ts
@@ -6987,30 +6985,164 @@ 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) {
-      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) {} }
+    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(
+        t18.expressionStatement(
+          t18.callExpression(
+            t18.memberExpression(t18.thisExpression(), t18.identifier("__observeList")),
+            [storeVarExpr, pathArray, t18.objectExpression(configProps)]
+          )
+        )
       );
     }
   }
@@ -7018,30 +7150,34 @@ 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);
@@ -7200,22 +7336,46 @@ 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(
@@ -7514,6 +7674,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
           const componentArrayDisposeTargets = [];
           const componentArrayMountMethods = [];
           const storeComponentArrayObservers = [];
+          const observeListConfigs = [];
           const mapItemAttrInfos = [];
           const tmplBody = templateMethod?.body.body ?? [];
           let tmplReturnIdx = -1;
@@ -7542,7 +7703,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 +7713,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 +7728,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(
@@ -7589,7 +7828,7 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                               t18.callExpression(
                                 t18.memberExpression(
                                   t18.thisExpression(),
-                                  t18.identifier(getComponentArrayRefreshMethodName(arrayPropName))
+                                  t18.identifier(refreshMethodName)
                                 ),
                                 []
                               )
@@ -7600,13 +7839,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 +7864,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,12 +7875,11 @@ 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(
                   templateMethod,
                   um.computationExpr,
@@ -7684,7 +7903,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 +7911,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({
@@ -7865,7 +8085,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) {
@@ -8053,12 +8273,26 @@ 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;
+              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();
@@ -8116,7 +8350,7 @@ 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))]), {
                 noScope: true,
@@ -8165,15 +8399,23 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 (child) => 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 (existing && t18.isBlockStatement(existing.body)) {
-                existing.body.body.push(...calls);
+                existing.body.body.unshift(...calls);
               } else {
                 const method = t18.classMethod(
                   "method",
@@ -8266,6 +8508,7 @@ 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(
@@ -8308,7 +8551,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 +8561,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,39 +8577,21 @@ 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(
                 templateMethod,
@@ -8377,9 +8601,92 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
               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 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(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);
+            traverse10(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 +8694,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;
@@ -8410,24 +8718,28 @@ function applyStaticReactivity(ast, originalAST, className, sourceFile, imports,
                 mergeObserveMethod(observeKey, h);
               }
             );
-            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) {
                 for (const depPath of getterDepPaths) {
                   const depObserveKey = buildObserveKey(depPath, arrayMap.storeVar);
                   const depMethodName = getObserveMethodName(depPath, arrayMap.storeVar);
+                  let rereadExpr = t18.memberExpression(
+                    t18.identifier(arrayMap.storeVar),
+                    t18.identifier(arrayMap.arrayPathParts[0])
+                  );
+                  for (let i = 1; i < arrayMap.arrayPathParts.length; i++) {
+                    rereadExpr = t18.memberExpression(
+                      rereadExpr,
+                      t18.identifier(arrayMap.arrayPathParts[i])
+                    );
+                  }
                   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()
-                        ]
+                        [rereadExpr, t18.nullLiteral()]
                       )
                     )
                   ]);
@@ -8500,50 +8812,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 +8831,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 +8839,42 @@ 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.memberExpression(rereadExpr, t18.identifier(parts[i]));
                   }
                   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 +8938,53 @@ 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 || parts.length < 2) return;
+                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;
+                  }
+                }
+              });
+            }
             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 }) => ({
+                observeHandlers: Array.from(config.observeHandlers.values()).map(({ pathParts, methodName, isVia, rereadExpr }) => ({
                   pathParts,
-                  methodName
+                  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);
-                }
                 classPath.node.body.body.push(createdHooksMethod);
               }
               if (localObserveHandlers.size > 0) {
                 classPath.node.body.body.push(
-                  generateLocalStateObserverSetup(Array.from(localObserveHandlers.values()))
+                  generateLocalStateObserverSetup(Array.from(localObserveHandlers.values()), htmlArrayMaps.length > 0)
                 );
               }
             }
@@ -8741,6 +8993,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) {
@@ -8844,7 +9104,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 +9126,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 +9138,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,15 +9169,15 @@ 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) {
+    if (setupStatements.length) {
       setupStatements = replacePropRefsInStatements(
-        unresolvedMap.computationSetupStatements.map((s) => t18.cloneNode(s, true)),
+        setupStatements,
         templatePropNames || /* @__PURE__ */ new Set(),
         wholeParamName
       );
@@ -9038,15 +9298,7 @@ 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;
     }
@@ -9067,23 +9319,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 +9386,50 @@ 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 +9441,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 +9463,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) => {
@@ -9413,7 +9668,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([]))),
+    t18.tryStatement(t18.blockStatement(evalStatements), loggingCatchClause()),
     ...registerCondCalls
   ] : registerCondCalls;
   inlineIntoConstructor(classBody2, initBody);
@@ -9691,14 +9946,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;
         `
@@ -9781,6 +10036,27 @@ 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 +10065,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);
 }
@@ -10402,8 +10678,8 @@ function transformRemainingJSX(ast, imports) {
   traverse12(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 +10688,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 }));
@@ -10910,7 +11186,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);
                   }
                 }