@askrjs/askr 0.0.76 → 0.0.78

package/dist/{renderer-GFETYwZ6.js → renderer-_l_U-AbR.js}

@@ -1,17 +1,18 @@
-import { t as __CONTROL_BOUNDARY__ } from "./control-DhFRTIoE.js";
+import { n as hasTransparentComponentResult, t as __CONTROL_BOUNDARY__ } from "./control-C-ApnFs1.js";
 import { n as _isDOMElement, t as __ERROR_BOUNDARY__ } from "./vnode-D24p6IW2.js";
 import { b as isDevelopmentEnvironment, c as runRuntimeHandlerScope, f as configureRuntimeRenderer, i as getDefaultRuntimeInstance, n as enqueueRuntimeTask, v as logger, y as getRuntimeEnv } from "./access-ePqdQqkV.js";
-import { n as markFastPathApplied, t as isBulkCommitActive } from "./fastlane-BbexfvHo.js";
-import { n as Fragment, r as STATIC_CHILDREN } from "./jsx-CUpRxrLH.js";
-import { d as getCurrentContextFrame, h as markVNodeTreeWithContextFrame, i as mountInstanceInline, n as createComponentInstance, o as renderComponentInline, p as getVNodeContextFrame, t as captureInlineRenderSnapshot, y as withContext } from "./component-internal-iJ7HAcpc.js";
+import { n as markFastPathApplied, t as isBulkCommitActive } from "./fastlane-CkBXZ_3K.js";
+import { i as isFragmentType, r as STATIC_CHILDREN } from "./jsx-C3IECePB.js";
+import { d as getCurrentContextFrame, h as markVNodeTreeWithContextFrame, i as mountInstanceInline, n as createComponentInstance, o as renderComponentInline, p as getVNodeContextFrame, t as captureInlineRenderSnapshot, y as withContext } from "./component-internal-BuTG89T8.js";
 import { b as restoreDomCommitScope, c as enterDomCommitScope, p as getCurrentInstance } from "./component-scope-DzJEbYGE.js";
 import { t as cleanupComponent } from "./component-cleanup-oWN45rfa.js";
 import { c as getCurrentLifecycleCommitBatch, l as registerLifecycleRollback, p as isPromiseLike, r as discardLifecycleCommitBatch, s as flushLifecycleCommitBatch, t as beginLifecycleCommitBatch, u as registerLifecycleTransaction } from "./lifecycle-batch-CwHCDseR.js";
-import { _ as setControlBoundaryContextFrame, a as registerForStateTransaction, b as rerenderChildScope, c as captureForFallbackTransactionSnapshot, d as clearCaseDomUpdateState, f as clearShowDomUpdateState, g as evaluateShowState, h as evaluateCaseState, i as evaluateForState, l as captureForItemTransactionSnapshot, n as clearForDomUpdateState, o as rollbackForStateTransaction, t as beginForStateTransaction, v as createChildScope, y as disposeChildScope } from "./for-internal-tNicxJY3.js";
+import { _ as setControlBoundaryContextFrame, a as registerForStateTransaction, b as rerenderChildScope, c as captureForFallbackTransactionSnapshot, d as clearCaseDomUpdateState, f as clearShowDomUpdateState, g as evaluateShowState, h as evaluateCaseState, i as evaluateForState, l as captureForItemTransactionSnapshot, n as clearForDomUpdateState, o as rollbackForStateTransaction, t as beginForStateTransaction, v as createChildScope, y as disposeChildScope } from "./for-internal-BnXrQbgo.js";
 import { n as createOwnedFineGrainedEffect, r as markFineGrainedEffectsDirtySource, t as createFineGrainedEffect } from "./effect-2IIWvUjG.js";
-import { C as getDelegatedHandlersForElement, D as updateDelegatedListener, E as removeDelegatedListener, S as getDelegatedHandlerForElement, T as isEventDelegationEnabled, _ as teardownNodeSubtree, a as elementReactivePropsCleanup, b as addFreshDelegatedListener, c as forEachElementReactivePropCleanup, d as removeAllListeners, f as removeElementReactiveProps, g as setFreshElementReactivePropCleanup, h as setDirectElementReactivePropCleanup, i as elementListeners, l as getElementReactivePropCleanupSize, m as replaceElementRefBookkeeping, n as cleanupInstanceIfPresent, o as elementRefs, p as removeElementRef, r as cleanupInstancesUnder, s as forEachDescendantNode, t as REACTIVE_CHILDREN_KEY, u as getElementReactivePropsCleanupMap, v as updateElementRef, w as isDelegatedEvent, x as clearDelegatedHandlersForElement, y as addDelegatedListener } from "./cleanup-e4Rn287s.js";
+import { C as getDelegatedHandlersForElement, D as updateDelegatedListener, E as removeDelegatedListener, S as getDelegatedHandlerForElement, T as isEventDelegationEnabled, _ as teardownNodeSubtree, a as elementReactivePropsCleanup, b as addFreshDelegatedListener, c as forEachElementReactivePropCleanup, d as removeAllListeners, f as removeElementReactiveProps, g as setFreshElementReactivePropCleanup, h as setDirectElementReactivePropCleanup, i as elementListeners, l as getElementReactivePropCleanupSize, m as replaceElementRefBookkeeping, n as cleanupInstanceIfPresent, o as elementRefs, p as removeElementRef, r as cleanupInstancesUnder, s as forEachDescendantNode, t as REACTIVE_CHILDREN_KEY, u as getElementReactivePropsCleanupMap, v as updateElementRef, w as isDelegatedEvent, x as clearDelegatedHandlersForElement, y as addDelegatedListener } from "./cleanup-CyY1ROBI.js";
+import { a as isSSRPortalHydrationAnchor } from "./portal-w3oQ6oQU.js";
 import { n as getPublicAttributeName, t as sanitizeCssValue } from "./css-BuPaTOfe.js";
