@barefootjs/go-template 0.33.3 → 0.33.6

package/dist/vite.js

@@ -8,7 +8,7 @@ import { devModuleUrl, loadManifest, resolveDevOrigin, resolveScriptAssets, toPo
 import ts25 from "typescript";
 
 // ../jsx/src/analyzer.ts
-import ts9 from "typescript";
+import ts10 from "typescript";
 
 // ../jsx/src/expression-parser.ts
 import ts from "typescript";
@@ -1939,7 +1939,7 @@ function identifierPath(callee) {
 }
 
 // ../jsx/src/prop-rewrite.ts
-import ts5 from "typescript";
+import ts7 from "typescript";
 
 // ../jsx/src/ir-to-client-js/utils.ts
 import ts3 from "typescript";
@@ -2166,19 +2166,61 @@ function resolveJsxChildrenProp(props) {
     return [];
   return prop.value.children ?? [];
 }
+// ../jsx/src/ir-to-client-js/component-scope.ts
+function buildImportAliasMap(imports) {
+  const aliases = new Map;
+  for (const imp of imports) {
+    if (imp.isTypeOnly)
+      continue;
+    for (const spec of imp.specifiers) {
+      if (spec.isTypeOnly || spec.isDefault || spec.isNamespace || spec.alias === null)
+        continue;
+      aliases.set(spec.alias, spec.name);
+    }
+  }
+  return aliases;
+}
+
 // ../jsx/src/ir-to-client-js/csr-substitute.ts
+import ts5 from "typescript";
+
+// ../jsx/src/props-binding.ts
 import ts4 from "typescript";
+function isIdentifierName(key) {
+  if (key.length === 0)
+    return false;
+  for (let i = 0;i < key.length; ) {
+    const cp = key.codePointAt(i);
+    const ok = i === 0 ? ts4.isIdentifierStart(cp, ts4.ScriptTarget.Latest) : ts4.isIdentifierPart(cp, ts4.ScriptTarget.Latest);
+    if (!ok)
+      return false;
+    i += cp > 65535 ? 2 : 1;
+  }
+  return true;
+}
+function propsDestructureBinding(p) {
+  const callerKey = p.sourceName ?? p.name;
+  const localName = p.name;
+  const binding = callerKey === localName ? localName : `${isIdentifierName(callerKey) ? callerKey : JSON.stringify(callerKey)}: ${localName}`;
+  return p.defaultValue ? `${binding} = ${p.defaultValue}` : binding;
+}
+var EMPTY_SET = new Set;
+
+// ../jsx/src/ir-to-client-js/csr-substitute.ts
 function extractFreeIdentifiersFromText(text) {
   if (!text || text.trim().length === 0)
     return new Set;
-  const sf = ts4.createSourceFile("__free_ids__.ts", `(${text});`, ts4.ScriptTarget.Latest, true, ts4.ScriptKind.TS);
+  const sf = ts5.createSourceFile("__free_ids__.ts", `(${text});`, ts5.ScriptTarget.Latest, true, ts5.ScriptKind.TS);
   const stmt = sf.statements[0];
-  if (!stmt || !ts4.isExpressionStatement(stmt))
+  if (!stmt || !ts5.isExpressionStatement(stmt))
     return new Set;
-  const expr = ts4.isParenthesizedExpression(stmt.expression) ? stmt.expression.expression : stmt.expression;
+  const expr = ts5.isParenthesizedExpression(stmt.expression) ? stmt.expression.expression : stmt.expression;
   return extractFreeIdentifiersFromNode(expr);
 }
 
+// ../jsx/src/ir-to-client-js/rewrite-props-object.ts
+import ts6 from "typescript";
+
 // ../jsx/src/scope/binding-scope.ts
 class BindingScope {
   frames;
@@ -2300,27 +2342,6 @@ var SKELETON_PATH_FORCE_CLOSE_GROUPS = [
   new Set(["li"])
 ];
 
-// ../jsx/src/props-binding.ts
-import ts6 from "typescript";
-function isIdentifierName(key) {
-  if (key.length === 0)
-    return false;
-  for (let i = 0;i < key.length; ) {
-    const cp = key.codePointAt(i);
-    const ok = i === 0 ? ts6.isIdentifierStart(cp, ts6.ScriptTarget.Latest) : ts6.isIdentifierPart(cp, ts6.ScriptTarget.Latest);
-    if (!ok)
-      return false;
-    i += cp > 65535 ? 2 : 1;
-  }
-  return true;
-}
-function propsDestructureBinding(p) {
-  const callerKey = p.sourceName ?? p.name;
-  const localName = p.name;
-  const binding = callerKey === localName ? localName : `${isIdentifierName(callerKey) ? callerKey : JSON.stringify(callerKey)}: ${localName}`;
-  return p.defaultValue ? `${binding} = ${p.defaultValue}` : binding;
-}
-
 // ../jsx/src/instrumentation.ts
 var _counters = freshCounters();
 function freshCounters() {
@@ -2334,20 +2355,21 @@ function freshCounters() {
 }
 
 // ../jsx/src/analyzer-context.ts
-import ts8 from "typescript";
+import ts9 from "typescript";
 
 // ../jsx/src/strip-types.ts
-import ts7 from "typescript";
+import ts8 from "typescript";
 
 // ../jsx/src/analyzer-context.ts
-var _typePrinter = ts8.createPrinter({ removeComments: true, omitTrailingSemicolon: true });
-var _blankTypeSourceFile = ts8.createSourceFile("__bf_types__.ts", "", ts8.ScriptTarget.Latest);
+var _typePrinter = ts9.createPrinter({ removeComments: true, omitTrailingSemicolon: true });
+var _blankTypeSourceFile = ts9.createSourceFile("__bf_types__.ts", "", ts9.ScriptTarget.Latest);
 
 // ../jsx/src/errors.ts
 var ErrorCodes = {
   MISSING_USE_CLIENT: "BF001",
   CLIENT_IMPORTING_SERVER: "BF003",
   SIGNAL_OUTSIDE_COMPONENT: "BF011",
+  PRIMITIVE_VIA_NAMESPACE_IMPORT: "BF013",
   UNSUPPORTED_JSX_PATTERN: "BF021",
   MISSING_KEY_IN_LIST: "BF023",
   MISSING_KEY_IN_NESTED_LIST: "BF024",
@@ -2380,6 +2402,7 @@ var errorMessages = {
   [ErrorCodes.MISSING_USE_CLIENT]: "'use client' directive required for components with createSignal or event handlers",
   [ErrorCodes.CLIENT_IMPORTING_SERVER]: "Client component cannot import server component",
   [ErrorCodes.SIGNAL_OUTSIDE_COMPONENT]: "Module-level reactive declaration (createSignal / createMemo) is not allowed. " + "The downstream codegen drops the declaration silently and every reference becomes a ReferenceError at SSR and at hydrate. " + "Move the declaration inside a component function so each mount gets its own state.",
+  [ErrorCodes.PRIMITIVE_VIA_NAMESPACE_IMPORT]: "Reactive primitive called through a namespace import of '@barefootjs/client' (import * as ns) is not recognized; " + "the declaration is dropped and its references throw ReferenceError at hydrate. Import the primitive by name instead.",
   [ErrorCodes.UNSUPPORTED_JSX_PATTERN]: "Unsupported JSX pattern",
   [ErrorCodes.MISSING_KEY_IN_LIST]: "Missing key attribute in list rendering. Add a key prop for efficient updates",
   [ErrorCodes.MISSING_KEY_IN_NESTED_LIST]: "Nested .map() loop requires key attribute for event delegation. Add a key prop to elements in the inner loop",
@@ -2571,46 +2594,46 @@ function extractFreeIdentifiersFromNode(node) {
   const ids = new Set;
   const boundNames = new Set;
   function addBindingNames(name, out) {
-    if (ts9.isIdentifier(name))
+    if (ts10.isIdentifier(name))
       out.push(name.text);
-    else if (ts9.isObjectBindingPattern(name))
+    else if (ts10.isObjectBindingPattern(name))
       name.elements.forEach((e) => addBindingNames(e.name, out));
-    else if (ts9.isArrayBindingPattern(name))
+    else if (ts10.isArrayBindingPattern(name))
       name.elements.forEach((e) => {
-        if (!ts9.isOmittedExpression(e))
+        if (!ts10.isOmittedExpression(e))
           addBindingNames(e.name, out);
       });
   }
   function visit(n) {
-    if (ts9.isTypeNode(n))
+    if (ts10.isTypeNode(n))
       return;
-    if (ts9.isIdentifier(n)) {
+    if (ts10.isIdentifier(n)) {
       const parent = n.parent;
-      if (parent && ts9.isPropertyAccessExpression(parent) && parent.name === n)
+      if (parent && ts10.isPropertyAccessExpression(parent) && parent.name === n)
         return;
-      if (parent && ts9.isPropertyAssignment(parent) && parent.name === n)
+      if (parent && ts10.isPropertyAssignment(parent) && parent.name === n)
         return;
-      if (parent && ts9.isParameter(parent) && parent.name === n)
+      if (parent && ts10.isParameter(parent) && parent.name === n)
         return;
-      if (parent && ts9.isVariableDeclaration(parent) && parent.name === n)
+      if (parent && ts10.isVariableDeclaration(parent) && parent.name === n)
         return;
       if (boundNames.has(n.text))
         return;
       ids.add(n.text);
       return;
     }
-    if (ts9.isArrowFunction(n)) {
+    if (ts10.isArrowFunction(n)) {
       const params = [];
       for (const p of n.parameters)
         addBindingNames(p.name, params);
       for (const name of params)
         boundNames.add(name);
-      ts9.forEachChild(n, visit);
+      ts10.forEachChild(n, visit);
       for (const name of params)
         boundNames.delete(name);
       return;
     }
-    ts9.forEachChild(n, visit);
+    ts10.forEachChild(n, visit);
   }
   visit(node);
   return ids;
@@ -2633,7 +2656,7 @@ var REACTIVE_PRIMITIVES = new Set([
 ]);
 
 // ../jsx/src/jsx-to-ir.ts
-import ts13 from "typescript";
+import ts14 from "typescript";
 
 // ../jsx/src/types.ts
 var SCOPE_FORBIDDEN = {
@@ -2683,7 +2706,7 @@ function preambleAnalysisTemplateText(p) {
 }
 
 // ../jsx/src/module-exports.ts
-import ts10 from "typescript";
+import ts11 from "typescript";
 function formatParamWithType(p) {
   const rest = p.isRest ? "..." : "";
   const optional = p.optional ? "?" : "";
@@ -2718,21 +2741,21 @@ function findAssignedNames(bodyText, candidates) {
   const assigned = new Set;
   if (candidates.size === 0)
     return assigned;
-  const sf = ts10.createSourceFile("bf-assignment-scan.tsx", bodyText, ts10.ScriptTarget.Latest, false, ts10.ScriptKind.TSX);
+  const sf = ts11.createSourceFile("bf-assignment-scan.tsx", bodyText, ts11.ScriptTarget.Latest, false, ts11.ScriptKind.TSX);
   const record = (target) => {
-    if (ts10.isIdentifier(target) && candidates.has(target.text)) {
+    if (ts11.isIdentifier(target) && candidates.has(target.text)) {
       assigned.add(target.text);
     }
   };
   const visit = (node) => {
-    if (ts10.isBinaryExpression(node) && isAssignmentOperator(node.operatorToken.kind)) {
+    if (ts11.isBinaryExpression(node) && isAssignmentOperator(node.operatorToken.kind)) {
       record(node.left);
-    } else if ((ts10.isPrefixUnaryExpression(node) || ts10.isPostfixUnaryExpression(node)) && (node.operator === ts10.SyntaxKind.PlusPlusToken || node.operator === ts10.SyntaxKind.MinusMinusToken)) {
+    } else if ((ts11.isPrefixUnaryExpression(node) || ts11.isPostfixUnaryExpression(node)) && (node.operator === ts11.SyntaxKind.PlusPlusToken || node.operator === ts11.SyntaxKind.MinusMinusToken)) {
       record(node.operand);
     }
-    ts10.forEachChild(node, visit);
+    ts11.forEachChild(node, visit);
   };
-  ts10.forEachChild(sf, visit);
+  ts11.forEachChild(sf, visit);
   return assigned;
 }
 function closeOverWritersOfMutableBindings(primaryRefs, declarations, mutableNames) {
@@ -2755,14 +2778,14 @@ function closeOverWritersOfMutableBindings(primaryRefs, declarations, mutableNam
   return reachable;
 }
 function isAssignmentOperator(kind) {
-  return kind >= ts10.SyntaxKind.FirstAssignment && kind <= ts10.SyntaxKind.LastAssignment;
+  return kind >= ts11.SyntaxKind.FirstAssignment && kind <= ts11.SyntaxKind.LastAssignment;
 }
 
 // ../jsx/src/reactivity-checker.ts
-import ts11 from "typescript";
+import ts12 from "typescript";
 
 // ../jsx/src/free-refs.ts
-import ts12 from "typescript";
+import ts13 from "typescript";
 var _bindingMapCache = new WeakMap;
 
 // ../jsx/src/to-locale-date-lowering.ts
@@ -3210,16 +3233,16 @@ var KEYWORDS_AND_GLOBALS = new Set([
 ]);
 
 // ../jsx/src/ir-to-client-js/walk-prop-accesses.ts
-import ts14 from "typescript";
+import ts15 from "typescript";
 
 // ../jsx/src/ir-to-client-js/imports.ts
-import ts16 from "typescript";
+import ts17 from "typescript";
 
 // ../jsx/src/value-references.ts
-import ts15 from "typescript";
+import ts16 from "typescript";
 
 // ../jsx/src/relocate.ts
-import ts17 from "typescript";
+import ts18 from "typescript";
 
 // ../jsx/src/lowering-registry.ts
 var plugins = [];
@@ -3415,10 +3438,10 @@ function formatDateLocalNames(metadata) {
 }
 
 // ../jsx/src/ir-to-client-js/prune-unused-prop-extractions.ts
-import ts18 from "typescript";
+import ts19 from "typescript";
 
 // ../jsx/src/ir-to-client-js/control-flow/plan/lazy-preamble.ts
-import ts19 from "typescript";
+import ts20 from "typescript";
 var NO_PREAMBLE = {
   lazySafe: true,
   facts: { declaredNames: new Set, freeNames: new Set }
@@ -3468,7 +3491,7 @@ var INERT_BINDING_GLOBALS = new Set([
 ]);
 
 // ../jsx/src/ir-to-client-js/emit-reactive.ts
-import ts20 from "typescript";
+import ts21 from "typescript";
 
 // ../jsx/src/ir-to-client-js/control-flow/stringify/event-delegation.ts
 var NON_BUBBLING_EVENTS = new Set([
@@ -3482,9 +3505,6 @@ var NON_BUBBLING_EVENTS = new Set([
   "pointerleave"
 ]);
 
-// ../jsx/src/ir-to-client-js/rewrite-props-object.ts
-import ts21 from "typescript";
-
 // ../jsx/src/ir-to-client-js/source-map.ts
 var BASE64_CHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
 function encodeVLQ(value) {
@@ -5508,6 +5528,7 @@ class CompileState {
   componentName = "";
   errors = [];
   referencedDerivedConsts = new Set;
+  templateReadRootFields = new Set;
   templateVarCounter = 0;
   pendingChildrenDefines = [];
   propsObjectName = null;
@@ -6357,6 +6378,15 @@ function convertInitialValue(ctx, value, _typeInfo, propsParams, preParsed) {
     if (param2) {
       return propRef(param2);
     }
+    const inlinedStr = ctx.resolveModuleStringConst(value);
+    if (inlinedStr !== null)
+      return inlinedStr;
+    const inlinedNum = ctx.resolveModuleNumericConst(value);
+    if (inlinedNum !== null)
+      return inlinedNum;
+    const inlinedBool = ctx.resolveModuleBooleanConst(value);
+    if (inlinedBool !== null)
+      return inlinedBool;
   }
   const propName = ctx.extractPropNameFromInitialValue(value, preParsed);
   const param = propName ? propsParams?.find((p) => p.name === propName) : undefined;
@@ -8064,7 +8094,9 @@ class GoTemplateAdapter extends BaseAdapter {
     extractPropNameFromInitialValue: (initialValue, preParsed) => this.extractPropNameFromInitialValue(initialValue, preParsed),
     extractPropFallback: (initialValue, preParsed) => this.extractPropFallback(initialValue, preParsed),
     extractCollisionDerivation: (parsed) => this.extractCollisionDerivation(parsed),
-    resolveModuleStringConst: (name) => this.resolveModuleStringConst(name)
+    resolveModuleStringConst: (name) => this.resolveModuleStringConst(name),
+    resolveModuleNumericConst: (name) => this.resolveModuleNumericConst(name),
+    resolveModuleBooleanConst: (name) => this.resolveModuleBooleanConst(name)
   };
   get errors() {
     return this.state.errors;
@@ -8081,6 +8113,10 @@ class GoTemplateAdapter extends BaseAdapter {
   staticLoopBakeFailed = false;
   childComponentShapes = new Map;
   childContextConsumers = new Map;
+  importAliases = new Map;
+  resolveChildName(name) {
+    return this.importAliases.get(name) ?? name;
+  }
   constructor(options = {}) {
     super();
     this.options = {
@@ -8092,6 +8128,7 @@ class GoTemplateAdapter extends BaseAdapter {
   primeCompileState(ir) {
     this.state.propsObjectName = ir.metadata.propsObjectName;
     this.state.restPropsName = ir.metadata.restPropsName ?? null;
+    this.importAliases = buildImportAliasMap(ir.metadata.imports ?? []);
     this.state.objectTypedPropNames = new Set((ir.metadata.propsParams ?? []).filter((p) => p.type.kind === "object").map((p) => p.name));
     this.state.moduleStringConsts = this.collectModuleStringConsts(ir.metadata.localConstants);
     this.state.localConstants = ir.metadata.localConstants ?? [];
@@ -8126,6 +8163,7 @@ class GoTemplateAdapter extends BaseAdapter {
     this.state.componentName = ir.metadata.componentName;
     this.state.errors = [];
     this.state.referencedDerivedConsts = new Set;
+    this.state.templateReadRootFields = new Set;
     this.state.templateVarCounter = 0;
     this.state.pendingChildrenDefines = [];
     this.scope = BindingScope.EMPTY;
@@ -8154,7 +8192,7 @@ ${scriptRegistrations}${templateBody}
       template += `{{define "${d.name}"}}${d.content}{{end}}
 `;
     }
-    const types = this.generateTypes(ir);
+    const types = this.generateTypes(ir, true);
     if (this.state.errors.length > 0) {
       ir.errors.push(...this.state.errors);
     }
@@ -8383,9 +8421,12 @@ ${scriptRegistrations}${templateBody}
     taken.add(desired);
     return desired;
   }
-  generateTypes(ir) {
+  generateTypes(ir, preserveTemplateReadRootFields = false) {
     this.state.usesHtmlTemplate = false;
     this.state.usesFmt = false;
+    if (!preserveTemplateReadRootFields) {
+      this.state.templateReadRootFields = new Set;
+    }
     this.primeCompileState(ir);
     const lines = [];
     const componentName = ir.metadata.componentName;
@@ -8529,10 +8570,17 @@ ${goFields.join(`
     const node = signal.parsed;
     if (!node || node.kind !== "array-literal" || node.elements.length === 0)
       return null;
+    const name = `${componentName}${capitalizeFieldName(signal.getter)}Item`;
+    return this.synthesizeStructsFromElements(node.elements, name);
+  }
+  synthesizeStructsFromElements(elements, name) {
+    if (this.state.localTypeNames.has(name))
+      return null;
     const order = [];
-    const goTypes = new Map;
-    for (let i = 0;i < node.elements.length; i++) {
-      const el = node.elements[i];
+    const shapes = new Map;
+    const nestedElements = new Map;
+    for (let i = 0;i < elements.length; i++) {
+      const el = elements[i];
       if (el.kind !== "object-literal")
         return null;
       const seen = new Set;
@@ -8544,37 +8592,93 @@ ${goFields.join(`
         const key = prop.key;
         if (!GO_IDENTIFIER.test(key))
           return null;
+        seen.add(key);
+        const isNestedArray = prop.value.kind === "array-literal" && prop.value.elements.every((e) => e.kind === "object-literal");
+        if (isNestedArray) {
+          const prevShape2 = shapes.get(key);
+          if (prevShape2 === undefined) {
+            if (i !== 0)
+              return null;
+            order.push(key);
+            shapes.set(key, { kind: "nested-array" });
+            nestedElements.set(key, []);
+          } else if (prevShape2.kind !== "nested-array") {
+            return null;
+          }
+          nestedElements.get(key).push(...prop.value.elements);
+          continue;
+        }
         const goType = this.scalarParsedGoType(prop.value);
         if (!goType)
           return null;
-        seen.add(key);
-        const prev = goTypes.get(key);
-        if (prev === undefined) {
+        const prevShape = shapes.get(key);
+        if (prevShape === undefined) {
           if (i !== 0)
             return null;
           order.push(key);
-          goTypes.set(key, goType);
+          shapes.set(key, { kind: "scalar", goType });
+        } else if (prevShape.kind !== "scalar") {
+          return null;
         } else {
-          const merged = this.mergeScalarGoType(prev, goType);
+          const merged = this.mergeScalarGoType(prevShape.goType, goType);
           if (!merged)
             return null;
-          goTypes.set(key, merged);
+          shapes.set(key, { kind: "scalar", goType: merged });
         }
       }
       if (seen.size !== order.length)
         return null;
     }
-    const name = `${componentName}${capitalizeFieldName(signal.getter)}Item`;
-    if (this.state.localTypeNames.has(name))
-      return null;
-    return {
+    const nestedStructs = [];
+    const fields = [];
+    const properties = [];
+    for (const key of order) {
+      const shape = shapes.get(key);
+      if (shape.kind === "scalar") {
+        fields.push({ tsName: key, goName: capitalizeFieldName(key), goType: shape.goType });
+        properties.push({ name: key, type: this.scalarGoTypeToTypeInfo(shape.goType), optional: false, readonly: false });
+        continue;
+      }
+      const nestedList = nestedElements.get(key);
+      if (nestedList.length === 0)
+        return null;
+      const nestedName = `${name}${capitalizeFieldName(key)}Item`;
+      const nested = this.synthesizeStructsFromElements(nestedList, nestedName);
+      if (!nested)
+        return null;
+      nestedStructs.push(...nested);
+      fields.push({ tsName: key, goName: capitalizeFieldName(key), goType: `[]${nestedName}` });
+      properties.push({ name: key, type: this.synthSliceTypeInfo(nestedName), optional: false, readonly: false });
+    }
+    return [...nestedStructs, { name, fields, properties }];
+  }
+  scalarGoTypeToTypeInfo(goType) {
+    if (goType === "string")
+      return { kind: "primitive", raw: "string", primitive: "string" };
+    if (goType === "bool")
+      return { kind: "primitive", raw: "boolean", primitive: "boolean" };
+    return { kind: "primitive", raw: "number", primitive: "number" };
+  }
+  synthSliceTypeInfo(name) {
+    return { kind: "array", raw: `${name}[]`, elementType: { kind: "interface", raw: name } };
+  }
+  registerSynthStruct(lines, name, fields, properties, comment) {
+    this.state.localTypeNames.add(name);
+    this.state.localStructFields.set(name, new Map(fields.map((f) => [f.tsName, f.goName])));
+    this.state.currentTypeDefinitions.push({
+      kind: "type",
       name,
-      fields: order.map((key) => ({
-        tsName: key,
-        goName: capitalizeFieldName(key),
-        goType: goTypes.get(key)
-      }))
-    };
+      definition: "",
+      properties,
+      loc: SYNTH_TYPE_LOC
+    });
+    const goFields = fields.map((f) => `	${f.goName} ${f.goType} \`json:"${this.toJsonTag(f.tsName)}"\``);
+    lines.push(comment);
+    lines.push(`type ${name} struct {
+${goFields.join(`
+`)}
+}`);
+    lines.push("");
   }
   scalarParsedGoType(value) {
     if (value.kind === "unary" && value.op === "-" && value.argument.kind === "literal") {
@@ -8641,7 +8745,7 @@ ${goFields.join(`
     for (const nested of inputNested) {
       if (nested.loopMarkerId && this.getBakedStaticChildLoop(nested.loopMarkerId, nested, nested.loopArrayParsed, nested.loopParam, nested.loopKey))
         continue;
-      lines.push(`	${nested.name}s []${nested.name}Input`);
+      lines.push(`	${nested.name}s []${this.resolveChildName(nested.name)}Input`);
     }
     const takenInput = new Set(this.propParamFieldNamesUnion(ir.metadata.propsParams));
     for (const c of this.nonCollidingContextConsumers(takenInput)) {
@@ -8677,10 +8781,11 @@ ${goFields.join(`
     const wrapperName = this.loopBodyWrapperName(parentComponentName, nested);
     const datumFields = this.resolveLoopDatumFields(nested.loopItemType);
     const bodyChildInstances = this.collectBodyChildInstances(nested.bodyChildren);
-    lines.push(`// ${wrapperName} wraps ${nested.name}Props with per-row loop datum`);
+    const declaredName = this.resolveChildName(nested.name);
+    lines.push(`// ${wrapperName} wraps ${declaredName}Props with per-row loop datum`);
     lines.push(`// fields and child component slots for the loop body children. (#1897)`);
     lines.push(`type ${wrapperName} struct {`);
-    lines.push(`	${nested.name}Props`);
+    lines.push(`	${declaredName}Props`);
     for (const f of datumFields) {
       lines.push(`	${f.goName} ${f.goType} \`json:"-"\``);
     }
@@ -8689,7 +8794,7 @@ ${goFields.join(`
       lines.push(`	BfLoopItem ${scalarLoopType} \`json:"-"\``);
     }
     for (const child of bodyChildInstances) {
-      lines.push(`	${child.fieldName} ${child.name}Props \`json:"-"\``);
+      lines.push(`	${child.fieldName} ${this.resolveChildName(child.name)}Props \`json:"-"\``);
     }
     lines.push("}");
     lines.push("");
@@ -8773,12 +8878,13 @@ ${goFields.join(`
     const staticWithoutBody = staticNested.filter((n) => !n.bodyChildren || n.bodyChildren.length === 0);
     for (const nested of staticWithoutBody) {
       const varName = `${nested.name.charAt(0).toLowerCase()}${nested.name.slice(1)}s`;
+      const declaredName = this.resolveChildName(nested.name);
       const baked = nested.loopMarkerId ? this.getBakedStaticChildLoop(nested.loopMarkerId, nested, nested.loopArrayParsed, nested.loopParam, nested.loopKey) : null;
       if (baked) {
-        lines.push(`	${varName} := make([]${nested.name}Props, ${baked.items.length})`);
+        lines.push(`	${varName} := make([]${declaredName}Props, ${baked.items.length})`);
         baked.items.forEach((item, i) => {
           const fields = item.inputFields.map((f) => `${f.goField}: ${f.goValue}`).join(", ");
-          lines.push(`	${varName}[${i}] = New${nested.name}Props(${nested.name}Input{${fields}})`);
+          lines.push(`	${varName}[${i}] = New${declaredName}Props(${declaredName}Input{${fields}})`);
           lines.push(`	${varName}[${i}].BfParent = scopeID`);
           lines.push(`	${varName}[${i}].BfMount = "${nested.slotId}"`);
           if (item.dataKey !== null) {
@@ -8788,9 +8894,9 @@ ${goFields.join(`
         lines.push("");
         continue;
       }
-      lines.push(`	${varName} := make([]${nested.name}Props, len(in.${nested.name}s))`);
+      lines.push(`	${varName} := make([]${declaredName}Props, len(in.${nested.name}s))`);
       lines.push(`	for i, item := range in.${nested.name}s {`);
-      lines.push(`		${varName}[i] = New${nested.name}Props(item)`);
+      lines.push(`		${varName}[i] = New${declaredName}Props(item)`);
       lines.push(`		${varName}[i].BfParent = scopeID`);
       lines.push(`		${varName}[i].BfMount = "${nested.slotId}"`);
       const keyField = loopKeyToGoFieldPath(nested.loopKey, nested.loopParam);
@@ -8905,8 +9011,14 @@ ${goFields.join(`
         lines.push(`		${fieldName}: ${hoisted.varName},`);
       } else {
         const bakeType = this.state.synthStructTypes.get(signal.getter) ?? signal.type;
+        const resolvedParsed = this.resolvedSignalParsed(signal);
         const initialValue = convertInitialValue(this.emitCtx, signal.initialValue, bakeType, ir.metadata.propsParams, signal.parsed);
         lines.push(`		${fieldName}: ${initialValue},`);
+        if (resolvedParsed?.kind === "object-literal" && jsLiteralToGo(this.emitCtx, bakeType, resolvedParsed) === null) {
+          const step = this.state.ssrSeedPlan.steps.find((s) => s.kind === "derived" && s.origin === "signal" && s.name === signal.getter);
+          if (step?.kind === "derived")
+            this.refuseUnbakeableDerivedObjectLiteral(signal.getter, signal.loc, step.frees);
+        }
       }
     }
     for (const nested of staticWithoutBody) {
@@ -9006,19 +9118,20 @@ ${goFields.join(`
   emitStaticChildInstances(lines, ir) {
     const staticChildren = this.collectStaticChildInstances(ir.root, ir.metadata.propsParams);
     for (const child of staticChildren) {
-      lines.push(`		${child.fieldName}: New${child.name}Props(${child.name}Input{`);
+      const declaredName = this.resolveChildName(child.name);
+      lines.push(`		${child.fieldName}: New${declaredName}Props(${declaredName}Input{`);
       lines.push(`			ScopeID: scopeID + "_${child.slotId}",`);
       lines.push(`			BfParent: scopeID,`);
       lines.push(`			BfMount: "${child.slotId}",`);
       if (child.contextBindings) {
-        for (const consumer of this.childContextConsumers.get(child.name) ?? []) {
+        for (const consumer of this.childContextConsumers.get(declaredName) ?? []) {
           const goVal = child.contextBindings.get(consumer.contextName);
           if (goVal !== undefined) {
             lines.push(`			${this.contextFieldName(consumer)}: ${goVal},`);
           }
         }
       }
-      const childShape = this.childComponentShapes.get(child.name);
+      const childShape = this.childComponentShapes.get(declaredName);
       const restBagEntries = [];
       const emitChildField = (jsxName, goValue) => {
         if (childShape && childShape.restBagField && !childShape.paramNames.has(jsxName)) {
@@ -9115,6 +9228,7 @@ ${goFields.join(`
     lines.push(`// New${componentName}Props creates ${propsTypeName} from ${inputTypeName}.`);
     for (const nested of signalDynamicNested) {
       const arrayField = `${nested.name}s`;
+      const declaredName = this.resolveChildName(nested.name);
       lines.push(`//`);
       lines.push(`// NOTE: \`${arrayField}\` is populated by the route handler, not by`);
       lines.push(`// New${componentName}Props — the SSR template iterates over it`);
@@ -9122,9 +9236,9 @@ ${goFields.join(`
       lines.push(`// assign it before passing the props to your renderer. Example:`);
       lines.push(`//`);
       lines.push(`//   props := New${componentName}Props(${inputTypeName}{ /* ... */ })`);
-      lines.push(`//   props.${arrayField} = make([]${nested.name}Props, len(items))`);
+      lines.push(`//   props.${arrayField} = make([]${declaredName}Props, len(items))`);
       lines.push(`//   for i, item := range items {`);
-      lines.push(`//     props.${arrayField}[i] = New${nested.name}Props(${nested.name}Input{ /* fields */ })`);
+      lines.push(`//     props.${arrayField}[i] = New${declaredName}Props(${declaredName}Input{ /* fields */ })`);
       lines.push(`//     props.${arrayField}[i].BfParent = props.ScopeID`);
       lines.push(`//     props.${arrayField}[i].BfMount = "${nested.slotId}"`);
       lines.push(`//   }`);
@@ -9163,9 +9277,11 @@ ${goFields.join(`
       const wrapperType = this.loopBodyWrapperName(componentName, nested);
       const datumFields = this.resolveLoopDatumFields(nested.loopItemType);
       const bodyChildInstances = this.collectBodyChildInstances(nested.bodyChildren, ir.metadata.propsParams);
+      const declaredName = this.resolveChildName(nested.name);
       for (const child of bodyChildInstances) {
         const childVar = `child_${child.fieldName}`;
-        lines.push(`	${childVar} := New${child.name}Props(${child.name}Input{`);
+        const childDeclaredName = this.resolveChildName(child.name);
+        lines.push(`	${childVar} := New${childDeclaredName}Props(${childDeclaredName}Input{`);
         lines.push(`		ScopeID: scopeID + "_${child.slotId}",`);
         lines.push(`		BfParent: scopeID,`);
         lines.push(`		BfMount: "${child.slotId}",`);
@@ -9185,7 +9301,7 @@ ${goFields.join(`
       lines.push(`	${varName} := make([]${wrapperType}, len(${dataVar}))`);
       lines.push(`	for i, item := range ${dataVar} {`);
       lines.push(`		${varName}[i] = ${wrapperType}{`);
-      lines.push(`			${nested.name}Props: New${nested.name}Props(${nested.name}Input{`);
+      lines.push(`			${declaredName}Props: New${declaredName}Props(${declaredName}Input{`);
       lines.push(`				BfParent: scopeID,`);
       lines.push(`				BfMount: "${nested.slotId}",`);
       for (const prop of nested.props ?? []) {
@@ -9240,9 +9356,11 @@ ${goFields.join(`
       const varName = `${nested.name.charAt(0).toLowerCase()}${nested.name.slice(1)}s`;
       const datumFields = this.resolveLoopDatumFields(nested.loopItemType);
       const bodyChildInstances = this.collectBodyChildInstances(nested.bodyChildren, ir.metadata.propsParams);
+      const declaredName = this.resolveChildName(nested.name);
       for (const child of bodyChildInstances) {
         const childVar = `child_${child.fieldName}`;
-        lines.push(`	${childVar} := New${child.name}Props(${child.name}Input{`);
+        const childDeclaredName = this.resolveChildName(child.name);
+        lines.push(`	${childVar} := New${childDeclaredName}Props(${childDeclaredName}Input{`);
         lines.push(`		ScopeID: scopeID + "_${child.slotId}",`);
         lines.push(`		BfParent: scopeID,`);
         lines.push(`		BfMount: "${child.slotId}",`);
@@ -9261,7 +9379,7 @@ ${goFields.join(`
       lines.push(`	${varName} := make([]${wrapperType}, len(bakedData))`);
       lines.push(`	for i, item := range bakedData {`);
       lines.push(`		${varName}[i] = ${wrapperType}{`);
-      lines.push(`			${nested.name}Props: New${nested.name}Props(${nested.name}Input{`);
+      lines.push(`			${declaredName}Props: New${declaredName}Props(${declaredName}Input{`);
       lines.push(`				BfParent: scopeID,`);
       lines.push(`				BfMount: "${nested.slotId}",`);
       lines.push(`			}),`);
@@ -9316,21 +9434,7 @@ ${goFields.join(`
         visit(prop.type, desiredName, prop.name);
       }
       const fields = this.structFieldsFor(typeInfo);
-      this.state.localStructFields.set(desiredName, new Map(fields.map((f) => [f.tsName, f.goName])));
-      this.state.currentTypeDefinitions.push({
-        kind: "type",
-        name: desiredName,
-        definition: "",
-        properties: typeInfo.properties ?? [],
-        loc: SYNTH_TYPE_LOC
-      });
-      const goFields = fields.map((f) => `	${f.goName} ${f.goType} \`json:"${this.toJsonTag(f.tsName)}"\``);
-      lines.push(`// ${desiredName} is a synthesised type for an anonymous object type (#2674).`);
-      lines.push(`type ${desiredName} struct {
-${goFields.join(`
-`)}
-}`);
-      lines.push("");
+      this.registerSynthStruct(lines, desiredName, fields, typeInfo.properties ?? [], `// ${desiredName} is a synthesised type for an anonymous object type (#2674).`);
     };
     const visitArrayElem = (elemType, parentName, propName) => {
       if (!elemType)
@@ -9382,20 +9486,11 @@ ${goFields.join(`
       const synth = this.synthesizeStructFromSignal(signal, componentName);
       if (!synth)
         continue;
-      this.state.localTypeNames.add(synth.name);
-      this.state.localStructFields.set(synth.name, new Map(synth.fields.map((f) => [f.tsName, f.goName])));
-      this.state.synthStructTypes.set(signal.getter, {
-        kind: "array",
-        raw: `${synth.name}[]`,
-        elementType: { kind: "interface", raw: synth.name }
-      });
-      const goFields = synth.fields.map((f) => `	${f.goName} ${f.goType} \`json:"${this.toJsonTag(f.tsName)}"\``);
-      lines.push(`// ${synth.name} is a synthesised element type for the ${signal.getter} signal.`);
-      lines.push(`type ${synth.name} struct {
-${goFields.join(`
-`)}
-}`);
-      lines.push("");
+      for (const s of synth) {
+        this.registerSynthStruct(lines, s.name, s.fields, s.properties, `// ${s.name} is a synthesised element type for the ${signal.getter} signal.`);
+      }
+      const top = synth[synth.length - 1];
+      this.state.synthStructTypes.set(signal.getter, this.synthSliceTypeInfo(top.name));
     }
   }
   resolveNestedLoopItemTypes(ir, nestedComponents) {
@@ -9538,7 +9633,7 @@ ${goFields.join(`
     for (const nested of nestedComponents) {
       if (this.isOrphanedClientOnlyNested(nested))
         continue;
-      const elemType = nested.bodyChildren?.length ? this.loopBodyWrapperName(componentName, nested) : `${nested.name}Props`;
+      const elemType = nested.bodyChildren?.length ? this.loopBodyWrapperName(componentName, nested) : `${this.resolveChildName(nested.name)}Props`;
       if (nested.isDynamic && !nested.isPropDerived) {
         lines.push(`	${nested.name}s []${elemType} \`json:"-"\``);
       } else if (nested.isDynamic && nested.isPropDerived && !propDrivingFieldNames.has(`${nested.name}s`)) {
@@ -9550,7 +9645,7 @@ ${goFields.join(`
     }
     const staticChildren = this.collectStaticChildInstances(ir.root, ir.metadata.propsParams);
     for (const child of staticChildren) {
-      lines.push(`	${child.fieldName} ${child.name}Props \`json:"-"\``);
+      lines.push(`	${child.fieldName} ${this.resolveChildName(child.name)}Props \`json:"-"\``);
     }
     for (const slot of spreadSlots) {
       const jsonTag = "-";
@@ -9929,6 +10024,22 @@ ${goFields.join(`
   resolvedSignalParsed(signal) {
     return resolveSignalParsedThroughSeedPlan(this.state, signal);
   }
+  refuseUnbakeableDerivedObjectLiteral(name, loc, frees) {
+    if (frees.length === 0)
+      return;
+    if (!this.state.templateReadRootFields.has(name))
+      return;
+    this.state.errors.push({
+      code: "BF101",
+      severity: "error",
+      message: `Signal '${name}' is seeded from an object literal that references live value(s) (${frees.join(", ")}) — the Go template adapter bakes object-typed signal values into Go source at New${this.state.componentName}Props time, and that baker is static-only (identifier/member/call operands defer), so the SSR template's read of it would see the Go zero value instead of the derived object.`,
+      loc,
+      suggestion: {
+        message: `Wrap each SSR read of '${name}()' in /* @client */ so it renders on the client instead, or pass the already-derived object in as a prop.`,
+        escape: [{ kind: "client-directive" }]
+      }
+    });
+  }
   extractPropFallback(initialValue, preParsed) {
     const structural = preParsed ? this.extractPropFallbackFromParsed(preParsed) : null;
     if (structural)
@@ -10257,6 +10368,7 @@ ${goFields.join(`
     return hit !== null && hit.depth > 0 && hit.binding.source === "item";
   }
   rootFieldRef(name) {
+    this.state.templateReadRootFields.add(name);
     const prefix = this.inLoop ? "$." : ".";
     return `${prefix}${capitalizeFieldName(name)}`;
   }
@@ -10278,6 +10390,9 @@ ${goFields.join(`
       return null;
     return `"${escapeGoString(value)}"`;
   }
+  findModuleConst(name) {
+    return this.state.localConstants.find((k) => k.name === name && k.isModule && !k.containsArrow);
+  }
   resolveModuleNumericConst(name) {
     if (this.isCurrentLoopItem(name))
       return null;
@@ -10285,12 +10400,25 @@ ${goFields.join(`
       return null;
     if (this.isOuterLoopParam(name))
       return null;
-    const c = this.state.localConstants.find((k) => k.name === name && k.isModule && !k.containsArrow);
+    const c = this.findModuleConst(name);
     if (!c || c.value === undefined)
       return null;
     const v = c.value.trim().replace(/(?<=\d)_(?=\d)/g, "");
     return /^-?\d+(\.\d+)?$/.test(v) ? v : null;
   }
+  resolveModuleBooleanConst(name) {
+    if (this.isCurrentLoopItem(name))
+      return null;
+    if (this.loopVarRefCount.has(name))
+      return null;
+    if (this.isOuterLoopParam(name))
+      return null;
+    const c = this.findModuleConst(name);
+    if (!c || c.value === undefined)
+      return null;
+    const v = c.value.trim();
+    return v === "true" || v === "false" ? v : null;
+  }
   literal(value, literalType) {
     if (literalType === "string")
       return `"${value}"`;
@@ -10928,8 +11056,10 @@ ${goFields.join(`
         }
         const signal = localVarMap.get(expr.name);
         if (signal) {
+          this.rootFieldRef(signal);
           return `$.${capitalizeFieldName(signal)}`;
         }
+        this.rootFieldRef(expr.name);
         return `.${capitalizeFieldName(expr.name)}`;
       }
       case "literal":
@@ -10962,6 +11092,7 @@ ${goFields.join(`
           return `${paramPrefix}.${capitalizeFieldName(expr.callee.property)}`;
         }
         if (expr.callee.kind === "identifier" && expr.args.length === 0) {
+          this.rootFieldRef(expr.callee.name);
           return `$.${capitalizeFieldName(expr.callee.name)}`;
         }
         if (asCallbackMethodCall(expr) !== null) {
@@ -11134,7 +11265,8 @@ ${goFields.join(`
     return this.scope.isBound(name) || this.loopVarRefCount.has(name);
   }
   loopRowChildPropOverrides(comp) {
-    const childShape = this.childComponentShapes.get(comp.name);
+    const declaredName = this.resolveChildName(comp.name);
+    const childShape = this.childComponentShapes.get(declaredName);
     const args = [];
     let needsRebuild = false;
     for (const prop of comp.props) {
@@ -11154,10 +11286,10 @@ ${goFields.join(`
       if (!free || ![...free].some((name) => this.isLoopShadowedName(name)))
         continue;
       {
-        const derived = this.childDerivedFieldDeps.get(comp.name);
+        const derived = this.childDerivedFieldDeps.get(declaredName);
         const overriddenField = capitalizeFieldName(prop.name);
         const staleField = derived ? [...derived].find(([, deps]) => deps.has(overriddenField))?.[0] : undefined;
-        if (staleField && !this.childRepropsReady.has(comp.name)) {
+        if (staleField && !this.childRepropsReady.has(declaredName)) {
           this.state.errors.push({
             code: "BF101",
             severity: "error",
@@ -11171,8 +11303,8 @@ ${goFields.join(`
         }
         if (staleField) {
           needsRebuild = true;
-          if (!this.repropsOwner.has(comp.name)) {
-            this.repropsOwner.set(comp.name, this.state.componentName);
+          if (!this.repropsOwner.has(declaredName)) {
+            this.repropsOwner.set(declaredName, this.state.componentName);
           }
         }
       }
@@ -11198,7 +11330,7 @@ ${goFields.join(`
         });
         continue;
       }
-      const fieldName = this.childPropFieldNames.get(comp.name)?.get(prop.name) ?? capitalizeFieldName(prop.name);
+      const fieldName = this.childPropFieldNames.get(declaredName)?.get(prop.name) ?? capitalizeFieldName(prop.name);
       args.push(`${JSON.stringify(fieldName)} ${wrapIfMultiToken(go)}`);
     }
     if (args.length === 0)
@@ -11717,7 +11849,7 @@ ${goFields.join(`
   }
   loopItemMarker(loop) {
     if (loop.bodyIsMultiRoot)
-      return `{{bfComment "bf-loop-i"}}`;
+      return `{{bfComment "loop-i"}}`;
     if (loop.bodyIsItemConditional && loop.key) {
       return `{{bfComment (printf "loop-i:%v" ${this.convertExpressionToGo(loop.key)})}}`;
     }
@@ -11742,6 +11874,41 @@ ${goFields.join(`
     }
     return name;
   }
+  queueDynamicPropDefine(comp) {
+    const args = [];
+    const declaredName = this.resolveChildName(comp.name);
+    const childShape = this.childComponentShapes.get(declaredName);
+    for (const prop of comp.props) {
+      if (prop.value.kind !== "jsx-children" || prop.name === "children")
+        continue;
+      const children = prop.value.children;
+      if (this.extractTextChildren(children) !== null)
+        continue;
+      if (this.extractHtmlChildren(children) !== null)
+        continue;
+      if (this.extractScopedHtmlChildren(children) !== null)
+        continue;
+      if (childShape?.restBagField && !childShape.paramNames.has(prop.name)) {
+        this.state.errors.push({
+          code: "BF101",
+          severity: "error",
+          message: `JSX-valued prop '${prop.name}' on <${comp.name}> is dynamic and routes into the child's rest-bag prop ('${childShape.restBagField}') rather than a declared field — there is no named Go struct field for 'bf_with_props' to target`,
+          loc: prop.loc
+        });
+        continue;
+      }
+      const name = `${this.state.componentName}__prop_${prop.name}_${comp.slotId}`;
+      if (!this.state.pendingChildrenDefines.some((d) => d.name === name)) {
+        this.state.pendingChildrenDefines.push({
+          name,
+          content: this.renderChildren(children)
+        });
+      }
+      const fieldName = this.childPropFieldNames.get(declaredName)?.get(prop.name) ?? capitalizeFieldName(prop.name);
+      args.push(`${JSON.stringify(fieldName)} (bf_tmpl ${JSON.stringify(name)} .)`);
+    }
+    return args.length > 0 ? args.join(" ") : null;
+  }
   queueLoopBodyChildrenDefine(comp) {
     const effectiveChildren = comp.children.length > 0 ? comp.children : resolveJsxChildrenProp(comp.props);
     if (effectiveChildren.length === 0)
@@ -11769,29 +11936,32 @@ ${goFields.join(`
     if (comp.dynamicTag) {
       return this.renderChildren(comp.children);
     }
+    const declaredName = this.resolveChildName(comp.name);
     let templateCall;
     if (this.inLoop && (this.loopWrapperStack[this.loopWrapperStack.length - 1] ?? false)) {
       const loopBodyDefine = this.queueLoopBodyChildrenDefine(comp);
       if (loopBodyDefine) {
         const bodyData = this.loopScalarItemStack[this.loopScalarItemStack.length - 1] ? ".BfLoopItem" : ".";
-        templateCall = `{{template "${comp.name}" (bf_with_children . (bf_tmpl "${loopBodyDefine}" ${bodyData}))}}`;
+        templateCall = `{{template "${declaredName}" (bf_with_children . (bf_tmpl "${loopBodyDefine}" ${bodyData}))}}`;
       } else {
-        templateCall = `{{template "${comp.name}" .}}`;
+        templateCall = `{{template "${declaredName}" .}}`;
       }
     } else if (this.inLoop && comp.slotId) {
       const suffix = slotIdToFieldSuffix(comp.slotId);
       const overrides = this.loopRowChildPropOverrides(comp);
       const loopBodyDefine = this.queueLoopBodyChildrenDefine(comp);
-      const base = overrides ? overrides.helper === "bf_reprops" ? `(bf_reprops ${JSON.stringify(comp.name)} $.${comp.name}${suffix} ${overrides.args})` : `(bf_with_props $.${comp.name}${suffix} ${overrides.args})` : `$.${comp.name}${suffix}`;
-      templateCall = loopBodyDefine ? `{{template "${comp.name}" (bf_with_children ${base} (bf_tmpl "${loopBodyDefine}" .))}}` : `{{template "${comp.name}" ${base}}}`;
+      const base = overrides ? overrides.helper === "bf_reprops" ? `(bf_reprops ${JSON.stringify(declaredName)} $.${comp.name}${suffix} ${overrides.args})` : `(bf_with_props $.${comp.name}${suffix} ${overrides.args})` : `$.${comp.name}${suffix}`;
+      templateCall = loopBodyDefine ? `{{template "${declaredName}" (bf_with_children ${base} (bf_tmpl "${loopBodyDefine}" .))}}` : `{{template "${declaredName}" ${base}}}`;
     } else if (this.inLoop) {
-      templateCall = `{{template "${comp.name}" .}}`;
+      templateCall = `{{template "${declaredName}" .}}`;
     } else if (comp.slotId) {
       const suffix = slotIdToFieldSuffix(comp.slotId);
       const childrenDefine = this.queueDynamicChildrenDefine(comp);
-      templateCall = childrenDefine ? `{{template "${comp.name}" (bf_with_children .${comp.name}${suffix} (bf_tmpl "${childrenDefine}" .))}}` : `{{template "${comp.name}" .${comp.name}${suffix}}}`;
+      const propArgs = this.queueDynamicPropDefine(comp);
+      const base = propArgs ? `(bf_with_props .${comp.name}${suffix} ${propArgs})` : `.${comp.name}${suffix}`;
+      templateCall = childrenDefine ? `{{template "${declaredName}" (bf_with_children ${base} (bf_tmpl "${childrenDefine}" .))}}` : `{{template "${declaredName}" ${base}}}`;
     } else {
-      templateCall = `{{template "${comp.name}" .${comp.name}}}`;
+      templateCall = `{{template "${declaredName}" .${comp.name}}}`;
     }
     if (ctx?.isRootOfClientComponent) {
       return `{{bfScopeComment .}}${templateCall}`;