octane 0.1.20 → 0.1.21

package/dist/compiler/compile.js

@@ -3995,11 +3995,22 @@ function isConditionalJsx(node) {
 	);
 }
 
-/** Wrap an expression as a BlockStatement body, so makeIfCall can consume it. */
+/** Wrap a ternary arm as a BlockStatement body, so makeIfCall can consume it. */
 function wrapAsBlockStmt(node) {
 	if (!node) return null;
 	// null / Literal(null) / Literal(false) → no branch
 	if (node.type === 'Literal' && (node.value === null || node.value === false)) return null;
+	if (!isJsxLike(node)) {
+		// A non-JSX arm (`{cond ? xs.map(…) : <Jsx/>}`, a string, a variable
+		// holding an element, a nested ternary) is the branch's render VALUE. As
+		// a bare statement the branch body would evaluate-and-discard it, so wrap
+		// it as the authored-equivalent `<>{expr}</>` — the branch renders the
+		// value through the fragment's child hole. The hole sits at the
+		// fragment's ROOT, a value position on both compilers: a nested ternary
+		// stays a value hole here (it is NOT re-claimed into a nested ifBlock),
+		// which is why the server claim requires host-child position too.
+		node = inheritOriginLoc(b.jsx_fragment([b.jsx_expression_container(node, node)]), node);
+	}
 	return b.block([node]);
 }
 