-import { a as isSafeHref, i as ROUTE_ROOT_COMPONENT } from "./csp-nonce-BLkoekFX.js";
+import { a as isSafeHref, i as ROUTE_ROOT_COMPONENT } from "./csp-nonce-BUsz0Em7.js";
 //#region src/runtime/error-boundary.ts
 function createBoundaryReset(instance) {
 	return () => {
@@ -1817,8 +1818,14 @@ function performFullReconciliation(parent, newChildren, oldKeyMap) {
 }
 //#endregion
 //#region src/renderer/child-shape.ts
-function isFragmentVNode$1(node) {
-	return _isDOMElement(node) && typeof node.type === "symbol" && (node.type === Fragment || String(node.type) === "Symbol(askr.fragment)");
+function isFragmentVNode(node) {
+	return _isDOMElement(node) && isFragmentType(node.type);
+}
+function isTransparentComponentResult(result) {
+	return Array.isArray(result) || _isDOMElement(result) && (result.type === __CONTROL_BOUNDARY__ || hasTransparentComponentResult(result.type) || isFragmentVNode(result));
+}
+function isTransparentComponentRangeResult(result) {
+	return Array.isArray(result) || isFragmentVNode(result);
 }
 function normalizeComponentChildren(result) {
 	if (result === null || result === void 0 || result === false) return [];
@@ -1827,7 +1834,7 @@ function normalizeComponentChildren(result) {
 		for (const child of result) children.push(...normalizeComponentChildren(child));
 		return children;
 	}
-	if (isFragmentVNode$1(result)) return normalizeComponentChildren(result.props?.children ?? result.children ?? []);
+	if (isFragmentVNode(result)) return normalizeComponentChildren(result.props?.children ?? result.children ?? []);
 	return [result];
 }
 function warnMissingKeys(children) {
@@ -1890,7 +1897,7 @@ function tryGetStaticCreateFastPathShape(props, children) {
 //#endregion
 //#region src/renderer/reactive-child-sources.ts
 function collectReactiveScalarSequenceValue(value, normalized) {
-	if (isFragmentVNode$1(value)) return collectReactiveScalarSequenceValue(value.props?.children ?? value.children, normalized);
+	if (isFragmentVNode(value)) return collectReactiveScalarSequenceValue(value.props?.children ?? value.children, normalized);
 	if (Array.isArray(value)) {
 		for (const child of value) if (!collectReactiveScalarSequenceValue(child, normalized)) return false;
 		return true;
@@ -1903,7 +1910,7 @@ function collectReactiveScalarSequenceValue(value, normalized) {
 	return false;
 }
 function collectReactiveScalarChildSource(children, slots, state) {
-	if (isFragmentVNode$1(children)) return collectReactiveScalarChildSource(children.props?.children ?? children.children, slots, state);
+	if (isFragmentVNode(children)) return collectReactiveScalarChildSource(children.props?.children ?? children.children, slots, state);
 	if (Array.isArray(children)) {
 		for (const child of children) if (!collectReactiveScalarChildSource(child, slots, state)) return false;
 		return true;
@@ -1933,7 +1940,7 @@ function getReactiveScalarChildSource(children) {
 	return state.hasDynamic ? slots : null;
 }
 function getSingleReactiveChildBoundarySource(children) {
-	if (isFragmentVNode$1(children)) return getSingleReactiveChildBoundarySource(children.props?.children ?? children.children);
+	if (isFragmentVNode(children)) return getSingleReactiveChildBoundarySource(children.props?.children ?? children.children);
 	if (Array.isArray(children)) {
 		if (children.length !== 1) return null;
 		return getSingleReactiveChildBoundarySource(children[0]);
@@ -1942,7 +1949,7 @@ function getSingleReactiveChildBoundarySource(children) {
 	return null;
 }
 function collectReactiveChildBoundarySequenceSource(children, slots, state) {
-	if (isFragmentVNode$1(children)) return collectReactiveChildBoundarySequenceSource(children.props?.children ?? children.children, slots, state);
+	if (isFragmentVNode(children)) return collectReactiveChildBoundarySequenceSource(children.props?.children ?? children.children, slots, state);
 	if (Array.isArray(children)) {
 		for (const child of children) if (!collectReactiveChildBoundarySequenceSource(child, slots, state)) return false;
 		return true;
@@ -2039,7 +2046,7 @@ function collectReactiveChildValuesAsVNodes(values, children) {
 	for (const value of values) collectReactiveChildBoundaryVNodes(value, children);
 }
 function normalizeReactiveChildBoundaryVNode(value) {
-	if (!isFragmentVNode$1(value)) return value;
+	if (!isFragmentVNode(value)) return value;
 	const children = normalizeComponentChildren(value);
 	if (children.length !== 1) return value;
 	return normalizeReactiveChildBoundaryVNode(children[0]);
@@ -2047,7 +2054,7 @@ function normalizeReactiveChildBoundaryVNode(value) {
 function isSingleRootReactiveChildBoundaryValue(value) {
 	if (value === null || value === void 0 || value === false) return true;
 	if (Array.isArray(value)) return value.length === 1 && isSingleRootReactiveChildBoundaryValue(value[0]);
-	if (isFragmentVNode$1(value)) {
+	if (isFragmentVNode(value)) {
 		const children = normalizeComponentChildren(value);
 		return children.length === 1 && isSingleRootReactiveChildBoundaryValue(children[0]);
 	}
@@ -2059,7 +2066,7 @@ function collectReactiveChildBoundaryVNodes(value, children) {
 		for (const child of value) collectReactiveChildBoundaryVNodes(child, children);
 		return;
 	}
-	if (isFragmentVNode$1(value)) {
+	if (isFragmentVNode(value)) {
 		collectReactiveChildBoundaryVNodes(value.props?.children ?? value.children, children);
 		return;
 	}
@@ -2489,9 +2496,6 @@ function syncReactiveScalarChild(el, children, host) {
 /**
 * Static subtree reuse checks for intrinsic DOM children.
 */
-function isFragmentVNode(node) {
-	return _isDOMElement(node) && typeof node.type === "symbol" && (node.type === Fragment || String(node.type) === "Symbol(askr.fragment)");
-}
 function upperCommonTagName(tag) {
 	switch (tag) {
 		case "div": return "DIV";
@@ -2596,7 +2600,7 @@ function updateElementChildren$1(el, children, forceUpdate = false) {
 		el.textContent = "";
 		return;
 	}
-	if (!Array.isArray(children) && isFragmentVNode$1(children)) {
+	if (!Array.isArray(children) && isFragmentVNode(children)) {
 		updateUnkeyedChildren(el, normalizeComponentChildren(children), forceUpdate);
 		return;
 	}
@@ -2705,7 +2709,11 @@ function updateMixedControlChildren(parent, children, forceUpdate) {
 				else if (cursorWasReplaced && isRangeStart(cursor)) cursor = findRangeEnd(cursor)?.nextSibling ?? last.end.nextSibling;
 				else if (isRangeStart(cursor)) cursor = findRangeEnd(cursor)?.nextSibling ?? last.end.nextSibling;
 				else cursor = last.end.nextSibling;
-			} else if (cursor?.parentNode !== parent) cursor = cursorAfterBoundary?.parentNode === parent ? cursorAfterBoundary : null;
+			} else {
+				const inactiveBoundaryCursor = cursor?.parentNode === parent ? cursor : cursorAfterBoundary?.parentNode === parent ? cursorAfterBoundary : null;
+				const inactiveBoundaryEnd = inactiveBoundaryCursor && isRangeStart(inactiveBoundaryCursor) ? findRangeEnd(inactiveBoundaryCursor) : null;
+				cursor = inactiveBoundaryEnd?.previousSibling === inactiveBoundaryCursor ? inactiveBoundaryEnd.nextSibling : inactiveBoundaryCursor;
+			}
 			continue;
 		}
 		if (cursor) cursor = removeRangeAtCursor(parent, cursor);
@@ -2720,7 +2728,7 @@ function updateMixedControlChildren(parent, children, forceUpdate) {
 			continue;
 		}
 		if (cursor && _isDOMElement(child) && typeof child.type === "function") {
-			const synced = domHost.syncComponentElement(cursor, child, child.type, (child.props ?? {}) || {}, parentNamespace, forceUpdate);
+			const synced = domHost.syncComponentElement(cursor, child, child.type, (child.props ?? {}) || {}, parentNamespace, forceUpdate, void 0, void 0, true);
 			if (synced) {
 				cursor = synced.nextSibling;
 				continue;
@@ -2763,9 +2771,9 @@ function getOrBuildDomKeyMap(parent) {
 function updateUnkeyedChildren(parent, newChildren, forceUpdate = false) {
 	const parentNamespace = getParentNamespace(parent);
 	const domHost = getRendererDOMHost();
-	const trySyncComponentChild = (currentDom, next) => {
+	const trySyncComponentChild = (currentDom, next, hydrationRangeEnd) => {
 		if (typeof next.type !== "function") return null;
-		return domHost.syncComponentElement(currentDom, next, next.type, (next.props ?? {}) || {}, parentNamespace, forceUpdate);
+		return domHost.syncComponentElement(currentDom, next, next.type, (next.props ?? {}) || {}, parentNamespace, forceUpdate, void 0, hydrationRangeEnd, true);
 	};
 	const hasText = newChildren.some((c) => typeof c === "string" || typeof c === "number");
 	const hasElements = newChildren.some((c) => _isDOMElement(c));
@@ -2809,14 +2817,13 @@ function updateUnkeyedChildren(parent, newChildren, forceUpdate = false) {
 	const existing = Array.from(parent.children);
 	if (hasText || hasComponentChildren || hasEmptyChildren || hasNonElementDomChildren) {
 		const allNodes = Array.from(parent.childNodes);
-		const max = Math.max(allNodes.length, newChildren.length);
-		for (let i = 0; i < max; i++) {
+		for (let i = 0; i < Math.max(allNodes.length, newChildren.length); i += 1) {
 			const currentNode = allNodes[i];
 			const next = newChildren[i];
 			const nextIsEmpty = isEmptyChild(next);
 			if (nextIsEmpty && currentNode) {
 				teardownNodeSubtree(currentNode);
-				currentNode.remove();
+				currentNode.parentNode?.removeChild(currentNode);
 				continue;
 			}
 			if (!currentNode && !nextIsEmpty) {
@@ -2844,7 +2851,18 @@ function updateUnkeyedChildren(parent, newChildren, forceUpdate = false) {
 				}
 				else {
 					if (trySyncControlBoundaryChild(parent, currentNode, next)) continue;
-					if (!trySyncComponentChild(currentEl, next)) {
+					const remainingExpected = newChildren.length - i - 1;
+					const hydrationRangeEndIndex = allNodes.length - remainingExpected;
+					const synced = trySyncComponentChild(currentEl, next, hydrationRangeEndIndex > i ? allNodes[hydrationRangeEndIndex] ?? null : void 0);
+					if (synced && isRangeStart(synced)) {
+						allNodes.splice(i, Math.max(1, hydrationRangeEndIndex - i), synced);
+						continue;
+					}
+					if (synced && synced !== currentNode && synced.nextSibling === currentNode) {
+						allNodes.splice(i, 0, synced);
+						continue;
+					}
+					if (!synced) {
 						const dom = domHost.createDOMNode(next, parentNamespace);
 						if (dom) {
 							teardownNodeSubtree(currentEl);
@@ -2853,7 +2871,20 @@ function updateUnkeyedChildren(parent, newChildren, forceUpdate = false) {
 					}
 				}
 			} else {
-				if (typeof next.type === "function" && trySyncComponentChild(currentNode, next)) continue;
+				if (typeof next.type === "function") {
+					const remainingExpected = newChildren.length - i - 1;
+					const hydrationRangeEndIndex = allNodes.length - remainingExpected;
+					const synced = trySyncComponentChild(currentNode, next, hydrationRangeEndIndex > i ? allNodes[hydrationRangeEndIndex] ?? null : void 0);
+					if (synced && isRangeStart(synced)) {
+						allNodes.splice(i, Math.max(1, hydrationRangeEndIndex - i), synced);
+						continue;
+					}
+					if (synced && synced !== currentNode && synced.nextSibling === currentNode) {
+						allNodes.splice(i, 0, synced);
+						continue;
+					}
+					if (synced) continue;
+				}
 				const dom = domHost.createDOMNode(next, parentNamespace);
 				if (dom) {
 					teardownNodeSubtree(currentNode);
@@ -3890,7 +3921,7 @@ function tryFirstRenderKeyedChildren(target, vnode) {
 	return true;
 }
 function isFragment(vnode) {
-	return _isDOMElement(vnode) && typeof vnode.type === "symbol" && (vnode.type === Fragment || String(vnode.type) === "Symbol(askr.fragment)");
+	return _isDOMElement(vnode) && isFragmentType(vnode.type);
 }
 function getFragmentChildren(vnode) {
 	const fragmentChildren = vnode.props?.children ?? vnode.children ?? [];
@@ -4353,6 +4384,11 @@ function checkVNodeShapeChanged(dom, vnode) {
 	if (typeof vnode.type !== "string") return true;
 	return dom.tagName.toLowerCase() !== vnode.type.toLowerCase();
 }
+function canAdoptHydratedElement(dom, vnode) {
+	if (!_isDOMElement(vnode)) return false;
+	if (typeof vnode.type === "function") return true;
+	return !checkVNodeShapeChanged(dom, vnode);
+}
 function adoptHydratedRange(parent, scope, before, vnode) {
 	if (!scope.hydrationPending || !before || !isRangeStart(before)) return null;
 	const end = findRangeEnd(before);
@@ -4363,7 +4399,7 @@ function adoptHydratedRange(parent, scope, before, vnode) {
 		single: false
 	};
 	const contentNodes = getRangeNodes(range);
-	const expectedChildren = _isDOMElement(vnode) && vnode.type === Fragment ? vnode.props?.children ?? [] : [vnode];
+	const expectedChildren = _isDOMElement(vnode) && isFragmentType(vnode.type) ? vnode.props?.children ?? [] : [vnode];
 	if (contentNodes.length !== expectedChildren.length) return null;
 	for (let index = 0; index < expectedChildren.length; index += 1) {
 		const expected = expectedChildren[index];
@@ -4521,7 +4557,7 @@ function syncControlBoundaryInMixedParent(parent, controlState, childrenVNodes,
 			const item = controlState.orderedItems[index];
 			const vnode = childrenVNodes[index];
 			if (!item || vnode === void 0) continue;
-			if (item.scope.hydrationPending && !item.scope.range && syncBefore instanceof Element && getMaterializedKey(syncBefore) === controlState.orderedKeys[index] && !checkVNodeShapeChanged(syncBefore, vnode)) {
+			if (item.scope.hydrationPending && !item.scope.range && syncBefore instanceof Element && getMaterializedKey(syncBefore) === controlState.orderedKeys[index] && canAdoptHydratedElement(syncBefore, vnode)) {
 				assignScopeRange(item.scope, {
 					start: syncBefore,
 					end: syncBefore,
@@ -4551,6 +4587,14 @@ function syncControlBoundaryInMixedParent(parent, controlState, childrenVNodes,
 	}
 	const activeScope = controlState.activeScope;
 	const activeVNode = childrenVNodes[0];
+	if (activeScope?.hydrationPending && activeVNode !== void 0 && !activeScope.range && controlState.lastRemovedRanges.length === 0 && before instanceof Element && canAdoptHydratedElement(before, activeVNode)) {
+		assignScopeRange(activeScope, {
+			start: before,
+			end: before,
+			single: true
+		});
+		activeScope.hydrationPending = false;
+	}
 	const nextRange = activeScope && activeVNode !== void 0 ? syncControlBoundaryScopeDom(parent, activeScope, activeVNode, before, controlState.lastRemovedRanges.length === 0) : null;
 	for (const range of controlState.lastRemovedRanges) if (range !== nextRange) removeRange(range, teardownBoundaryRangeNode);
 	for (const node of controlState.lastRemovedNodes) if (node.parentNode === parent) teardownBoundaryRangeNode(node);
@@ -4772,6 +4816,120 @@ function trySyncControlBoundaryChild(parent, currentNode, next) {
 	return true;
 }
 //#endregion
+//#region src/renderer/component-fragment-range.ts
+function captureRangeFocus(range, parent) {
+	const active = parent.ownerDocument.activeElement;
+	if (typeof HTMLElement === "undefined" || !(active instanceof HTMLElement) || !parent.contains(active)) return () => {};
+	let rangeChild = active;
+	while (rangeChild.parentNode && rangeChild.parentNode !== parent) rangeChild = rangeChild.parentNode;
+	if (rangeChild.parentNode !== parent || !rangeContains(range, rangeChild)) return () => {};
+	const selection = active instanceof HTMLInputElement || active instanceof HTMLTextAreaElement ? {
+		start: active.selectionStart,
+		end: active.selectionEnd,
+		direction: active.selectionDirection
+	} : null;
+	return () => {
+		if (!active.isConnected || active.ownerDocument.activeElement === active) return;
+		try {
+			active.focus({ preventScroll: true });
+		} catch {
+			active.focus();
+		}
+		if (selection && (active instanceof HTMLInputElement || active instanceof HTMLTextAreaElement) && selection.start !== null && selection.end !== null) active.setSelectionRange(selection.start, selection.end, selection.direction ?? void 0);
+	};
+}
+function unwrapStagingHost(staging, parent, restoreFocus) {
+	if (staging.parentNode !== parent) return;
+	while (staging.firstChild) parent.insertBefore(staging.firstChild, staging);
+	staging.remove();
+	restoreFocus();
+}
+function createAttributeFreeStagingHost(parent) {
+	return parent.ownerDocument.createElementNS(parent.namespaceURI, parent.localName);
+}
+function isAutomaticPortalHost(node) {
+	const host = node;
+	const instances = new Set(host.__ASKR_INSTANCES ?? []);
+	if (host.__ASKR_INSTANCE) instances.add(host.__ASKR_INSTANCE);
+	return instances.size > 0 && Array.from(instances).some((candidate) => candidate.props.__askrAutoDefaultPortal === true);
+}
+function adoptHydratedComponentRange(existingHost, instance, result, endExclusive, forceChildrenUpdate, retainedInstances) {
+	const parent = existingHost.parentNode;
+	if (!(parent instanceof Element) || endExclusive !== null && endExclusive.parentNode !== parent) return null;
+	if (endExclusive !== null) {
+		let current = existingHost;
+		while (current && current !== endExclusive) current = current.nextSibling;
+		if (current !== endExclusive) return null;
+	}
+	const start = existingHost.ownerDocument.createComment(RANGE_START_MARKER);
+	const end = existingHost.ownerDocument.createComment(RANGE_END_MARKER);
+	parent.insertBefore(start, existingHost);
+	parent.insertBefore(end, endExclusive);
+	registerRange({
+		start,
+		end,
+		single: false
+	}, instance);
+	const host = start;
+	const owners = new Set(retainedInstances);
+	owners.add(instance);
+	host.__ASKR_INSTANCE = instance;
+	host.__ASKR_INSTANCES = Array.from(owners);
+	instance.target = null;
+	instance._placeholder = start;
+	mountInstanceInline(instance, null);
+	const registered = registerLifecycleTransaction({}, () => {}, () => {
+		start.parentNode?.removeChild(start);
+		end.parentNode?.removeChild(end);
+	});
+	try {
+		if (!syncComponentFragmentRange(host, instance, result, forceChildrenUpdate)) throw new Error("[askr] Failed to adopt hydrated component range.");
+	} catch (error) {
+		if (!registered) {
+			start.remove();
+			end.remove();
+		}
+		throw error;
+	}
+	return start;
+}
+function syncComponentFragmentRange(host, instance, result, forceUpdate) {
+	if (!isTransparentComponentRangeResult(result)) return false;
+	const range = getOwnedRange(instance);
+	const parent = range?.start.parentNode;
+	if (!range || range.single || range.start !== host || !(parent instanceof Element)) return false;
+	const restoreFocus = captureRangeFocus(range, parent);
+	const normalizedChildren = normalizeComponentChildren(result);
+	const preserveForeignHosts = Array.isArray(result);
+	const staging = createAttributeFreeStagingHost(parent);
+	try {
+		parent.insertBefore(staging, range.end);
+	} catch {
+		staging.remove();
+		return false;
+	}
+	if (staging.parentNode !== parent || staging.nextSibling !== range.end) {
+		staging.remove();
+		restoreFocus();
+		return false;
+	}
+	let current = range.start.nextSibling;
+	while (current && current !== staging) {
+		const next = current.nextSibling;
+		if (!preserveForeignHosts || !isAutomaticPortalHost(current)) staging.appendChild(current);
+		current = next;
+	}
+	const rollbackStaging = registerLifecycleTransaction({}, () => {}, () => unwrapStagingHost(staging, parent, restoreFocus));
+	try {
+		getRendererDOMHost().updateElementChildren(staging, normalizedChildren, forceUpdate);
+	} catch (error) {
+		if (!rollbackStaging) unwrapStagingHost(staging, parent, restoreFocus);
+		throw error;
+	}
+	if (!registerLifecycleTransaction({}, () => unwrapStagingHost(staging, parent, restoreFocus), () => {})) unwrapStagingHost(staging, parent, restoreFocus);
+	return true;
+}
+//#endregion
 //#region src/renderer/component-host-cleanup.ts
 function cleanupDetachedComponentHost(host, retainedInstance) {
 	const retainedInstances = retainedInstance instanceof Object && typeof retainedInstance[Symbol.iterator] === "function" ? new Set(retainedInstance) : /* @__PURE__ */ new Set([retainedInstance]);
@@ -4971,11 +5129,19 @@ function inheritComponentKey(target, source) {
 	}
 	return target;
 }
+function extractComponentIdentityKey(node) {
+	const publicKey = extractKey(node);
+	if (publicKey !== void 0) return publicKey;
+	if (typeof node !== "object" || node === null) return;
+	const internalKey = node.props?.["__askrIdentityKey"];
+	if (internalKey === void 0 || internalKey === null) return;
+	return typeof internalKey === "symbol" ? String(internalKey) : internalKey;
+}
 function setComponentOwnershipIdentity(instance, node, parent, wrapperDepth = 0, position) {
 	instance._vnodeOwner = typeof node === "object" && node !== null ? node : void 0;
 	instance._vnodeParent = parent;
 	instance._vnodeParentGeneration = parent?._ownershipGeneration;
-	const key = extractKey(node);
+	const key = extractComponentIdentityKey(node);
 	if (key === void 0) delete instance._vnodeKey;
 	else instance._vnodeKey = key;
 	instance._vnodePosition = position;
@@ -4986,7 +5152,7 @@ function findHostInstanceByType(host, type, node, parent, wrapperDepth) {
 	if (instances && instances.length > 0) {
 		const vnodeOwner = getVNodeComponentInstance(node);
 		if (vnodeOwner && vnodeOwner.fn === type && instances.includes(vnodeOwner)) return vnodeOwner;
-		const key = extractKey(node);
+		const key = extractComponentIdentityKey(node);
 		const identityMatches = instances.filter((instance) => {
 			if (instance.fn !== type) return false;
 			if (parent !== void 0 && instance._vnodeParent !== parent) return false;
@@ -5002,7 +5168,7 @@ function findHostInstanceByType(host, type, node, parent, wrapperDepth) {
 	}
 	if (host.__ASKR_INSTANCE?.fn === type) {
 		const instance = host.__ASKR_INSTANCE;
-		const key = extractKey(node);
+		const key = extractComponentIdentityKey(node);
 		if ((parent === void 0 || instance._vnodeParent === parent) && (key === void 0 || instance._vnodeKey === key) && (wrapperDepth === void 0 || instance._wrapperDepth === wrapperDepth)) return instance;
 		if (node === void 0 && parent === void 0 && wrapperDepth === void 0) return instance;
 	}
@@ -5010,8 +5176,9 @@ function findHostInstanceByType(host, type, node, parent, wrapperDepth) {
 }
 /**
 * Resolve an instance on a comment host only when the vnode carries durable
-* identity. Fresh unkeyed null components intentionally supersede the old
-* generation instead of falling back to type-only reuse.
+* identity. An unkeyed multi-node range can also move through transparent
+* wrapper owners while its recorded owner generation remains live. Fresh
+* unkeyed null components still supersede the old generation.
 */
 function findStableHostInstanceByType(host, type, node, parent, wrapperDepth) {
 	const instances = new Set(host.__ASKR_INSTANCES ?? []);
@@ -5019,10 +5186,21 @@ function findStableHostInstanceByType(host, type, node, parent, wrapperDepth) {
 	const parentGeneration = parent?._ownershipGeneration;
 	const vnodeOwner = getVNodeComponentInstance(node);
 	if (vnodeOwner?.fn === type && instances.has(vnodeOwner) && vnodeOwner._vnodeParent === parent && vnodeOwner._vnodeParentGeneration === parentGeneration) return vnodeOwner;
-	const key = extractKey(node);
-	if (key === void 0) return null;
+	const key = extractComponentIdentityKey(node);
+	if (key === void 0) {
+		const rangeMatches = Array.from(instances).filter((instance) => {
+			const range = getOwnedRange(instance);
+			return instance.fn === type && instance._vnodeParent !== parent && instance._vnodeParent != null && instance._vnodeParentGeneration === instance._vnodeParent._ownershipGeneration && instance._vnodeKey === void 0 && instance._wrapperDepth === wrapperDepth && (range?.single === false && range.start === host || host instanceof Comment && host.data === "askr-range-start" && instance._placeholder === host);
+		});
+		return rangeMatches.length === 1 ? rangeMatches[0] : null;
+	}
 	const matches = Array.from(instances).filter((instance) => instance.fn === type && instance._vnodeParent === parent && instance._vnodeParentGeneration === parentGeneration && instance._vnodeKey === key && instance._wrapperDepth === wrapperDepth);
-	return matches.length > 0 ? matches[matches.length - 1] : null;
+	if (matches.length > 0) return matches[matches.length - 1];
+	const rangeMatches = Array.from(instances).filter((instance) => {
+		const range = getOwnedRange(instance);
+		return instance.fn === type && instance._vnodeParent !== parent && instance._vnodeParent != null && instance._vnodeParentGeneration === instance._vnodeParent._ownershipGeneration && instance._vnodeKey === key && instance._wrapperDepth === wrapperDepth && (range?.single === false && range.start === host || host instanceof Comment && host.data === "askr-range-start" && instance._placeholder === host);
+	});
+	return rangeMatches.length === 1 ? rangeMatches[0] : null;
 }
 //#endregion
 //#region src/renderer/component-host-replacement.ts
@@ -5165,6 +5343,39 @@ function registerVNodeComponentInstanceRollback(node, previousInstance, provisio
 }
 //#endregion
 //#region src/renderer/component-host-results.ts
+function retainReplacementOwnerChain(host, owner, retainedInstances) {
+	const componentHost = host;
+	const next = [...componentHost.__ASKR_INSTANCES ?? []];
+	for (const instance of retainedInstances) if (!next.includes(instance)) next.push(instance);
+	componentHost.__ASKR_INSTANCES = next;
+	componentHost.__ASKR_INSTANCE = owner;
+}
+function adoptEmptySSRPortalHydrationHost(host, instance, retainedInstances, result) {
+	if (!isSSRPortalHydrationAnchor(host) || result !== null && result !== void 0 && result !== false) return false;
+	const instanceHost = host;
+	instanceHost.__ASKR_INSTANCE = instance;
+	instanceHost.__ASKR_INSTANCES = Array.from(/* @__PURE__ */ new Set([instance, ...retainedInstances]));
+	instance._placeholder = instanceHost;
+	mountInstanceInline(instance, null);
+	retainReplacementOwnerChain(instanceHost, instance, retainedInstances);
+	return true;
+}
+function materializeEmptyHydrationPlaceholder(existingHost, instance, retainedInstances, result, preserveHydrationCursor) {
+	if (!preserveHydrationCursor && !isSSRPortalHydrationAnchor(existingHost) || result !== null && result !== void 0 && result !== false) return null;
+	const placeholder = isSSRPortalHydrationAnchor(existingHost) ? existingHost : (existingHost.ownerDocument ?? document).createComment("");
+	if (placeholder !== existingHost) existingHost.parentNode?.insertBefore(placeholder, existingHost);
+	const host = placeholder;
+	host.__ASKR_INSTANCE = instance;
+	host.__ASKR_INSTANCES = [instance];
+	instance._placeholder = placeholder;
+	mountInstanceInline(instance, null);
+	retainReplacementOwnerChain(placeholder, instance, retainedInstances);
+	return placeholder;
+}
+function itemInstanceHydrationComplete(host) {
+	const scope = host.__ASKR_INSTANCE?.scope;
+	if (scope) scope.hydrationPending = false;
+}
 function materializeComponentResultNode(childInstance, result, parentNamespace) {
 	const dom = getRendererDOMHost().createComponentResultNode(childInstance.fn, result, parentNamespace);
 	if (dom instanceof Element) {
@@ -5182,7 +5393,17 @@ function materializeComponentResultNode(childInstance, result, parentNamespace)
 		mountInstanceInline(childInstance, null);
 		return placeholder;
 	}
-	if (!_isDOMElement(result) || result.type !== __CONTROL_BOUNDARY__) {
+	if (dom instanceof Comment) {
+		const host = dom;
+		const instances = host.__ASKR_INSTANCES ?? [];
+		if (!instances.includes(childInstance)) instances.push(childInstance);
+		host.__ASKR_INSTANCES = instances;
+		host.__ASKR_INSTANCE = instances[0] ?? childInstance;
+		childInstance._placeholder = dom;
+		mountInstanceInline(childInstance, null);
+		return dom;
+	}
+	if (!isTransparentComponentResult(result)) {
 		const host = document.createElement("div");
 		host.appendChild(dom);
 		host.__ASKR_WRAPPER_HOST = true;
@@ -5306,15 +5527,15 @@ function resolveWrapperHostResult(host, result, snapshot, retainedInstances) {
 }
 //#endregion
 //#region src/renderer/component-host.ts
-function syncComponentElement(currentDom, node, type, props, parentNamespace, forceChildrenUpdate = false, retainedHostInstances) {
+function syncComponentElement(currentDom, node, type, props, parentNamespace, forceChildrenUpdate = false, retainedHostInstances, hydrationRangeEnd, preserveHydrationCursorOnEmpty = false) {
 	const existingHost = currentDom instanceof Element || currentDom instanceof Comment ? currentDom : null;
 	const existingInstance = existingHost ? existingHost instanceof Comment ? findStableHostInstanceByType(existingHost, type, node, getCurrentInstance(), 0) : findHostInstanceByType(existingHost, type, node, getCurrentInstance(), 0) : null;
 	if (!existingHost) return null;
 	const domHost = getRendererDOMHost();
 	if (!existingInstance || existingInstance.fn !== type) {
-		if (!(existingHost instanceof Element)) return null;
+		if (!(existingHost instanceof Element) && !isSSRPortalHydrationAnchor(existingHost)) return null;
 		const snapshot = getVNodeContextFrame(node) || getCurrentContextFrame() || null;
-		const hydrationInstance = createComponentInstance(nextComponentInstanceId(), type, props || {}, existingHost);
+		const hydrationInstance = createComponentInstance(nextComponentInstanceId(), type, props || {}, existingHost instanceof Element ? existingHost : null);
 		setComponentOwnershipIdentity(hydrationInstance, node, getCurrentInstance(), 0);
 		hydrationInstance.isRoot = isRouteRootComponentVNode(node);
 		hydrationInstance.portalScope = getCurrentInstance()?.portalScope ?? hydrationInstance.portalScope;
@@ -5330,7 +5551,13 @@ function syncComponentElement(currentDom, node, type, props, parentNamespace, fo
 			const result = withContext(snapshot, () => renderComponentInline(hydrationInstance));
 			if (isPromiseLike(result)) throw new Error("Async components are not supported. Components must return synchronously.");
 			const scopedResult = markVNodeTreeWithContextFrame(result, snapshot ?? null);
-			if (scopedResult && typeof scopedResult === "object" && "type" in scopedResult && typeof scopedResult.type === "string" && tagNamesEqualIgnoreCase$1(existingHost.tagName, scopedResult.type)) {
+			const emptyPlaceholder = materializeEmptyHydrationPlaceholder(existingHost, hydrationInstance, liveRetainedInstances, scopedResult, preserveHydrationCursorOnEmpty);
+			if (emptyPlaceholder) return emptyPlaceholder;
+			if (hydrationRangeEnd !== void 0 && isTransparentComponentRangeResult(scopedResult)) {
+				const adoptedHost = adoptHydratedComponentRange(existingHost, hydrationInstance, scopedResult, hydrationRangeEnd, forceChildrenUpdate || hydrationInstance.mounted === false, liveRetainedInstances);
+				if (adoptedHost) return adoptedHost;
+			}
+			if (existingHost instanceof Element && scopedResult && typeof scopedResult === "object" && "type" in scopedResult && typeof scopedResult.type === "string" && tagNamesEqualIgnoreCase$1(existingHost.tagName, scopedResult.type)) {
 				withContext(snapshot, () => {
 					domHost.updateElementFromVnode(existingHost, inheritComponentKey(scopedResult, node), true, forceChildrenUpdate || hydrationInstance.mounted === false);
 					materializeKey(existingHost, node, props);
@@ -5340,7 +5567,12 @@ function syncComponentElement(currentDom, node, type, props, parentNamespace, fo
 				return existingHost;
 			}
 			const resolvedResult = resolveHostNestedComponentResult(existingHost, hydrationInstance, scopedResult, snapshot ?? null, liveRetainedInstances);
-			if (_isDOMElement(resolvedResult) && typeof resolvedResult.type === "string" && tagNamesEqualIgnoreCase$1(existingHost.tagName, resolvedResult.type)) {
+			if (adoptEmptySSRPortalHydrationHost(existingHost, hydrationInstance, liveRetainedInstances, resolvedResult)) return existingHost;
+			if (hydrationRangeEnd !== void 0 && isTransparentComponentRangeResult(resolvedResult)) {
+				const adoptedHost = adoptHydratedComponentRange(existingHost, hydrationInstance, resolvedResult, hydrationRangeEnd, forceChildrenUpdate || hydrationInstance.mounted === false, liveRetainedInstances);
+				if (adoptedHost) return adoptedHost;
+			}
+			if (existingHost instanceof Element && _isDOMElement(resolvedResult) && typeof resolvedResult.type === "string" && tagNamesEqualIgnoreCase$1(existingHost.tagName, resolvedResult.type)) {
 				withContext(snapshot, () => {
 					domHost.updateElementFromVnode(existingHost, inheritComponentKey(resolvedResult, node), true, forceChildrenUpdate || hydrationInstance.mounted === false);
 					materializeKey(existingHost, node, props);
@@ -5378,6 +5610,7 @@ function syncComponentElement(currentDom, node, type, props, parentNamespace, fo
 		domHost.updateElementChildren(existingHost, normalizeComponentChildren(wrapperResult));
 		return existingHost;
 	}
+	if (existingHost instanceof Comment && syncComponentFragmentRange(existingHost, existingInstance, scopedResult, forceChildrenUpdate || existingInstance.mounted === false)) return existingHost;
 	if (existingHost instanceof Element && scopedResult && typeof scopedResult === "object" && "type" in scopedResult && typeof scopedResult.type === "string" && tagNamesEqualIgnoreCase$1(existingHost.tagName, scopedResult.type)) {
 		withContext(snapshot, () => {
 			domHost.updateElementFromVnode(existingHost, inheritComponentKey(scopedResult, node), true, forceChildrenUpdate || existingInstance.mounted === false);
@@ -5386,6 +5619,7 @@ function syncComponentElement(currentDom, node, type, props, parentNamespace, fo
 		return existingHost;
 	}
 	const resolvedResult = resolveHostNestedComponentResult(existingHost, existingInstance, scopedResult, snapshot ?? null, liveRetainedInstances);
+	if (existingHost instanceof Comment && syncComponentFragmentRange(existingHost, existingInstance, resolvedResult, forceChildrenUpdate || existingInstance.mounted === false)) return existingHost;
 	if (existingHost instanceof Comment && (resolvedResult === null || resolvedResult === void 0 || resolvedResult === false)) {
 		retainReplacementOwnerChain(existingHost, existingInstance, liveRetainedInstances);
 		for (const instance of liveRetainedInstances) if (instance.target === null || instance._placeholder === existingHost) {
@@ -5406,20 +5640,6 @@ function syncComponentElement(currentDom, node, type, props, parentNamespace, fo
 		retainReplacementOwnerChain(replacement, existingInstance, liveRetainedInstances);
 	});
 }
-function retainReplacementOwnerChain(host, owner, retainedInstances) {
-	const componentHost = host;
-	const next = [...componentHost.__ASKR_INSTANCES ?? []];
-	for (const instance of retainedInstances) if (!next.includes(instance)) next.push(instance);
-	componentHost.__ASKR_INSTANCES = next;
-	componentHost.__ASKR_INSTANCE = owner;
-}
-function itemInstanceHydrationComplete(host) {
-	const instance = host.__ASKR_INSTANCE;
-	if (instance) {
-		const scope = instance.scope;
-		if (scope) scope.hydrationPending = false;
-	}
-}
 function createComponentElement(node, type, props, parentNamespace) {
 	const snapshot = getVNodeContextFrame(node) || getCurrentContextFrame();
 	const componentFn = type;
@@ -5660,7 +5880,7 @@ function getVNodeChildren(vnode) {
 function getDirectReactiveCompute(value) {
 	if (typeof value === "function") return value;
 	if (Array.isArray(value)) return value.length === 1 ? getDirectReactiveCompute(value[0]) : null;
-	if (typeof value === "object" && value !== null && isFragmentVNode$1(value)) return getDirectReactiveCompute(getVNodeChildren(value));
+	if (typeof value === "object" && value !== null && isFragmentVNode(value)) return getDirectReactiveCompute(getVNodeChildren(value));
 	return null;
 }
 const ownerBlueprints = /* @__PURE__ */ new WeakMap();
@@ -5715,7 +5935,7 @@ function collectReactiveSlotShapes(value, slots) {
 		});
 		return true;
 	}
-	if (typeof value === "object" && value !== null && isFragmentVNode$1(value)) return collectReactiveSlotShapes(getVNodeChildren(value), slots);
+	if (typeof value === "object" && value !== null && isFragmentVNode(value)) return collectReactiveSlotShapes(getVNodeChildren(value), slots);
 	return false;
 }
 function collectStaticVNodeChildren(value, children) {
@@ -5733,7 +5953,7 @@ function collectStaticVNodeChildren(value, children) {
 			children.push(value);
 			return true;
 		}
-		if (typeof value.type === "symbol" && isFragmentVNode$1(value)) return collectStaticVNodeChildren(getVNodeChildren(value), children);
+		if (typeof value.type === "symbol" && isFragmentVNode(value)) return collectStaticVNodeChildren(getVNodeChildren(value), children);
 	}
 	return false;
 }
@@ -5845,7 +6065,7 @@ function matchReactiveSlots(value, slots, startIndex) {
 	if (!slot) return -1;
 	if (typeof value === "function") return slot.kind === "dynamic" ? startIndex + 1 : -1;
 	if (typeof value === "string" || typeof value === "number") return slot.kind === "static" && slot.value === String(value) ? startIndex + 1 : -1;
-	if (typeof value === "object" && value !== null && isFragmentVNode$1(value)) return matchReactiveSlots(getVNodeChildren(value), slots, startIndex);
+	if (typeof value === "object" && value !== null && isFragmentVNode(value)) return matchReactiveSlots(getVNodeChildren(value), slots, startIndex);
 	return -1;
 }
 //#endregion
@@ -6044,7 +6264,7 @@ function prepareStaticSlots(element, value, slots, startIndex, bindings, deferre
 	const childNode = element.childNodes[startIndex];
 	if (typeof value === "string" || typeof value === "number") return slot?.kind === "text" && slot.value === String(value) ? startIndex + 1 : -1;
 	if (!_isDOMElement(value)) return -1;
-	if (typeof value.type === "symbol") return isFragmentVNode$1(value) ? prepareStaticSlots(element, getVNodeChildren(value), slots, startIndex, bindings, deferred) : -1;
+	if (typeof value.type === "symbol") return isFragmentVNode(value) ? prepareStaticSlots(element, getVNodeChildren(value), slots, startIndex, bindings, deferred) : -1;
 	if (slot?.kind === "element" && childNode !== void 0) return prepareElementBlueprint(childNode, value, slot.shape, bindings, deferred) ? startIndex + 1 : -1;
 	return -1;
 }
@@ -6152,7 +6372,7 @@ function createDOMNode(node, parentNamespace) {
 		if (typeof type === "function") return createComponentElement(node, type, props, parentNamespace);
 		if (type === __CONTROL_BOUNDARY__) return createForBoundary(node, props, parentNamespace);
 		if (type === __ERROR_BOUNDARY__) return createErrorBoundaryElement(node, props, parentNamespace);
-		if (typeof type === "symbol" && (type === Fragment || String(type) === "Symbol(Fragment)")) return createFragmentElement(node, props, parentNamespace);
+		if (isFragmentType(type)) return createFragmentElement(node, props, parentNamespace);
 	}
 	return null;
 }
@@ -6469,6 +6689,11 @@ function replaceComponentRange(instance, result, placeholder) {
 	const previousRange = getOwnedRange(instance);
 	const parent = placeholder.parentNode;
 	if (!previousRange || previousRange.single || previousRange.start !== placeholder || !(parent instanceof Element)) return null;
+	if (syncComponentFragmentRange(placeholder, instance, result, false)) return placeholder;
+	if (_isDOMElement(result) && hasTransparentComponentResult(result.type)) {
+		const retainedInstances = createRetainedHostInstanceSet(instance);
+		if (syncComponentFragmentRange(placeholder, instance, resolveHostNestedComponentResult(placeholder, instance, result, getVNodeContextFrame(result) ?? instance.ownerFrame ?? null, retainedInstances), false)) return placeholder;
+	}
 	const next = createDetachedRange(materializeComponentResultNode(instance, result, getParentNamespace(parent)), instance);
 	const nextHost = next.range.start;
 	nextHost.__ASKR_INSTANCE = instance;