fix(vite-plugin): walk nested-conditional alternates into sub-templates

Component templates whose `template()` body chained multiple `if (cond)
return <JSX>` guards lowered (via `foldEarlyReturnGuards`) to nested
ternaries, but every alternate beyond the outermost arm was dropped: the
IR walker only recognized JSX shapes, and the JS-emit `buildBranchFn`
fell through to an empty-comment placeholder for non-JSX branches. Both
sites now recognize `ConditionalExpression` / `&&` `LogicalExpression`
arms with JSX-or-nullish operands, wrap them in a JSXFragment, and walk
into a real sub-template — recursing through `buildBranchFn` for further
nesting.

Author: dashersw

.changeset/closure-codegen-nested-conditional-jsx.md

@@ -0,0 +1,9 @@
+---
+'@geajs/vite-plugin': patch
+---
+
+### @geajs/vite-plugin (patch)
+
+- **Closure-codegen nested-conditional alternates**: A chain of `if (cond) return <JSX>` guards lowered by `foldEarlyReturnGuards` into nested ternaries previously dropped every inner alternate at the IR and JS-emit layers — the IR walker only recognized JSX shapes, and `buildBranchFn` fell through to an empty-comment placeholder for any non-JSX branch. Component templates that branched on multiple states then rendered only the outermost arm.
+  - `closure-codegen/ir.ts`: extend `jsxNodeToTemplateIr` to recognize `ConditionalExpression` / `&&` `LogicalExpression` arms with JSX-or-nullish operands, wrap them in a JSXFragment, and walk into a real sub-template instead of returning `null`.
+  - `closure-codegen/emit/emit-conditional.ts`: extend `buildBranchFn` with the same recognition — when a branch expression is a nestable conditional, lift it into a JSXFragment and route through `compileJsxToBlock` so the inner ternary becomes its own template + clone block (and recurses into `buildBranchFn` again for further nesting).

packages/vite-plugin-gea/src/closure-codegen/emit/emit-conditional.ts

@@ -8,6 +8,7 @@ import { substituteBindings } from './emit-substitution.ts'
 import { buildMapBranchFn } from './emit-map-branch.ts'
 import type { Slot } from '../generator.ts'
 import { eagerTrackSkippedReads } from '../utils/path-helpers.ts'
+import { isJsxOrNullish } from '../generator/generator-jsx-helpers.ts'
 
 export function emitConditionalSlot(slot: Slot, stmts: Statement[], ctx: EmitContext): void {
   const anchorId = t.identifier('anchor' + slot.index)
@@ -73,6 +74,18 @@ function buildBranchFn(branchExpr: any, ctx: EmitContext): Expression {
     const block = compileJsxToBlock(branchExpr, ctx)
     return t.arrowFunctionExpression([t.identifier('d')], block)
   }
+  // Nested conditional alternates (`cond1 ? <A> : cond2 ? <B> : <C>`) or
+  // `cond && <X>` chains — produced by `foldEarlyReturnGuards` from multiple
+  // `if (...) return <JSX>` guards. Wrap in a JSXFragment with an expression
+  // container so `compileJsxToBlock` routes them through the normal slot path
+  // (which re-enters here recursively for each inner ternary level).
+  if (isNestableConditionalExpression(branchExpr)) {
+    const fragment = t.jsxFragment(t.jsxOpeningFragment(), t.jsxClosingFragment(), [
+      t.jsxExpressionContainer(branchExpr as Expression),
+    ])
+    const block = compileJsxToBlock(fragment, ctx)
+    return t.arrowFunctionExpression([t.identifier('d')], block)
+  }
   // Compiler-emitted hoisted-const IIFE (tagged by foldEarlyReturnGuards).
   if (
     t.isCallExpression(branchExpr) &&
@@ -147,6 +160,23 @@ function buildBranchFn(branchExpr: any, ctx: EmitContext): Expression {
   )
 }
 
+// Mirrors `isWalkableConditionalExpression` from ir.ts (and the JSX walker's
+// own recognition): a ConditionalExpression or `&&` LogicalExpression that has
+// at least one JSX-or-nullish arm. These are the shapes `foldEarlyReturnGuards`
+// emits from chained `if (cond) return <JSX>` guards; if buildBranchFn doesn't
+// recognise them, every nested level beyond the outermost ternary collapses
+// to the "Generic fallback: empty comment" path above and silently drops the
+// JSX subtree.
+function isNestableConditionalExpression(node: unknown): boolean {
+  if (t.isConditionalExpression(node)) {
+    return isJsxOrNullish(node.consequent) || isJsxOrNullish(node.alternate)
+  }
+  if (t.isLogicalExpression(node) && node.operator === '&&') {
+    return isJsxOrNullish(node.right)
+  }
+  return false
+}
+
 /**
  * Build a branch fn for a bare `xs.map(item => <jsx/>)` expression. Creates a
  * `<span style="display:contents">` wrapper, inserts a comment anchor inside,

packages/vite-plugin-gea/src/closure-codegen/ir.ts

@@ -1,6 +1,7 @@
 import type { ClassDeclaration, Expression } from '@babel/types'
 import { generate, t } from '../utils/babel-interop.ts'
 import { walkJsxToTemplate, type Slot, type TemplateSpec } from './generator.ts'
+import { isJsxOrNullish } from './generator/generator-jsx-helpers.ts'
 import { substituteBindings } from './emit/emit-substitution.ts'
 
 export interface GeaIrBundleV1 {
@@ -424,10 +425,36 @@ function jsxNodeToTemplateIr(node: unknown, bindings: Map<string, Expression>):
     if (t.isJSXElement(inner) || t.isJSXFragment(inner)) {
       return templateSpecToIr(walkJsxToTemplate(inner), bindings)
     }
-  }
+    // Conditional/logical expressions don't materialise as JSX themselves but
+    // are recognised by the JSX walker when they appear inside a JSXExpressionContainer.
+    // Fall through to the wrapping path below so a nested ternary alternate
+    // (e.g. the chain `foldEarlyReturnGuards` produces from multiple `if (cond)
+    // return <X>` guards) still walks into a real sub-template instead of being
+    // dropped.
+    if (isWalkableConditionalExpression(inner)) return wrapAsFragmentTemplate(inner, bindings)
+  }
+  if (isWalkableConditionalExpression(node)) return wrapAsFragmentTemplate(node as any, bindings)
   return null
 }
 
+// Mirrors the walker's recognition (walk.ts): `cond ? <A> : <B>`, `cond && <X>`,
+// `cond && xs.map(...)`. Anything else has no JSX shape we can lower into a
+// template branch.
+function isWalkableConditionalExpression(node: unknown): node is Expression {
+  if (t.isConditionalExpression(node)) {
+    return isJsxOrNullish(node.consequent) || isJsxOrNullish(node.alternate)
+  }
+  if (t.isLogicalExpression(node) && node.operator === '&&') {
+    return isJsxOrNullish(node.right)
+  }
+  return false
+}
+
+function wrapAsFragmentTemplate(expression: Expression, bindings: Map<string, Expression>): GeaIrTemplate {
+  const fragment = t.jsxFragment(t.jsxOpeningFragment(), t.jsxClosingFragment(), [t.jsxExpressionContainer(expression)])
+  return templateSpecToIr(walkJsxToTemplate(fragment), bindings)
+}
+
 function jsxChildrenToTemplateIr(children: unknown, bindings: Map<string, Expression>): GeaIrTemplate | null {
   if (!Array.isArray(children) || children.length === 0) return null
   const hasContent = children.some(