@@ -7482,7 +7493,15 @@ function ssrCompileBodyWithMapTemps(
 		((!!(node.body && node.body.type === 'JSXCodeBlock') && !returnedOutput) ||
 			returnedFragmentRoot) &&
 		inheritSoleCompRoot(bodyNodes, ctx);
+	// Body/sub ROOTS (including fragment-root children) are not host-element
+	// children: the client routes rich holes there through the de-opt value
+	// path (a portal has no host to stamp — see the emitNodeHtml root branch),
+	// so the ternary claim must stay off until an element's own children walk
+	// (ssrEmitElement) turns the flag on.
+	const prevHostChildPos = ctx._ssrHostChildPos;
+	ctx._ssrHostChildPos = false;
 	const htmlExpr = ssrEmitNodes(bodyNodes, ctx, name, inlinedSubs, parentNs, cssHash, componentNs);
+	ctx._ssrHostChildPos = prevHostChildPos;
 	ctx._ssrInheritRoot = prevInheritRoot;
 	ctx._returnedFragmentTemplate = prevReturnedFragmentTemplate;
 	ctx._tsxValuePos = prevValuePos;
@@ -8587,6 +8606,11 @@ function ssrEmitElement(node, ctx, name, inlinedSubs, parentNs, cssHash, compone
 		// pre/textarea/listing: the parser eats a '\n' right after the opening tag —
 		// the first text part must protect a leading newline (see ssrEmitNodes).
 		const nlGuardFirst = tag === 'pre' || tag === 'textarea' || tag === 'listing';
+		// These children sit directly under a host element — the one position
+		// where the client claims `{cond ? A : B}` holes (emitElementHtml). Root
+		// positions reset this in ssrCompileBody.
+		const prevHostChildPos = ctx._ssrHostChildPos;
+		ctx._ssrHostChildPos = true;
 		childrenExpr = ssrEmitNodes(
 			normChildren,
 			ctx,
@@ -8597,6 +8621,7 @@ function ssrEmitElement(node, ctx, name, inlinedSubs, parentNs, cssHash, compone
 			childComponentNs,
 			nlGuardFirst,
 		);
+		ctx._ssrHostChildPos = prevHostChildPos;
 	}
 	// `children=` and spread-held children are content props, not attributes.
 	// With no nested JSX children, the last present writer renders as the host's
@@ -8925,18 +8950,35 @@ function ssrCompileSub(
 ) {
 	const fnName = `${baseName}$${ctx.nextHelperId++}`;
 	const synth = { params: paramNodes || [], body: bodyStmts };
-	const fn = ssrCompileBody(
-		synth,
-		ctx,
-		fnName,
-		cssHash,
-		[],
-		parentNs || 'html',
-		false,
-		componentNs,
-		returnedFragmentTemplate,
-		returnedFragmentRoot,
-	);
+	// Returned-tree mirror subs (`__sfragment`): extractFragment folds EVERY
+	// expression hole in the mirrored tree into a descriptor value hole on the
+	// client (`props.hN` + childTextHole), even holes sitting inside host
+	// elements. Mark them so ssrEmitTsrxExpression keeps `{cond ? A : B}` on
+	// ssrChild throughout the mirror, matching that fold. Directive-arm subs
+	// reset the flag through this same save/restore, so an @if INSIDE a mirror
+	// claims again, exactly like the client. (Component `__schildren` subs are
+	// NOT folded wholesale — only their ROOT holes are the children-as-props
+	// value, which `_ssrHostChildPos` already leaves unclaimed — while a hole
+	// inside a host element within children claims like any template child.)
+	const prevFoldedExprHoles = ctx._ssrFoldedExprHoles;
+	ctx._ssrFoldedExprHoles = baseName === '__sfragment';
+	let fn;
+	try {
+		fn = ssrCompileBody(
+			synth,
+			ctx,
+			fnName,
+			cssHash,
+			[],
+			parentNs || 'html',
+			false,
+			componentNs,
+			returnedFragmentTemplate,
+			returnedFragmentRoot,
+		);
+	} finally {
+		ctx._ssrFoldedExprHoles = prevFoldedExprHoles;
+	}
 	return { fnName, fn };
 }
 
@@ -8944,10 +8986,19 @@ function ssrEmitIf(node, ctx, name, inlinedSubs, parentNs, cssHash, componentNs)
 	// rewriteHookCalls: key any `use(thenable)` in the @if test (it bypasses the
 	// setup rewrite, so without a stable key it collides with sibling/body use()).
 	const testExpr = rewriteHookCalls(node.test, ctx, name);
-	const thenStmts =
-		node.consequent.type === 'BlockStatement' ? node.consequent.body : [node.consequent];
-	const thenSub = ssrCompileSub(thenStmts, ctx, '__sif', [], cssHash, parentNs, componentNs);
-	inlinedSubs.push(thenSub.fn);
+	// A null consequent (`{cond ? null : <Jsx/>}` lowered by wrapAsBlockStmt)
+	// means "no then branch". It must emit like a MISSING @else — plain '' with
+	// no inner arm range — because the hydrating client renders that branch with
+	// a null body and adopts an empty slot range.
+	const thenStmts = node.consequent
+		? node.consequent.type === 'BlockStatement'
+			? node.consequent.body
+			: [node.consequent]
+		: null;
+	const thenSub = thenStmts
+		? ssrCompileSub(thenStmts, ctx, '__sif', [], cssHash, parentNs, componentNs)
+		: null;
+	if (thenSub) inlinedSubs.push(thenSub.fn);
 	let elseCall = ssrHtmlTemplate([], node, ctx);
 	let elseFnName = null;
 	if (node.alternate) {
@@ -8968,26 +9019,33 @@ function ssrEmitIf(node, ctx, name, inlinedSubs, parentNs, cssHash, componentNs)
 	ctx.runtimeNeeded.add('ssrBlock');
 	ctx.runtimeNeeded.add('ssrControl');
 	ctx.runtimeNeeded.add('ssrArm');
-	registerDirectiveOrigin(ctx, node, ['_$ssrControl', '_$ssrArm', thenSub.fnName, elseFnName]);
+	registerDirectiveOrigin(ctx, node, [
+		'_$ssrControl',
+		'_$ssrArm',
+		thenSub ? thenSub.fnName : null,
+		elseFnName,
+	]);
 	// Nested ranges: the OUTER ssrBlock is the if-slot; the INNER one wraps the
 	// taken branch's content. The client adopts BOTH on hydration (slot = outer,
 	// branch = inner) so no comment markers are inserted — byte-for-byte, exactly
 	// like @for. The not-taken arm emits no inner range (just `''`).
-	const thenInner = ssrCall(
-		'ssrArm',
-		[
-			b.literal('then', '"then"'),
-			ssrThunk(
-				ssrCall(
-					'ssrBlock',
-					[ssrSubCall(thenSub.fnName, [b.id('undefined')], node.consequent)],
-					node.consequent,
-				),
+	const thenInner = thenSub
+		? ssrCall(
+				'ssrArm',
+				[
+					b.literal('then', '"then"'),
+					ssrThunk(
+						ssrCall(
+							'ssrBlock',
+							[ssrSubCall(thenSub.fnName, [b.id('undefined')], node.consequent)],
+							node.consequent,
+						),
+						node.consequent,
+					),
+				],
 				node.consequent,
-			),
-		],
-		node.consequent,
-	);
+			)
+		: ssrHtmlTemplate([], node, ctx);
 	const elseInner = node.alternate
 		? ssrCall(
 				'ssrArm',
@@ -9441,6 +9499,30 @@ function ssrEmitTsrxExpression(node, ctx, name, inlinedSubs, parentNs, cssHash,
 		ctx.runtimeNeeded.add('ssrPortal');
 		return ssrCall('ssrPortal', [], node);
 	}
+	if (
+		node.returnedJsxValue !== true &&
+		ctx._tsxValuePos !== true &&
+		ctx._ssrFoldedExprHoles !== true &&
+		ctx._ssrHostChildPos === true &&
+		isConditionalJsx(expr)
+	) {
+		// Mirror the client's claim EXACTLY: only emitElementHtml's children
+		// walk lowers `{cond ? A : B}` with a JSX arm to an @if, so both sides
+		// compile each arm as an ordinary arm body and the hydration shapes
+		// (control key, arm ranges, a keyed `.map` claimed inside a value arm)
+		// agree by construction. Everywhere else the hole is a VALUE on the
+		// client and must stay on ssrChild here: returned `.tsx` trees
+		// (`_tsxValuePos`), returned-tree mirrors whose holes extractFragment
+		// folds to `props.hN` (`_ssrFoldedExprHoles`), and every non-host-child
+		// position — body/arm/fragment roots and component-children roots,
+		// where a rich hole rides the de-opt value path because a portal there
+		// has no host to stamp (`_ssrHostChildPos`).
+		const asIf = {
+			...b.if(expr.test, wrapAsBlockStmt(expr.consequent), wrapAsBlockStmt(expr.alternate)),
+			loc: expr.loc, // same devLoc/control-key position as the client's claim
+		};
+		return ssrEmitIf(asIf, ctx, name, inlinedSubs, parentNs, cssHash, componentNs);
+	}
 	ctx.runtimeNeeded.add('ssrChild');
 	// rewriteHookCalls first (key any `use(thenable)` in the hole — it bypasses the
 	// setup rewrite), then rewriteJsxValues (lower nested JSX to createElement).
@@ -20169,10 +20251,16 @@ function hoistBodyHelper(
 // ===========================================================================
 
 function makeIfCall(node, ctx, inlinedSubs, parentNs = 'html', cssHash = null) {
-	// node.test, node.consequent (BlockStatement | Element), node.alternate (BlockStatement | IfStatement | null)
-
-	const thenStmts =
-		node.consequent.type === 'BlockStatement' ? node.consequent.body : [node.consequent];
+	// node.test, node.consequent (BlockStatement | Element | null), node.alternate (BlockStatement | IfStatement | null)
+	// A null consequent (`{cond ? null : <Jsx/>}` lowered by wrapAsBlockStmt)
+	// means "no then branch" — same contract as the null alternate: the helper
+	// slot compiles to `null` and the runtime renders an empty branch.
+
+	const thenStmts = node.consequent
+		? node.consequent.type === 'BlockStatement'
+			? node.consequent.body
+			: [node.consequent]
+		: null;
 	const elseStmts = node.alternate
 		? node.alternate.type === 'BlockStatement'
 			? node.alternate.body
@@ -20180,20 +20268,22 @@ function makeIfCall(node, ctx, inlinedSubs, parentNs = 'html', cssHash = null) {
 		: null;
 	// Phase 2: one shared env tuple for both branches (see unionEnv).
 	const envNames = unionEnv(ctx, [
-		{ stmts: thenStmts, params: [] },
+		thenStmts && { stmts: thenStmts, params: [] },
 		elseStmts && { stmts: elseStmts, params: [] },
 	]);
-	const thenHelperName = hoistBodyHelper(
-		ctx,
-		inlinedSubs,
-		'__then',
-		thenStmts,
-		[],
-		parentNs,
-		cssHash,
-		envNames,
-		directiveKeywordOrigin(ctx, node),
-	);
+	const thenHelperName = thenStmts
+		? hoistBodyHelper(
+				ctx,
+				inlinedSubs,
+				'__then',
+				thenStmts,
+				[],
+				parentNs,
+				cssHash,
+				envNames,
+				directiveKeywordOrigin(ctx, node),
+			)
+		: null;
 
 	let elseHelperName = null;
 	if (elseStmts) {

package/dist/runtime.js

@@ -315,6 +315,13 @@ function flushTransitionActionBatch(batch) {
       );
     scheduleRender(block);
   }
+  if (batch.updates.size > 0) {
+    const retained = [];
+    for (const update of batch.updates.values()) {
+      if (!update.block.disposed) retained.push(update);
+    }
+    if (retained.length > 0) FLUSHED_TRANSITION_UPDATES.push(retained);
+  }
   batch.updates.clear();
   if (IN_FLIGHT_TRANSITION_ACTION_BATCH === batch) {
     IN_FLIGHT_TRANSITION_ACTION_BATCH = null;
@@ -331,6 +338,183 @@ const HELD_TRANSITIONS = /* @__PURE__ */ new Set();
 const STAGED_REVEALS = /* @__PURE__ */ new Set();
 let flushingStagedReveals = false;
 let deferringStagedRevealEffects = false;
+let ACTIVE_TRANSITION_ATTEMPT = null;
+let FLUSHED_TRANSITION_UPDATES = [];
+let HELD_SYNC_TRANSITION = null;
+let PROMOTED_PU_SWAPS = null;
+let PROMOTED_WARM_HARVEST = null;
+function beginTransitionAttempt(block) {
+  if (block.pendingMode !== "transition" || ACTIVE_TRANSITION_ATTEMPT !== null) return null;
+  TRANSITION_JOURNAL ??= [];
+  TRANSITION_JOURNAL_BAGS ??= /* @__PURE__ */ new Set();
+  TRANSITION_JOURNAL_DEPTH++;
+  const attempt = {
+    origin: block,
+    journalCheckpoint: TRANSITION_JOURNAL.length,
+    effects: [effectQueues[0].length, effectQueues[1].length, effectQueues[2].length],
+    effectEvents: effectEventQueue.length,
+    effectEventActions: effectEventCommitActions.length,
+    stores: storeSyncQueue.length,
+    refAttach: refAttachQueue.length,
+    refDetach: refDetachQueue.length,
+    effectDeps: snapshotSubtreeEffectDeps(block),
+    heldSlots: null,
+    puSwaps: null
+  };
+  ACTIVE_TRANSITION_ATTEMPT = attempt;
+  return attempt;
+}
+function endTransitionAttempt(attempt) {
+  if (attempt === null) return;
+  ACTIVE_TRANSITION_ATTEMPT = null;
+  const held = attempt.heldSlots;
+  if (held === null || held.size === 0) {
+    PROMOTED_PU_SWAPS = null;
+    PROMOTED_WARM_HARVEST = null;
+  }
+  let entries = null;
+  if (held !== null && held.size > 0) {
+    entries = [];
+    for (let i = FLUSHED_TRANSITION_UPDATES.length - 1; i >= 0; i--) {
+      const group = FLUSHED_TRANSITION_UPDATES[i];
+      let single = true;
+      for (let k = 0; k < group.length; k++) {
+        if (group[k].block !== attempt.origin) {
+          single = false;
+          break;
+        }
+      }
+      if (!single) continue;
+      for (let k = 0; k < group.length; k++) entries.push(group[k]);
+      FLUSHED_TRANSITION_UPDATES.splice(i, 1);
+    }
+  }
+  if (held !== null && held.size > 0 && entries !== null && entries.length > 0) {
+    rollbackTransitionJournal(attempt.journalCheckpoint);
+    for (let phase = 0; phase < 3; phase++) {
+      effectQueues[phase].length = attempt.effects[phase];
+    }
+    effectEventQueue.length = attempt.effectEvents;
+    effectEventCommitActions.length = attempt.effectEventActions;
+    for (let i = attempt.stores; i < storeSyncQueue.length; i++) {
+      storeSyncQueue[i].queued = false;
+    }
+    storeSyncQueue.length = attempt.stores;
+    refAttachQueue.length = attempt.refAttach;
+    refDetachQueue.length = attempt.refDetach;
+    restoreSubtreeEffectDeps(attempt.origin, attempt.effectDeps);
+    const continuing = PROMOTED_PU_SWAPS !== null || PROMOTED_WARM_HARVEST !== null;
+    let puSwaps = attempt.puSwaps;
+    if (continuing) {
+      if (PROMOTED_PU_SWAPS !== null) {
+        puSwaps = puSwaps === null ? PROMOTED_PU_SWAPS : PROMOTED_PU_SWAPS.concat(puSwaps);
+        PROMOTED_PU_SWAPS = null;
+      }
+    } else if (puSwaps !== null) {
+      for (let i = puSwaps.length - 1; i >= 0; i--) {
+        const [hooks, slot, prev] = puSwaps[i];
+        if (prev === void 0) hooks.delete(slot);
+        else hooks.set(slot, prev);
+      }
+    }
+    for (let i = 0; i < entries.length; i++) {
+      entries[i].slot.value = entries[i].baseValue;
+    }
+    let warmHarvest = PROMOTED_WARM_HARVEST;
+    PROMOTED_WARM_HARVEST = null;
+    if (warmHarvest !== null) {
+      for (let i = 0; i < warmHarvest.length; i++) warmHarvest[i].taken = false;
+    }
+    const harvest = (scope) => {
+      const cache = scope.block.__warmCache;
+      if (cache !== void 0) {
+        for (const [slot, list] of cache) {
+          for (let i = 0; i < list.length; i++) {
+            const entry = list[i];
+            if (entry.available) {
+              (warmHarvest ??= []).push({
+                slot,
+                deps: entry.deps,
+                value: entry.value,
+                taken: false
+              });
+            }
+          }
+        }
+      }
+      forEachSubtreeChild(scope, harvest);
+    };
+    harvest(attempt.origin);
+    HELD_SYNC_TRANSITION = {
+      origin: attempt.origin,
+      entries,
+      puSwaps,
+      warmHarvest,
+      holders: new Set(held)
+    };
+    if (!continuing) scheduleRender(attempt.origin);
+  }
+  if (--TRANSITION_JOURNAL_DEPTH === 0) {
+    TRANSITION_JOURNAL = null;
+    TRANSITION_JOURNAL_BAGS = null;
+    flushParkedItems();
+  }
+}
+function journalPuEntry(scope, slot, next) {
+  const attempt = ACTIVE_TRANSITION_ATTEMPT;
+  if (attempt === null) return;
+  const hooks = ensureHooks(scope);
+  (attempt.puSwaps ??= []).push([hooks, slot, hooks.get(slot), next]);
+}
+function heldSyncCellsIntact(state) {
+  const held = HELD_SYNC_TRANSITION;
+  if (held === null || !held.holders.has(state)) return false;
+  for (let i = 0; i < held.entries.length; i++) {
+    const entry = held.entries[i];
+    if (!Object.is(entry.slot.value, entry.baseValue)) return false;
+  }
+  return true;
+}
+function promoteHeldSyncTransition() {
+  const held = HELD_SYNC_TRANSITION;
+  if (held === null) return false;
+  HELD_SYNC_TRANSITION = null;
+  const puSwaps = held.puSwaps;
+  if (puSwaps !== null) {
+    for (let i = 0; i < puSwaps.length; i++) {
+      const [hooks, slot, , next] = puSwaps[i];
+      hooks.set(slot, next);
+    }
+    PROMOTED_PU_SWAPS = PROMOTED_PU_SWAPS === null ? puSwaps : PROMOTED_PU_SWAPS.concat(puSwaps);
+  }
+  PROMOTED_WARM_HARVEST = held.warmHarvest;
+  const promoted = [];
+  TRANSITION_DEPTH++;
+  try {
+    for (let i = 0; i < held.entries.length; i++) {
+      const entry = held.entries[i];
+      if (!Object.is(entry.slot.value, entry.baseValue)) continue;
+      entry.slot.value = entry.value;
+      if (!entry.block.disposed) {
+        promoted.push(entry);
+        scheduleRender(entry.block);
+      }
+    }
+  } finally {
+    TRANSITION_DEPTH--;
+  }
+  if (promoted.length > 0) FLUSHED_TRANSITION_UPDATES.push(promoted);
+  return true;
+}
+function discardHeldSyncTransition(state) {
+  const held = HELD_SYNC_TRANSITION;
+  if (held === null || !held.holders.delete(state)) return;
+  if (held.holders.size === 0) {
+    HELD_SYNC_TRANSITION = null;
+    PROMOTED_PU_SWAPS = null;
+    PROMOTED_WARM_HARVEST = null;
+  }
+}
 const JOURNAL_TEXT = 0;
 const JOURNAL_ATTR = 1;
 const JOURNAL_BAG = 2;
@@ -1007,7 +1191,12 @@ function drainQueue() {
         block.drainStamp = drainId;
         block.drainRenders = 1;
       }
-      renderBlock(block);
+      const attempt = beginTransitionAttempt(block);
+      try {
+        renderBlock(block);
+      } finally {
+        endTransitionAttempt(attempt);
+      }
     } catch (err) {
       try {
         handleRenderError(block, err);
@@ -1040,6 +1229,7 @@ function flush() {
 }
 function flushWork() {
   inFlush = true;
+  const clearRetainedTransitionUpdates = FLUSHED_TRANSITION_UPDATES.length > 0;
   const viewTransitionDriver = VIEW_TRANSITION_DRIVER;
   const clearViewTransitionTypes = viewTransitionDriver?.shouldClearTypesAfterFlush() === true;
   try {
@@ -1049,6 +1239,8 @@ function flushWork() {
     if (pendingError !== null) throw pendingError.err;
   } finally {
     inFlush = false;
+    if (clearRetainedTransitionUpdates || FLUSHED_TRANSITION_UPDATES.length > 0)
+      FLUSHED_TRANSITION_UPDATES.length = 0;
     if (typeof __OCTANE_PROFILE_ENABLED__ !== "undefined" && __OCTANE_PROFILE_ENABLED__)
       __devtoolsNotifyFlush();
     if (clearViewTransitionTypes) viewTransitionDriver.clearTypes();
@@ -2766,16 +2958,19 @@ function useMemo(compute, deps, slot) {
   if (WARM_EVER && d !== void 0) {
     const adopted = adoptWarmValue(s, d);
     if (adopted !== WARM_MISS) {
-      ensureHooks(scope).set(s, {
+      const adoptedEntry = {
         deps: d,
         value: adopted,
         warmEpisode: CURRENT_WARM_EPISODE
-      });
+      };
+      if (ACTIVE_TRANSITION_ATTEMPT !== null) journalPuEntry(scope, s, adoptedEntry);
+      ensureHooks(scope).set(s, adoptedEntry);
       return adopted;
     }
   }
   const value = compute.apply(null, d ?? []);
   const entry = { deps: d, value };
+  if (ACTIVE_TRANSITION_ATTEMPT !== null) journalPuEntry(scope, s, entry);
   ensureHooks(scope).set(s, entry);
   if (d !== void 0 && recordRealWarmMemo(s, d, entry)) {
     entry.warmEpisode = CURRENT_WARM_EPISODE;
@@ -4332,6 +4527,16 @@ function adoptWarmValue(slot, deps) {
     }
     b = b.parentBlock;
   }
+  const harvestList = HELD_SYNC_TRANSITION?.warmHarvest ?? PROMOTED_WARM_HARVEST;
+  if (harvestList !== null && harvestList !== void 0) {
+    for (let i = 0; i < harvestList.length; i++) {
+      const entry = harvestList[i];
+      if (!entry.taken && entry.slot === slot && !depsChanged(entry.deps, deps)) {
+        entry.taken = true;
+        return entry.value;
+      }
+    }
+  }
   return WARM_MISS;
 }
 const puMiss = /* @__PURE__ */ Symbol("octane.pu.miss");
@@ -4344,11 +4549,13 @@ function puHit(slot, entry) {
 function puAdopt(slot, deps) {
   const adopted = adoptWarmValue(slot, deps);
   if (adopted === WARM_MISS) return puMiss;
-  ensureHooks(CURRENT_SCOPE).set(slot, {
+  const adoptedEntry = {
     deps,
     value: adopted,
     warmEpisode: CURRENT_WARM_EPISODE
-  });
+  };
+  if (ACTIVE_TRANSITION_ATTEMPT !== null) journalPuEntry(CURRENT_SCOPE, slot, adoptedEntry);
+  ensureHooks(CURRENT_SCOPE).set(slot, adoptedEntry);
   return adopted;
 }
 function puTake0(slot) {
@@ -4403,6 +4610,7 @@ function puTake4(slot, d0, d1, d2, d3) {
 }
 function puPub(slot, value, ...deps) {
   const entry = { deps, value };
+  if (ACTIVE_TRANSITION_ATTEMPT !== null) journalPuEntry(CURRENT_SCOPE, slot, entry);
   ensureHooks(CURRENT_SCOPE).set(slot, entry);
   if (recordRealWarmMemo(slot, deps, entry)) entry.warmEpisode = CURRENT_WARM_EPISODE;
   return value;
@@ -9721,6 +9929,10 @@ function childSlot(parentScope, slotKey, domParent, value, anchor, ownEnd, ownsH
   if (preparedList !== null) {
     if (state.forSlot === null) {
       if (hydration === null && !upgradeArmed) clearChildContent(state);
+      if (state.end !== null && state.end.parentNode === null) {
+        state.end = null;
+        state.start = null;
+      }
       if (state.end === null) {
         state.end = document.createComment("");
         domParent.insertBefore(state.end, null);
@@ -10563,8 +10775,10 @@ function tryBlock(parentScope, slotKey, domParent, tryBody, catchBody, pendingBo
     const journalCheckpoint = armTransitionJournal(s);
     try {
       renderBlock(s.tryBlock);
-      releaseHeldTransition(s);
-      s.pendingThenable = null;
+      if (!heldSyncCellsIntact(s)) {
+        releaseHeldTransition(s);
+        s.pendingThenable = null;
+      }
     } catch (err) {
       if (isHostContextRequest(err)) throw err;
       if (isSuspenseException(err)) {
@@ -10790,6 +11004,7 @@ function showTryBlock(state) {
   }
 }
 function releaseHeldTransition(state) {
+  discardHeldSyncTransition(state);
   if (state.transitionHeld) {
     state.transitionHeld = false;
     tickTransitionCount(-1);
@@ -10804,6 +11019,9 @@ function handleSuspense(state, thenable, sourceBlock, journalCheckpoint = -1) {
   const isTransition = sourceBlock.currentRenderMode === "transition";
   if ((isTransition || state.transitionHeld) && state.hasResolved && state.branch === 1 && state.hiddenDom === null) {
     rollbackTransitionJournal(journalCheckpoint);
+    if (ACTIVE_TRANSITION_ATTEMPT !== null) {
+      (ACTIVE_TRANSITION_ATTEMPT.heldSlots ??= /* @__PURE__ */ new Set()).add(state);
+    }
     if (!state.transitionHeld) {
       state.transitionHeld = true;
       tickTransitionCount(1);
@@ -10920,6 +11138,9 @@ function refreshPendingBody(state) {
 }
 function swapToPendingFallback(state) {
   if (!state.pendingBody || state.branch !== 1 || !state.tryBlock) return;
+  if (HELD_SYNC_TRANSITION !== null && HELD_SYNC_TRANSITION.holders.has(state)) {
+    promoteHeldSyncTransition();
+  }
   hideTryContentAndMountPending(state);
 }
 function commitResume(state) {
@@ -11275,6 +11496,20 @@ function rebaseOffscreenCaptureSeq(capture) {
 }
 function flushStagedReveals() {
   if (flushingStagedReveals) return;
+  if (HELD_SYNC_TRANSITION !== null) {
+    let allVisible = true;
+    for (const holder of HELD_SYNC_TRANSITION.holders) {
+      if (holder.hiddenDom !== null) {
+        allVisible = false;
+        break;
+      }
+    }
+    if (allVisible && promoteHeldSyncTransition()) {
+      STAGED_REVEALS.clear();
+      flush();
+      return;
+    }
+  }
   flushingStagedReveals = true;
   try {
     const run = () => {
@@ -11970,10 +12205,31 @@ function renderBranchSlot(parentScope, slotKey, state, domParent, next, body, ma
         let bStart;
         let bEnd;
         let borrowed = false;
+        let rebuild = false;
+        let inner = null;
+        let innerEnd = null;
         if (hydration !== null && hydration.isOpen(state.start.nextSibling)) {
-          bStart = state.start.nextSibling;
-          bEnd = hydration.close(bStart);
-          hydration.node = bStart.nextSibling;
+          inner = state.start.nextSibling;
+          innerEnd = hydration.close(inner);
+          if (innerEnd !== state.end && innerEnd.nextSibling !== state.end) {
+            if (process.env.NODE_ENV !== "production") {
+              const mmLoc = siteLoc(parentScope, slotKey);
+              if (mmLoc)
+                hydration.warnStructural(
+                  mmLoc,
+                  "a single branch range",
+                  hydration.describe(innerEnd.nextSibling)
+                );
+            }
+            removeRange(state.start.nextSibling, state.end);
+            inner = null;
+            rebuild = true;
+          }
+        }
+        if (inner !== null) {
+          bStart = inner;
+          bEnd = innerEnd;
+          hydration.node = inner.nextSibling;
         } else {
           bStart = state.start;
           bEnd = state.end;
@@ -11992,7 +12248,12 @@ function renderBranchSlot(parentScope, slotKey, state, domParent, next, body, ma
         );
         if (borrowed) b.exclusiveMarkers = true;
         state.block = b;
-        renderBlock(b);
+        if (rebuild) {
+          hydration.suspend(() => renderBlock(b));
+          hydration.node = state.end.nextSibling;
+        } else {
+          renderBlock(b);
+        }
       } else if (hydration !== null && state.start.nextSibling !== state.end) {
         if (process.env.NODE_ENV !== "production") {
           const mmLoc = siteLoc(parentScope, slotKey);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "octane",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "license": "MIT",
   "type": "module",
   "sideEffects": false,