@vue/runtime-core 3.6.0-rc.10 → 3.6.0-rc.12

package/dist/runtime-core.cjs.js

@@ -1,5 +1,5 @@
 /**
-  * @vue/runtime-core v3.6.0-rc.10
+  * @vue/runtime-core v3.6.0-rc.12
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -309,15 +309,15 @@ function queuePostFlushCb(jobs, id = Infinity) {
 	} else for (let i = 0; i < jobs.length; i++) queueJobWorker(jobs[i], id, postJobs, postJobs.length, 0);
 	queueFlush();
 }
-function flushPreFlushCbs(instance, seen) {
+function flushPreFlushCbs(instance, minUid, seen) {
 	seen = seen || /* @__PURE__ */ new Map();
 	for (let i = flushIndex; i < jobsLength; i++) {
 		const cb = jobs[i];
 		if (cb.order & 1 || cb.order === Infinity) continue;
-		if (instance && cb.order !== instance.uid * 2) continue;
+		if (instance && cb.order !== instance.uid * 2 || minUid !== void 0 && !(cb.order >= minUid * 2)) continue;
 		if (checkRecursiveUpdates(seen, cb)) continue;
 		jobs.splice(i, 1);
-		i--;
+		i = instance ? i - 1 : flushIndex - 1;
 		jobsLength--;
 		if (cb.flags & 2) cb.flags &= -2;
 		try {
@@ -327,15 +327,24 @@ function flushPreFlushCbs(instance, seen) {
 		}
 	}
 }
-function flushPostFlushCbs(seen) {
+function flushPostFlushCbs(seen, skip, minUid = 0) {
 	if (postJobs.length) {
+		let cbs = postJobs;
+		if (skip) {
+			cbs = [];
+			let kept = 0;
+			for (let i = 0; i < postJobs.length; i++) {
+				const cb = postJobs[i];
+				if (cb.i !== void 0 ? !cb.i || cb.i.uid < minUid : skip.has(cb)) postJobs[kept++] = cb;
+				else cbs.push(cb);
+			}
+			postJobs.length = kept;
+		} else postJobs = [];
 		if (activePostJobs) {
-			for (let i = 0; i < postJobs.length; i++) activePostJobs.push(postJobs[i]);
-			postJobs.length = 0;
+			for (let i = 0; i < cbs.length; i++) activePostJobs.push(cbs[i]);
 			return;
 		}
-		activePostJobs = postJobs;
-		postJobs = [];
+		activePostJobs = cbs;
 		seen = seen || /* @__PURE__ */ new Map();
 		try {
 			while (postFlushIndex < activePostJobs.length) {
@@ -357,17 +366,28 @@ function flushPostFlushCbs(seen) {
 }
 let isFlushing = false;
 /**
+* Run a root render, then flush the jobs it is responsible for. A mount or
+* unmount (`minUid` given) only flushes the jobs of the components it created
+* and the post cbs it queued, so pre watchers triggered in setup run before
+* mounted (#5721) while the jobs of other components stay in the queue and
+* keep their order (#6728). A root update keeps flushing all pending pre jobs
+* and post cbs, as the jobs of the components it re-renders may predate it.
+*
 * @internal
 */
-function flushOnAppMount(instance) {
-	if (!isFlushing) {
-		isFlushing = true;
-		try {
-			flushPreFlushCbs(instance);
-			flushPostFlushCbs();
-		} finally {
-			isFlushing = false;
-		}
+function flushOnAppMount(fn, minUid) {
+	if (isFlushing) {
+		fn();
+		return;
+	}
+	const queued = minUid === void 0 ? void 0 : new Set(postJobs);
+	fn();
+	isFlushing = true;
+	try {
+		flushPreFlushCbs(void 0, minUid);
+		flushPostFlushCbs(void 0, queued, minUid);
+	} finally {
+		isFlushing = false;
 	}
 }
 function flushJobs(seen) {
@@ -835,7 +855,7 @@ var RenderWatcherEffect = class extends _vue_reactivity.WatcherEffect {
 			this.flags |= 128;
 			job.flags |= 2;
 		}
-		if (instance) job.i = instance;
+		job.i = instance;
 		this.job = job;
 	}
 	notify() {
@@ -1046,7 +1066,11 @@ const TeleportImpl = {
 	hydrate: hydrateTeleport
 };
 function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, parentComponent, moveType = 2) {
-	if (moveType === 0) insert(vnode.targetAnchor, container, parentAnchor);
+	if (moveType === 0) {
+		if (vnode.targetStart) insert(vnode.targetStart, container, parentAnchor);
+		insert(vnode.targetAnchor, container, parentAnchor);
+		parentAnchor = vnode.targetAnchor;
+	}
 	const { el, anchor, shapeFlag, children, props } = vnode;
 	const isReorder = moveType === 2;
 	if (isReorder) insert(el, container, parentAnchor);
@@ -1165,10 +1189,15 @@ const BaseTransitionPropsValidators = {
 	onAfterAppear: TransitionHookValidator,
 	onAppearCancelled: TransitionHookValidator
 };
-const recursiveGetSubtree = (instance) => {
-	const subTree = isVaporComponent(instance.type) ? instance.block : instance.subTree;
-	return subTree.component ? recursiveGetSubtree(subTree.component) : subTree;
-};
+function isEmptyTransitionChild(vnode, instance) {
+	if (vnode.type === Comment) return true;
+	if (vnode.type === Fragment) {
+		const child = (0, _vue_shared.isArray)(vnode.children) && filterSingleRoot(vnode.children, false);
+		return !child || isEmptyTransitionChild(child, instance);
+	}
+	if (vnode.type === VaporSlot || isVaporComponent(vnode.type)) return !getVaporInterface(instance, vnode).hasTransitionChild(vnode);
+	return !!vnode.component && isEmptyTransitionChild(vnode.component.subTree, instance);
+}
 const BaseTransitionImpl = {
 	name: `BaseTransition`,
 	props: BaseTransitionPropsValidators,
@@ -1216,7 +1245,7 @@ function getLeavingNodesForType(state, vnode) {
 function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 	const key = String(vnode.key);
 	const leavingVNodesCache = getLeavingNodesForType(state, vnode);
-	return baseResolveTransitionHooks({
+	const hooks = baseResolveTransitionHooks({
 		isLeaving: () => leavingVNodesCache[key] === vnode,
 		setLeavingNodeCache: () => {
 			leavingVNodesCache[key] = vnode;
@@ -1226,7 +1255,14 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 		},
 		earlyRemove: () => {
 			const leavingVNode = leavingVNodesCache[key];
-			if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el[leaveCbKey]) leavingVNode.el[leaveCbKey]();
+			if (leavingVNode && isSameVNodeType(vnode, leavingVNode)) {
+				let leavingCb = leavingVNode.el[leaveCbKey];
+				if (!leavingCb) {
+					const leavingRoot = getTransitionRoot(leavingVNode);
+					leavingCb = leavingRoot && leavingRoot.el[leaveCbKey];
+				}
+				if (leavingCb) leavingCb();
+			}
 		},
 		cloneHooks: (vnode) => {
 			const hooks = resolveTransitionHooks(vnode, props, state, instance, postClone);
@@ -1234,6 +1270,13 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 			return hooks;
 		}
 	}, props, state, instance);
+	if (vnode.type === VaporSlot) (0, _vue_shared.extend)(hooks, {
+		__vapor: true,
+		props,
+		state,
+		instance
+	});
+	return hooks;
 }
 function baseResolveTransitionHooks(context, props, state, instance) {
 	const { isLeaving, setLeavingNodeCache, unsetLeavingNodeCache, earlyRemove, cloneHooks } = context;
@@ -1349,7 +1392,7 @@ function prepareTransitionSwitch(previous, next, props, state, instance, resumeA
 	if (nextInner.type !== Comment) setTransitionHooks(nextInner, enterHooks);
 	const mode = props.mode;
 	const previousInner = previous && getInnerChild$1(previous);
-	if (previous && previousInner && previousInner.type !== Comment && !isSameVNodeType(previousInner, nextInner) && (!previous.component || recursiveGetSubtree(previous.component).type !== Comment)) {
+	if (previous && previousInner && !isSameVNodeType(previousInner, nextInner) && !isEmptyTransitionChild(previousInner, instance)) {
 		const leavingHooks = prepareLeavingTransitionHooks(previousInner, props, state, instance);
 		if (nextInner.type !== Comment && (mode === "out-in" || mode === "in-out") && applyTransitionModeSwitch(previousInner, leavingHooks, mode === "in-out" ? () => enterHooks : void 0, props, state, resumeAfterLeave)) return emptyPlaceholder(next);
 	}
@@ -1413,7 +1456,13 @@ function setTransitionHooks(vnode, hooks) {
 		const contentHooks = vnode.ssContent.transition = hooks.clone(vnode.ssContent);
 		const fallbackHooks = vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
 		return vnode.suspense && vnode.suspense.activeBranch === vnode.ssFallback ? fallbackHooks : contentHooks;
-	} else vnode.transition = hooks;
+	} else {
+		vnode.transition = hooks;
+		if (vnode.type === Fragment && (0, _vue_shared.isArray)(vnode.children)) {
+			const child = filterSingleRoot(vnode.children, false);
+			if (child) setTransitionHooks(child, hooks);
+		}
+	}
 	return hooks;
 }
 function getTransitionRawChildren(children, keepComment = false, parentKey) {
@@ -1436,6 +1485,14 @@ function getTransitionRawChildren(children, keepComment = false, parentKey) {
 function checkTransitionMode(mode) {
 	if (mode && mode !== "in-out" && mode !== "out-in" && mode !== "default") warn$1(`invalid <transition> mode: ${mode}`);
 }
+function getTransitionRoot(vnode) {
+	if (vnode.component && !isVaporComponent(vnode.type)) return getTransitionRoot(vnode.component.subTree);
+	if (vnode.type === Fragment) {
+		const child = (0, _vue_shared.isArray)(vnode.children) && filterSingleRoot(vnode.children, false);
+		return child ? getTransitionRoot(child) : void 0;
+	}
+	if (vnode.type !== Comment) return vnode;
+}
 //#endregion
 //#region packages/runtime-core/src/apiDefineComponent.ts
 /*@__NO_SIDE_EFFECTS__*/
@@ -2065,14 +2122,20 @@ const hydrateOnVisible = (opts) => (hydrate, forEach) => {
 			break;
 		}
 	}, opts);
-	forEach((el) => {
-		if (!(el instanceof Element)) return;
+	const observe = (el) => {
 		if (elementIsVisibleInViewport(el)) {
 			hydrate();
 			ob.disconnect();
 			return false;
 		}
+		if (getComputedStyle(el).display === "contents") {
+			for (let i = 0; i < el.children.length; i++) if (observe(el.children[i]) === false) return false;
+		}
 		ob.observe(el);
+	};
+	forEach((el) => {
+		if (!(el instanceof Element)) return;
+		return observe(el);
 	});
 	return () => ob.disconnect();
 };
@@ -2334,7 +2397,10 @@ const KeepAlive = {
 		function pruneCacheEntry(key) {
 			const cached = cache.get(key);
 			if (cached && (!current || !isSameVNodeType(cached, current))) unmount(cached);
-			else if (current) resetShapeFlag(current);
+			else if (current) {
+				resetShapeFlag(current);
+				if (cached) resetShapeFlag(cached);
+			}
 			cache.delete(key);
 			keys.delete(key);
 		}
@@ -2678,6 +2744,11 @@ function renderSlot(slots, name, props, fallback, noSlotted, branchKey) {
 				owner: currentRenderingInstance
 			}] : void 0
 		};
+		if (branchKey != null && props.key == null) {
+			ret.vs.props = ret.props;
+			ret.props = (0, _vue_shared.extend)({}, ret.props, { key: branchKey });
+			ret.key = branchKey;
+		}
 		if (!noSlotted && ret.scopeId) ret.slotScopeIds = [ret.scopeId + "-s"];
 		return ret;
 	}
@@ -3870,7 +3941,7 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
 	if (nextKeys.length !== Object.keys(prevProps).length) return true;
 	for (let i = 0; i < nextKeys.length; i++) {
 		const key = nextKeys[i];
-		if (hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
+		if (!(0, _vue_shared.hasOwn)(prevProps, key) || hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
 	}
 	return false;
 }
@@ -4561,7 +4632,8 @@ function baseCreateRenderer(options, createHydrationFns) {
 		for (let i = 0; i < newChildren.length; i++) {
 			const oldVNode = oldChildren[i];
 			const newVNode = newChildren[i];
-			const container = oldVNode.el && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldVNode.el) : fallbackContainer;
+			const oldEl = oldVNode.el || resolveAsyncComponentPlaceholder(oldVNode);
+			const container = oldEl && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldEl) : fallbackContainer;
 			patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, namespace, slotScopeIds, true);
 		}
 	};
@@ -4653,6 +4725,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 			if (instance.asyncDep && !instance.asyncResolved) {
 				pushWarningContext(n2);
 				n2.el = n1.el;
+				n2.placeholder = n1.placeholder;
 				updateComponentPreRender(instance, n2, optimized);
 				popWarningContext();
 				return;
@@ -4662,6 +4735,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 			}
 		} else {
 			n2.el = n1.el;
+			n2.placeholder = n1.placeholder;
 			instance.vnode = n2;
 		}
 	};
@@ -5006,12 +5080,9 @@ function baseCreateRenderer(options, createHydrationFns) {
 	};
 	const remove = (vnode) => {
 		const { type, el, anchor, transition } = vnode;
-		if (type === Fragment) {
-			if (vnode.patchFlag > 0 && vnode.patchFlag & 2048 && transition && !transition.persisted) vnode.children.forEach((child) => {
-				if (child.type === Comment) hostRemove(child.el);
-				else remove(child);
-			});
-			else removeFragment(el, anchor);
+		const isFragment = type === Fragment;
+		if (isFragment && !transition) {
+			removeFragment(el, anchor);
 			return;
 		}
 		if (type === Static) {
@@ -5019,8 +5090,21 @@ function baseCreateRenderer(options, createHydrationFns) {
 			if (transition && !transition.persisted && transition.afterLeave) transition.afterLeave();
 			return;
 		}
-		if (transition) performTransitionLeave(el, transition, () => hostRemove(el), !!(vnode.shapeFlag & 1));
-		else hostRemove(el);
+		const leavingNode = isFragment ? getTransitionRoot(vnode) : vnode;
+		const performRemove = () => {
+			if (isFragment) {
+				if (hostParentNode(el)) removeFragment(el, anchor);
+			} else hostRemove(el);
+		};
+		if (transition) {
+			let leavingEl = leavingNode && leavingNode.el;
+			let isElement = !!(leavingNode && leavingNode.shapeFlag & 1);
+			if (isFragment && leavingNode && isVaporComponent(leavingNode.type)) {
+				leavingEl = getVaporInterface(leavingNode.component, leavingNode).getTransitionElement(leavingNode);
+				isElement = !!leavingEl;
+			}
+			performTransitionLeave(leavingEl || el, transition, performRemove, isElement);
+		} else performRemove();
 	};
 	const removeFragment = (cur, end) => {
 		let next;
@@ -5063,15 +5147,12 @@ function baseCreateRenderer(options, createHydrationFns) {
 		return teleportEnd ? hostNextSibling(teleportEnd) : el;
 	};
 	const render = (vnode, container, namespace) => {
-		let instance;
-		if (vnode == null) {
-			if (container._vnode) {
-				unmount(container._vnode, null, null, true);
-				instance = container._vnode.component;
-			}
-		} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
-		container._vnode = vnode;
-		flushOnAppMount(instance);
+		flushOnAppMount(() => {
+			if (vnode == null) {
+				if (container._vnode) unmount(container._vnode, null, null, true);
+			} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
+			container._vnode = vnode;
+		}, vnode && container._vnode ? void 0 : vnode && vnode.component ? vnode.component.uid : getNextUid());
 	};
 	const internals = {
 		p: patch,
@@ -5464,13 +5545,12 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
 		registerDep(instance, onResolve) {
 			const isInPendingSuspense = !!suspense.pendingBranch;
 			if (isInPendingSuspense) suspense.deps++;
-			const hydratedEl = instance.vnode && instance.vnode.el;
 			instance.asyncDep.catch((err) => {
 				handleError(err, instance, 0);
 			}).then((asyncSetupResult) => {
 				if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) return;
 				setCurrentInstance(null, void 0);
-				if (hydratedEl && !instance.scope.active) {
+				if (!instance.scope.active) {
 					if (isInPendingSuspense && --suspense.deps === 0) suspense.resolve();
 					return;
 				}
@@ -5783,7 +5863,7 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 		ctx: vnode.ctx,
 		ce: vnode.ce,
 		vi: vnode.vi,
-		vs: cloneVaporSlotMeta(vnode),
+		vs: cloneVaporSlotMeta(vnode, extraProps),
 		vb: vnode.vb,
 		ibu: vnode.ibu,
 		iu: vnode.iu,
@@ -5792,13 +5872,22 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 	if (transition && cloneTransition) setTransitionHooks(cloned, transition.clone(cloned));
 	return cloned;
 }
-function cloneVaporSlotMeta(vnode) {
+function cloneVaporSlotMeta(vnode, extraProps) {
 	const vaporSlot = vnode.vs;
 	if (!vaporSlot) return vaporSlot;
 	const cloned = {
 		slot: vaporSlot.slot,
-		outlets: vaporSlot.outlets
+		outlets: vaporSlot.outlets,
+		props: vaporSlot.props
 	};
+	if (vaporSlot.props && extraProps) {
+		let extraSlotProps;
+		for (const key in extraProps) if (key !== "key") {
+			if (!extraSlotProps) extraSlotProps = {};
+			extraSlotProps[key] = extraProps[key];
+		}
+		if (extraSlotProps) cloned.props = mergeProps(vaporSlot.props, extraSlotProps);
+	}
 	if (vnode.el) {
 		cloned.state = vaporSlot.state;
 		cloned.ref = vaporSlot.ref;
@@ -5990,6 +6079,9 @@ const useInstanceOption = (key, silent = false) => {
 //#region packages/runtime-core/src/component.ts
 const emptyAppContext = /*@__PURE__*/ createAppContext();
 let uid = 0;
+function getNextUid() {
+	return uid;
+}
 function createComponentInstance(vnode, parent, suspense) {
 	const type = vnode.type;
 	const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
@@ -6496,7 +6588,7 @@ function isMemoSame(cached, memo) {
 }
 //#endregion
 //#region packages/runtime-core/src/index.ts
-const version = "3.6.0-rc.10";
+const version = "3.6.0-rc.12";
 const warn = warn$1;
 /**
 * Runtime error messages. Only exposed in dev or esm builds.

package/dist/runtime-core.cjs.prod.js

@@ -1,5 +1,5 @@
 /**
-  * @vue/runtime-core v3.6.0-rc.10
+  * @vue/runtime-core v3.6.0-rc.12
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -205,13 +205,13 @@ function queuePostFlushCb(jobs, id = Infinity) {
 	} else for (let i = 0; i < jobs.length; i++) queueJobWorker(jobs[i], id, postJobs, postJobs.length, 0);
 	queueFlush();
 }
-function flushPreFlushCbs(instance, seen) {
+function flushPreFlushCbs(instance, minUid, seen) {
 	for (let i = flushIndex; i < jobsLength; i++) {
 		const cb = jobs[i];
 		if (cb.order & 1 || cb.order === Infinity) continue;
-		if (instance && cb.order !== instance.uid * 2) continue;
+		if (instance && cb.order !== instance.uid * 2 || minUid !== void 0 && !(cb.order >= minUid * 2)) continue;
 		jobs.splice(i, 1);
-		i--;
+		i = instance ? i - 1 : flushIndex - 1;
 		jobsLength--;
 		if (cb.flags & 2) cb.flags &= -2;
 		try {
@@ -221,15 +221,24 @@ function flushPreFlushCbs(instance, seen) {
 		}
 	}
 }
-function flushPostFlushCbs(seen) {
+function flushPostFlushCbs(seen, skip, minUid = 0) {
 	if (postJobs.length) {
+		let cbs = postJobs;
+		if (skip) {
+			cbs = [];
+			let kept = 0;
+			for (let i = 0; i < postJobs.length; i++) {
+				const cb = postJobs[i];
+				if (cb.i !== void 0 ? !cb.i || cb.i.uid < minUid : skip.has(cb)) postJobs[kept++] = cb;
+				else cbs.push(cb);
+			}
+			postJobs.length = kept;
+		} else postJobs = [];
 		if (activePostJobs) {
-			for (let i = 0; i < postJobs.length; i++) activePostJobs.push(postJobs[i]);
-			postJobs.length = 0;
+			for (let i = 0; i < cbs.length; i++) activePostJobs.push(cbs[i]);
 			return;
 		}
-		activePostJobs = postJobs;
-		postJobs = [];
+		activePostJobs = cbs;
 		try {
 			while (postFlushIndex < activePostJobs.length) {
 				const cb = activePostJobs[postFlushIndex++];
@@ -249,17 +258,28 @@ function flushPostFlushCbs(seen) {
 }
 let isFlushing = false;
 /**
+* Run a root render, then flush the jobs it is responsible for. A mount or
+* unmount (`minUid` given) only flushes the jobs of the components it created
+* and the post cbs it queued, so pre watchers triggered in setup run before
+* mounted (#5721) while the jobs of other components stay in the queue and
+* keep their order (#6728). A root update keeps flushing all pending pre jobs
+* and post cbs, as the jobs of the components it re-renders may predate it.
+*
 * @internal
 */
-function flushOnAppMount(instance) {
-	if (!isFlushing) {
-		isFlushing = true;
-		try {
-			flushPreFlushCbs(instance);
-			flushPostFlushCbs();
-		} finally {
-			isFlushing = false;
-		}
+function flushOnAppMount(fn, minUid) {
+	if (isFlushing) {
+		fn();
+		return;
+	}
+	const queued = minUid === void 0 ? void 0 : new Set(postJobs);
+	fn();
+	isFlushing = true;
+	try {
+		flushPreFlushCbs(void 0, minUid);
+		flushPostFlushCbs(void 0, queued, minUid);
+	} finally {
+		isFlushing = false;
 	}
 }
 function flushJobs(seen) {
@@ -470,7 +490,7 @@ var RenderWatcherEffect = class extends _vue_reactivity.WatcherEffect {
 			this.flags |= 128;
 			job.flags |= 2;
 		}
-		if (instance) job.i = instance;
+		job.i = instance;
 		this.job = job;
 	}
 	notify() {
@@ -662,7 +682,11 @@ const TeleportImpl = {
 	hydrate: hydrateTeleport
 };
 function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, parentComponent, moveType = 2) {
-	if (moveType === 0) insert(vnode.targetAnchor, container, parentAnchor);
+	if (moveType === 0) {
+		if (vnode.targetStart) insert(vnode.targetStart, container, parentAnchor);
+		insert(vnode.targetAnchor, container, parentAnchor);
+		parentAnchor = vnode.targetAnchor;
+	}
 	const { el, anchor, shapeFlag, children, props } = vnode;
 	const isReorder = moveType === 2;
 	if (isReorder) insert(el, container, parentAnchor);
@@ -781,10 +805,15 @@ const BaseTransitionPropsValidators = {
 	onAfterAppear: TransitionHookValidator,
 	onAppearCancelled: TransitionHookValidator
 };
-const recursiveGetSubtree = (instance) => {
-	const subTree = isVaporComponent(instance.type) ? instance.block : instance.subTree;
-	return subTree.component ? recursiveGetSubtree(subTree.component) : subTree;
-};
+function isEmptyTransitionChild(vnode, instance) {
+	if (vnode.type === Comment) return true;
+	if (vnode.type === Fragment) {
+		const child = (0, _vue_shared.isArray)(vnode.children) && filterSingleRoot(vnode.children, false);
+		return !child || isEmptyTransitionChild(child, instance);
+	}
+	if (vnode.type === VaporSlot || isVaporComponent(vnode.type)) return !getVaporInterface(instance, vnode).hasTransitionChild(vnode);
+	return !!vnode.component && isEmptyTransitionChild(vnode.component.subTree, instance);
+}
 const BaseTransitionImpl = {
 	name: `BaseTransition`,
 	props: BaseTransitionPropsValidators,
@@ -826,7 +855,7 @@ function getLeavingNodesForType(state, vnode) {
 function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 	const key = String(vnode.key);
 	const leavingVNodesCache = getLeavingNodesForType(state, vnode);
-	return baseResolveTransitionHooks({
+	const hooks = baseResolveTransitionHooks({
 		isLeaving: () => leavingVNodesCache[key] === vnode,
 		setLeavingNodeCache: () => {
 			leavingVNodesCache[key] = vnode;
@@ -836,7 +865,14 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 		},
 		earlyRemove: () => {
 			const leavingVNode = leavingVNodesCache[key];
-			if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el[leaveCbKey]) leavingVNode.el[leaveCbKey]();
+			if (leavingVNode && isSameVNodeType(vnode, leavingVNode)) {
+				let leavingCb = leavingVNode.el[leaveCbKey];
+				if (!leavingCb) {
+					const leavingRoot = getTransitionRoot(leavingVNode);
+					leavingCb = leavingRoot && leavingRoot.el[leaveCbKey];
+				}
+				if (leavingCb) leavingCb();
+			}
 		},
 		cloneHooks: (vnode) => {
 			const hooks = resolveTransitionHooks(vnode, props, state, instance, postClone);
@@ -844,6 +880,13 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 			return hooks;
 		}
 	}, props, state, instance);
+	if (vnode.type === VaporSlot) (0, _vue_shared.extend)(hooks, {
+		__vapor: true,
+		props,
+		state,
+		instance
+	});
+	return hooks;
 }
 function baseResolveTransitionHooks(context, props, state, instance) {
 	const { isLeaving, setLeavingNodeCache, unsetLeavingNodeCache, earlyRemove, cloneHooks } = context;
@@ -959,7 +1002,7 @@ function prepareTransitionSwitch(previous, next, props, state, instance, resumeA
 	if (nextInner.type !== Comment) setTransitionHooks(nextInner, enterHooks);
 	const mode = props.mode;
 	const previousInner = previous && getInnerChild$1(previous);
-	if (previous && previousInner && previousInner.type !== Comment && !isSameVNodeType(previousInner, nextInner) && (!previous.component || recursiveGetSubtree(previous.component).type !== Comment)) {
+	if (previous && previousInner && !isSameVNodeType(previousInner, nextInner) && !isEmptyTransitionChild(previousInner, instance)) {
 		const leavingHooks = prepareLeavingTransitionHooks(previousInner, props, state, instance);
 		if (nextInner.type !== Comment && (mode === "out-in" || mode === "in-out") && applyTransitionModeSwitch(previousInner, leavingHooks, mode === "in-out" ? () => enterHooks : void 0, props, state, resumeAfterLeave)) return emptyPlaceholder(next);
 	}
@@ -1023,7 +1066,13 @@ function setTransitionHooks(vnode, hooks) {
 		const contentHooks = vnode.ssContent.transition = hooks.clone(vnode.ssContent);
 		const fallbackHooks = vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
 		return vnode.suspense && vnode.suspense.activeBranch === vnode.ssFallback ? fallbackHooks : contentHooks;
-	} else vnode.transition = hooks;
+	} else {
+		vnode.transition = hooks;
+		if (vnode.type === Fragment && (0, _vue_shared.isArray)(vnode.children)) {
+			const child = filterSingleRoot(vnode.children, false);
+			if (child) setTransitionHooks(child, hooks);
+		}
+	}
 	return hooks;
 }
 function getTransitionRawChildren(children, keepComment = false, parentKey) {
@@ -1040,6 +1089,14 @@ function getTransitionRawChildren(children, keepComment = false, parentKey) {
 	if (keyedFragmentCount > 1) for (let i = 0; i < ret.length; i++) ret[i].patchFlag = -2;
 	return ret;
 }
+function getTransitionRoot(vnode) {
+	if (vnode.component && !isVaporComponent(vnode.type)) return getTransitionRoot(vnode.component.subTree);
+	if (vnode.type === Fragment) {
+		const child = (0, _vue_shared.isArray)(vnode.children) && filterSingleRoot(vnode.children, false);
+		return child ? getTransitionRoot(child) : void 0;
+	}
+	if (vnode.type !== Comment) return vnode;
+}
 //#endregion
 //#region packages/runtime-core/src/apiDefineComponent.ts
 /*@__NO_SIDE_EFFECTS__*/
@@ -1528,14 +1585,20 @@ const hydrateOnVisible = (opts) => (hydrate, forEach) => {
 			break;
 		}
 	}, opts);
-	forEach((el) => {
-		if (!(el instanceof Element)) return;
+	const observe = (el) => {
 		if (elementIsVisibleInViewport(el)) {
 			hydrate();
 			ob.disconnect();
 			return false;
 		}
+		if (getComputedStyle(el).display === "contents") {
+			for (let i = 0; i < el.children.length; i++) if (observe(el.children[i]) === false) return false;
+		}
 		ob.observe(el);
+	};
+	forEach((el) => {
+		if (!(el instanceof Element)) return;
+		return observe(el);
 	});
 	return () => ob.disconnect();
 };
@@ -1788,7 +1851,10 @@ const KeepAlive = {
 		function pruneCacheEntry(key) {
 			const cached = cache.get(key);
 			if (cached && (!current || !isSameVNodeType(cached, current))) unmount(cached);
-			else if (current) resetShapeFlag(current);
+			else if (current) {
+				resetShapeFlag(current);
+				if (cached) resetShapeFlag(cached);
+			}
 			cache.delete(key);
 			keys.delete(key);
 		}
@@ -2043,8 +2109,11 @@ function renderList(source, renderItem, cache, index) {
 		ret = new Array(source.length);
 		for (let i = 0, l = source.length; i < l; i++) ret[i] = renderItem(needsWrap ? isReadonlySource ? (0, _vue_reactivity.toReadonly)((0, _vue_reactivity.toReactive)(source[i])) : (0, _vue_reactivity.toReactive)(source[i]) : source[i], i, void 0, cached && cached[i]);
 	} else if (typeof source === "number") {
-		ret = new Array(source);
-		for (let i = 0; i < source; i++) ret[i] = renderItem(i + 1, i, void 0, cached && cached[i]);
+		if (!Number.isInteger(source) || source < 0) ret = [];
+		else {
+			ret = new Array(source);
+			for (let i = 0; i < source; i++) ret[i] = renderItem(i + 1, i, void 0, cached && cached[i]);
+		}
 	} else if ((0, _vue_shared.isObject)(source)) {
 		if (source[Symbol.iterator]) ret = Array.from(source, (item, i) => renderItem(item, i, void 0, cached && cached[i]));
 		else {
@@ -2120,6 +2189,11 @@ function renderSlot(slots, name, props, fallback, noSlotted, branchKey) {
 				owner: currentRenderingInstance
 			}] : void 0
 		};
+		if (branchKey != null && props.key == null) {
+			ret.vs.props = ret.props;
+			ret.props = (0, _vue_shared.extend)({}, ret.props, { key: branchKey });
+			ret.key = branchKey;
+		}
 		if (!noSlotted && ret.scopeId) ret.slotScopeIds = [ret.scopeId + "-s"];
 		return ret;
 	}
@@ -3031,7 +3105,7 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
 	if (nextKeys.length !== Object.keys(prevProps).length) return true;
 	for (let i = 0; i < nextKeys.length; i++) {
 		const key = nextKeys[i];
-		if (hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
+		if (!(0, _vue_shared.hasOwn)(prevProps, key) || hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
 	}
 	return false;
 }
@@ -3530,7 +3604,8 @@ function baseCreateRenderer(options, createHydrationFns) {
 		for (let i = 0; i < newChildren.length; i++) {
 			const oldVNode = oldChildren[i];
 			const newVNode = newChildren[i];
-			const container = oldVNode.el && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldVNode.el) : fallbackContainer;
+			const oldEl = oldVNode.el || resolveAsyncComponentPlaceholder(oldVNode);
+			const container = oldEl && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldEl) : fallbackContainer;
 			patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, namespace, slotScopeIds, true);
 		}
 	};
@@ -3606,6 +3681,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 		if (shouldUpdateComponent(n1, n2, optimized)) {
 			if (instance.asyncDep && !instance.asyncResolved) {
 				n2.el = n1.el;
+				n2.placeholder = n1.placeholder;
 				updateComponentPreRender(instance, n2, optimized);
 				return;
 			} else {
@@ -3614,6 +3690,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 			}
 		} else {
 			n2.el = n1.el;
+			n2.placeholder = n1.placeholder;
 			instance.vnode = n2;
 		}
 	};
@@ -3937,7 +4014,8 @@ function baseCreateRenderer(options, createHydrationFns) {
 	};
 	const remove = (vnode) => {
 		const { type, el, anchor, transition } = vnode;
-		if (type === Fragment) {
+		const isFragment = type === Fragment;
+		if (isFragment && !transition) {
 			removeFragment(el, anchor);
 			return;
 		}
@@ -3946,8 +4024,21 @@ function baseCreateRenderer(options, createHydrationFns) {
 			if (transition && !transition.persisted && transition.afterLeave) transition.afterLeave();
 			return;
 		}
-		if (transition) performTransitionLeave(el, transition, () => hostRemove(el), !!(vnode.shapeFlag & 1));
-		else hostRemove(el);
+		const leavingNode = isFragment ? getTransitionRoot(vnode) : vnode;
+		const performRemove = () => {
+			if (isFragment) {
+				if (hostParentNode(el)) removeFragment(el, anchor);
+			} else hostRemove(el);
+		};
+		if (transition) {
+			let leavingEl = leavingNode && leavingNode.el;
+			let isElement = !!(leavingNode && leavingNode.shapeFlag & 1);
+			if (isFragment && leavingNode && isVaporComponent(leavingNode.type)) {
+				leavingEl = getVaporInterface(leavingNode.component, leavingNode).getTransitionElement(leavingNode);
+				isElement = !!leavingEl;
+			}
+			performTransitionLeave(leavingEl || el, transition, performRemove, isElement);
+		} else performRemove();
 	};
 	const removeFragment = (cur, end) => {
 		let next;
@@ -3988,15 +4079,12 @@ function baseCreateRenderer(options, createHydrationFns) {
 		return teleportEnd ? hostNextSibling(teleportEnd) : el;
 	};
 	const render = (vnode, container, namespace) => {
-		let instance;
-		if (vnode == null) {
-			if (container._vnode) {
-				unmount(container._vnode, null, null, true);
-				instance = container._vnode.component;
-			}
-		} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
-		container._vnode = vnode;
-		flushOnAppMount(instance);
+		flushOnAppMount(() => {
+			if (vnode == null) {
+				if (container._vnode) unmount(container._vnode, null, null, true);
+			} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
+			container._vnode = vnode;
+		}, vnode && container._vnode ? void 0 : vnode && vnode.component ? vnode.component.uid : getNextUid());
 	};
 	const internals = {
 		p: patch,
@@ -4370,13 +4458,12 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
 		registerDep(instance, onResolve) {
 			const isInPendingSuspense = !!suspense.pendingBranch;
 			if (isInPendingSuspense) suspense.deps++;
-			const hydratedEl = instance.vnode && instance.vnode.el;
 			instance.asyncDep.catch((err) => {
 				handleError(err, instance, 0);
 			}).then((asyncSetupResult) => {
 				if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) return;
 				setCurrentInstance(null, void 0);
-				if (hydratedEl && !instance.scope.active) {
+				if (!instance.scope.active) {
 					if (isInPendingSuspense && --suspense.deps === 0) suspense.resolve();
 					return;
 				}
@@ -4648,7 +4735,7 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 		ctx: vnode.ctx,
 		ce: vnode.ce,
 		vi: vnode.vi,
-		vs: cloneVaporSlotMeta(vnode),
+		vs: cloneVaporSlotMeta(vnode, extraProps),
 		vb: vnode.vb,
 		ibu: vnode.ibu,
 		iu: vnode.iu,
@@ -4657,13 +4744,22 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 	if (transition && cloneTransition) setTransitionHooks(cloned, transition.clone(cloned));
 	return cloned;
 }
-function cloneVaporSlotMeta(vnode) {
+function cloneVaporSlotMeta(vnode, extraProps) {
 	const vaporSlot = vnode.vs;
 	if (!vaporSlot) return vaporSlot;
 	const cloned = {
 		slot: vaporSlot.slot,
-		outlets: vaporSlot.outlets
+		outlets: vaporSlot.outlets,
+		props: vaporSlot.props
 	};
+	if (vaporSlot.props && extraProps) {
+		let extraSlotProps;
+		for (const key in extraProps) if (key !== "key") {
+			if (!extraSlotProps) extraSlotProps = {};
+			extraSlotProps[key] = extraProps[key];
+		}
+		if (extraSlotProps) cloned.props = mergeProps(vaporSlot.props, extraSlotProps);
+	}
 	if (vnode.el) {
 		cloned.state = vaporSlot.state;
 		cloned.ref = vaporSlot.ref;
@@ -4840,6 +4936,9 @@ const useInstanceOption = (key, silent = false) => {
 //#region packages/runtime-core/src/component.ts
 const emptyAppContext = /*@__PURE__*/ createAppContext();
 let uid = 0;
+function getNextUid() {
+	return uid;
+}
 function createComponentInstance(vnode, parent, suspense) {
 	const type = vnode.type;
 	const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
@@ -5097,7 +5196,7 @@ function isMemoSame(cached, memo) {
 }
 //#endregion
 //#region packages/runtime-core/src/index.ts
-const version = "3.6.0-rc.10";
+const version = "3.6.0-rc.12";
 const warn = _vue_shared.NOOP;
 /**
 * Runtime error messages. Only exposed in dev or esm builds.

package/dist/runtime-core.d.ts

@@ -56,8 +56,9 @@ export interface SchedulerJob extends Function {
   /**
    * Attached by renderer.ts when setting up a component's render effect
    * Used to obtain component information when reporting max recursive updates.
+   * Also set on watcher jobs: null marks a watcher without an owner component.
    */
-  i?: GenericComponentInstance;
+  i?: GenericComponentInstance | null;
 }
 type SchedulerJobs = SchedulerJob | SchedulerJob[];
 export declare function nextTick(): Promise<void>;

package/dist/runtime-core.esm-bundler.js

@@ -1,5 +1,5 @@
 /**
-  * @vue/runtime-core v3.6.0-rc.10
+  * @vue/runtime-core v3.6.0-rc.12
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -317,15 +317,15 @@ function queuePostFlushCb(jobs, id = Infinity) {
 	} else for (let i = 0; i < jobs.length; i++) queueJobWorker(jobs[i], id, postJobs, postJobs.length, 0);
 	queueFlush();
 }
-function flushPreFlushCbs(instance, seen) {
+function flushPreFlushCbs(instance, minUid, seen) {
 	if (!!(process.env.NODE_ENV !== "production")) seen = seen || /* @__PURE__ */ new Map();
 	for (let i = flushIndex; i < jobsLength; i++) {
 		const cb = jobs[i];
 		if (cb.order & 1 || cb.order === Infinity) continue;
-		if (instance && cb.order !== instance.uid * 2) continue;
+		if (instance && cb.order !== instance.uid * 2 || minUid !== void 0 && !(cb.order >= minUid * 2)) continue;
 		if (!!(process.env.NODE_ENV !== "production") && checkRecursiveUpdates(seen, cb)) continue;
 		jobs.splice(i, 1);
-		i--;
+		i = instance ? i - 1 : flushIndex - 1;
 		jobsLength--;
 		if (cb.flags & 2) cb.flags &= -2;
 		try {
@@ -335,15 +335,24 @@ function flushPreFlushCbs(instance, seen) {
 		}
 	}
 }
-function flushPostFlushCbs(seen) {
+function flushPostFlushCbs(seen, skip, minUid = 0) {
 	if (postJobs.length) {
+		let cbs = postJobs;
+		if (skip) {
+			cbs = [];
+			let kept = 0;
+			for (let i = 0; i < postJobs.length; i++) {
+				const cb = postJobs[i];
+				if (cb.i !== void 0 ? !cb.i || cb.i.uid < minUid : skip.has(cb)) postJobs[kept++] = cb;
+				else cbs.push(cb);
+			}
+			postJobs.length = kept;
+		} else postJobs = [];
 		if (activePostJobs) {
-			for (let i = 0; i < postJobs.length; i++) activePostJobs.push(postJobs[i]);
-			postJobs.length = 0;
+			for (let i = 0; i < cbs.length; i++) activePostJobs.push(cbs[i]);
 			return;
 		}
-		activePostJobs = postJobs;
-		postJobs = [];
+		activePostJobs = cbs;
 		if (!!(process.env.NODE_ENV !== "production")) seen = seen || /* @__PURE__ */ new Map();
 		try {
 			while (postFlushIndex < activePostJobs.length) {
@@ -365,17 +374,28 @@ function flushPostFlushCbs(seen) {
 }
 let isFlushing = false;
 /**
+* Run a root render, then flush the jobs it is responsible for. A mount or
+* unmount (`minUid` given) only flushes the jobs of the components it created
+* and the post cbs it queued, so pre watchers triggered in setup run before
+* mounted (#5721) while the jobs of other components stay in the queue and
+* keep their order (#6728). A root update keeps flushing all pending pre jobs
+* and post cbs, as the jobs of the components it re-renders may predate it.
+*
 * @internal
 */
-function flushOnAppMount(instance) {
-	if (!isFlushing) {
-		isFlushing = true;
-		try {
-			flushPreFlushCbs(instance);
-			flushPostFlushCbs();
-		} finally {
-			isFlushing = false;
-		}
+function flushOnAppMount(fn, minUid) {
+	if (isFlushing) {
+		fn();
+		return;
+	}
+	const queued = minUid === void 0 ? void 0 : new Set(postJobs);
+	fn();
+	isFlushing = true;
+	try {
+		flushPreFlushCbs(void 0, minUid);
+		flushPostFlushCbs(void 0, queued, minUid);
+	} finally {
+		isFlushing = false;
 	}
 }
 function flushJobs(seen) {
@@ -845,7 +865,7 @@ var RenderWatcherEffect = class extends WatcherEffect {
 			this.flags |= 128;
 			job.flags |= 2;
 		}
-		if (instance) job.i = instance;
+		job.i = instance;
 		this.job = job;
 	}
 	notify() {
@@ -1056,7 +1076,11 @@ const TeleportImpl = {
 	hydrate: hydrateTeleport
 };
 function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, parentComponent, moveType = 2) {
-	if (moveType === 0) insert(vnode.targetAnchor, container, parentAnchor);
+	if (moveType === 0) {
+		if (vnode.targetStart) insert(vnode.targetStart, container, parentAnchor);
+		insert(vnode.targetAnchor, container, parentAnchor);
+		parentAnchor = vnode.targetAnchor;
+	}
 	const { el, anchor, shapeFlag, children, props } = vnode;
 	const isReorder = moveType === 2;
 	if (isReorder) insert(el, container, parentAnchor);
@@ -1175,10 +1199,15 @@ const BaseTransitionPropsValidators = {
 	onAfterAppear: TransitionHookValidator,
 	onAppearCancelled: TransitionHookValidator
 };
-const recursiveGetSubtree = (instance) => {
-	const subTree = isVaporComponent(instance.type) ? instance.block : instance.subTree;
-	return subTree.component ? recursiveGetSubtree(subTree.component) : subTree;
-};
+function isEmptyTransitionChild(vnode, instance) {
+	if (vnode.type === Comment) return true;
+	if (vnode.type === Fragment) {
+		const child = isArray(vnode.children) && filterSingleRoot(vnode.children, false);
+		return !child || isEmptyTransitionChild(child, instance);
+	}
+	if (vnode.type === VaporSlot || isVaporComponent(vnode.type)) return !getVaporInterface(instance, vnode).hasTransitionChild(vnode);
+	return !!vnode.component && isEmptyTransitionChild(vnode.component.subTree, instance);
+}
 const BaseTransitionImpl = {
 	name: `BaseTransition`,
 	props: BaseTransitionPropsValidators,
@@ -1227,7 +1256,7 @@ function getLeavingNodesForType(state, vnode) {
 function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 	const key = String(vnode.key);
 	const leavingVNodesCache = getLeavingNodesForType(state, vnode);
-	return baseResolveTransitionHooks({
+	const hooks = baseResolveTransitionHooks({
 		isLeaving: () => leavingVNodesCache[key] === vnode,
 		setLeavingNodeCache: () => {
 			leavingVNodesCache[key] = vnode;
@@ -1237,7 +1266,14 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 		},
 		earlyRemove: () => {
 			const leavingVNode = leavingVNodesCache[key];
-			if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el[leaveCbKey]) leavingVNode.el[leaveCbKey]();
+			if (leavingVNode && isSameVNodeType(vnode, leavingVNode)) {
+				let leavingCb = leavingVNode.el[leaveCbKey];
+				if (!leavingCb) {
+					const leavingRoot = getTransitionRoot(leavingVNode);
+					leavingCb = leavingRoot && leavingRoot.el[leaveCbKey];
+				}
+				if (leavingCb) leavingCb();
+			}
 		},
 		cloneHooks: (vnode) => {
 			const hooks = resolveTransitionHooks(vnode, props, state, instance, postClone);
@@ -1245,6 +1281,13 @@ function resolveTransitionHooks(vnode, props, state, instance, postClone) {
 			return hooks;
 		}
 	}, props, state, instance);
+	if (vnode.type === VaporSlot) extend(hooks, {
+		__vapor: true,
+		props,
+		state,
+		instance
+	});
+	return hooks;
 }
 function baseResolveTransitionHooks(context, props, state, instance) {
 	const { isLeaving, setLeavingNodeCache, unsetLeavingNodeCache, earlyRemove, cloneHooks } = context;
@@ -1360,7 +1403,7 @@ function prepareTransitionSwitch(previous, next, props, state, instance, resumeA
 	if (nextInner.type !== Comment) setTransitionHooks(nextInner, enterHooks);
 	const mode = props.mode;
 	const previousInner = previous && getInnerChild$1(previous);
-	if (previous && previousInner && previousInner.type !== Comment && !isSameVNodeType(previousInner, nextInner) && (!previous.component || recursiveGetSubtree(previous.component).type !== Comment)) {
+	if (previous && previousInner && !isSameVNodeType(previousInner, nextInner) && !isEmptyTransitionChild(previousInner, instance)) {
 		const leavingHooks = prepareLeavingTransitionHooks(previousInner, props, state, instance);
 		if (nextInner.type !== Comment && (mode === "out-in" || mode === "in-out") && applyTransitionModeSwitch(previousInner, leavingHooks, mode === "in-out" ? () => enterHooks : void 0, props, state, resumeAfterLeave)) return emptyPlaceholder(next);
 	}
@@ -1376,14 +1419,21 @@ function forwardDelayedLeave(hooks, source) {
 }
 /**
 * Prepares an outgoing VNode when the incoming branch belongs to another
-* renderer. Returns true when out-in must defer the incoming branch.
+* renderer. Returns true under out-in, where that branch is a comment
+* child's: no mode holds for it, the leave runs on its own and
+* `resumeAfterLeave` follows it.
 *
 * @internal
 */
 function prepareTransitionLeave(previous, enterHooks, props, state, instance, resumeAfterLeave) {
 	const previousInner = getInnerChild$1(previous);
-	if (!previousInner || previousInner.type === Comment || previous.component && recursiveGetSubtree(previous.component).type === Comment) return false;
-	return applyTransitionModeSwitch(previousInner, prepareLeavingTransitionHooks(previousInner, props, state, instance), enterHooks ? () => enterHooks : void 0, props, state, resumeAfterLeave);
+	if (!previousInner || isEmptyTransitionChild(previousInner, instance)) return false;
+	const leavingHooks = prepareLeavingTransitionHooks(previousInner, props, state, instance);
+	if (props.mode === "out-in") {
+		leavingHooks.afterLeave = resumeAfterLeave;
+		return true;
+	}
+	return applyTransitionModeSwitch(previousInner, leavingHooks, enterHooks ? () => enterHooks : void 0, props, state, resumeAfterLeave);
 }
 function prepareLeavingTransitionHooks(previousInner, props, state, instance) {
 	return setTransitionHooks(previousInner, resolveTransitionHooks(previousInner, props, state, instance));
@@ -1435,7 +1485,13 @@ function setTransitionHooks(vnode, hooks) {
 		const contentHooks = vnode.ssContent.transition = hooks.clone(vnode.ssContent);
 		const fallbackHooks = vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
 		return vnode.suspense && vnode.suspense.activeBranch === vnode.ssFallback ? fallbackHooks : contentHooks;
-	} else vnode.transition = hooks;
+	} else {
+		vnode.transition = hooks;
+		if (vnode.type === Fragment && isArray(vnode.children)) {
+			const child = filterSingleRoot(vnode.children, false);
+			if (child) setTransitionHooks(child, hooks);
+		}
+	}
 	return hooks;
 }
 function getTransitionRawChildren(children, keepComment = false, parentKey) {
@@ -1458,6 +1514,14 @@ function getTransitionRawChildren(children, keepComment = false, parentKey) {
 function checkTransitionMode(mode) {
 	if (!!(process.env.NODE_ENV !== "production") && mode && mode !== "in-out" && mode !== "out-in" && mode !== "default") warn$1(`invalid <transition> mode: ${mode}`);
 }
+function getTransitionRoot(vnode) {
+	if (vnode.component && !isVaporComponent(vnode.type)) return getTransitionRoot(vnode.component.subTree);
+	if (vnode.type === Fragment) {
+		const child = isArray(vnode.children) && filterSingleRoot(vnode.children, false);
+		return child ? getTransitionRoot(child) : void 0;
+	}
+	if (vnode.type !== Comment) return vnode;
+}
 //#endregion
 //#region packages/runtime-core/src/apiDefineComponent.ts
 /*@__NO_SIDE_EFFECTS__*/
@@ -2116,14 +2180,20 @@ const hydrateOnVisible = (opts) => (hydrate, forEach) => {
 			break;
 		}
 	}, opts);
-	forEach((el) => {
-		if (!(el instanceof Element)) return;
+	const observe = (el) => {
 		if (elementIsVisibleInViewport(el)) {
 			hydrate();
 			ob.disconnect();
 			return false;
 		}
+		if (getComputedStyle(el).display === "contents") {
+			for (let i = 0; i < el.children.length; i++) if (observe(el.children[i]) === false) return false;
+		}
 		ob.observe(el);
+	};
+	forEach((el) => {
+		if (!(el instanceof Element)) return;
+		return observe(el);
 	});
 	return () => ob.disconnect();
 };
@@ -2385,7 +2455,10 @@ const KeepAlive = {
 		function pruneCacheEntry(key) {
 			const cached = cache.get(key);
 			if (cached && (!current || !isSameVNodeType(cached, current))) unmount(cached);
-			else if (current) resetShapeFlag(current);
+			else if (current) {
+				resetShapeFlag(current);
+				if (cached) resetShapeFlag(cached);
+			}
 			cache.delete(key);
 			keys.delete(key);
 		}
@@ -2647,8 +2720,8 @@ function renderList(source, renderItem, cache, index) {
 		ret = new Array(source.length);
 		for (let i = 0, l = source.length; i < l; i++) ret[i] = renderItem(needsWrap ? isReadonlySource ? toReadonly(toReactive(source[i])) : toReactive(source[i]) : source[i], i, void 0, cached && cached[i]);
 	} else if (typeof source === "number") {
-		if (!!(process.env.NODE_ENV !== "production") && (!Number.isInteger(source) || source < 0)) {
-			warn$1(`The v-for range expects a positive integer value but got ${source}.`);
+		if (!Number.isInteger(source) || source < 0) {
+			if (!!(process.env.NODE_ENV !== "production")) warn$1(`The v-for range expects a positive integer value but got ${source}.`);
 			ret = [];
 		} else {
 			ret = new Array(source);
@@ -2729,6 +2802,11 @@ function renderSlot(slots, name, props, fallback, noSlotted, branchKey) {
 				owner: currentRenderingInstance
 			}] : void 0
 		};
+		if (branchKey != null && props.key == null) {
+			ret.vs.props = ret.props;
+			ret.props = extend({}, ret.props, { key: branchKey });
+			ret.key = branchKey;
+		}
 		if (!noSlotted && ret.scopeId) ret.slotScopeIds = [ret.scopeId + "-s"];
 		return ret;
 	}
@@ -3932,7 +4010,7 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
 	if (nextKeys.length !== Object.keys(prevProps).length) return true;
 	for (let i = 0; i < nextKeys.length; i++) {
 		const key = nextKeys[i];
-		if (hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
+		if (!hasOwn(prevProps, key) || hasPropValueChanged(nextProps, prevProps, key) && !isEmitListener(emitsOptions, key)) return true;
 	}
 	return false;
 }
@@ -4655,7 +4733,8 @@ function baseCreateRenderer(options, createHydrationFns) {
 		for (let i = 0; i < newChildren.length; i++) {
 			const oldVNode = oldChildren[i];
 			const newVNode = newChildren[i];
-			const container = oldVNode.el && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldVNode.el) : fallbackContainer;
+			const oldEl = oldVNode.el || resolveAsyncComponentPlaceholder(oldVNode);
+			const container = oldEl && (oldVNode.type === Fragment || !isSameVNodeType(oldVNode, newVNode) || oldVNode.shapeFlag & 198) ? hostParentNode(oldEl) : fallbackContainer;
 			patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, namespace, slotScopeIds, true);
 		}
 	};
@@ -4752,6 +4831,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 			if (instance.asyncDep && !instance.asyncResolved) {
 				if (!!(process.env.NODE_ENV !== "production")) pushWarningContext(n2);
 				n2.el = n1.el;
+				n2.placeholder = n1.placeholder;
 				updateComponentPreRender(instance, n2, optimized);
 				if (!!(process.env.NODE_ENV !== "production")) popWarningContext();
 				return;
@@ -4761,6 +4841,7 @@ function baseCreateRenderer(options, createHydrationFns) {
 			}
 		} else {
 			n2.el = n1.el;
+			n2.placeholder = n1.placeholder;
 			instance.vnode = n2;
 		}
 	};
@@ -5107,12 +5188,9 @@ function baseCreateRenderer(options, createHydrationFns) {
 	};
 	const remove = (vnode) => {
 		const { type, el, anchor, transition } = vnode;
-		if (type === Fragment) {
-			if (!!(process.env.NODE_ENV !== "production") && vnode.patchFlag > 0 && vnode.patchFlag & 2048 && transition && !transition.persisted) vnode.children.forEach((child) => {
-				if (child.type === Comment) hostRemove(child.el);
-				else remove(child);
-			});
-			else removeFragment(el, anchor);
+		const isFragment = type === Fragment;
+		if (isFragment && !transition) {
+			removeFragment(el, anchor);
 			return;
 		}
 		if (type === Static) {
@@ -5120,8 +5198,21 @@ function baseCreateRenderer(options, createHydrationFns) {
 			if (transition && !transition.persisted && transition.afterLeave) transition.afterLeave();
 			return;
 		}
-		if (transition) performTransitionLeave(el, transition, () => hostRemove(el), !!(vnode.shapeFlag & 1));
-		else hostRemove(el);
+		const leavingNode = isFragment ? getTransitionRoot(vnode) : vnode;
+		const performRemove = () => {
+			if (isFragment) {
+				if (hostParentNode(el)) removeFragment(el, anchor);
+			} else hostRemove(el);
+		};
+		if (transition) {
+			let leavingEl = leavingNode && leavingNode.el;
+			let isElement = !!(leavingNode && leavingNode.shapeFlag & 1);
+			if (isFragment && leavingNode && isVaporComponent(leavingNode.type)) {
+				leavingEl = getVaporInterface(leavingNode.component, leavingNode).getTransitionElement(leavingNode);
+				isElement = !!leavingEl;
+			}
+			performTransitionLeave(leavingEl || el, transition, performRemove, isElement);
+		} else performRemove();
 	};
 	const removeFragment = (cur, end) => {
 		let next;
@@ -5164,15 +5255,12 @@ function baseCreateRenderer(options, createHydrationFns) {
 		return teleportEnd ? hostNextSibling(teleportEnd) : el;
 	};
 	const render = (vnode, container, namespace) => {
-		let instance;
-		if (vnode == null) {
-			if (container._vnode) {
-				unmount(container._vnode, null, null, true);
-				instance = container._vnode.component;
-			}
-		} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
-		container._vnode = vnode;
-		flushOnAppMount(instance);
+		flushOnAppMount(() => {
+			if (vnode == null) {
+				if (container._vnode) unmount(container._vnode, null, null, true);
+			} else patch(container._vnode || null, vnode, container, null, null, null, namespace);
+			container._vnode = vnode;
+		}, vnode && container._vnode ? void 0 : vnode && vnode.component ? vnode.component.uid : getNextUid());
 	};
 	const internals = {
 		p: patch,
@@ -5567,13 +5655,12 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
 		registerDep(instance, onResolve) {
 			const isInPendingSuspense = !!suspense.pendingBranch;
 			if (isInPendingSuspense) suspense.deps++;
-			const hydratedEl = instance.vnode && instance.vnode.el;
 			instance.asyncDep.catch((err) => {
 				handleError(err, instance, 0);
 			}).then((asyncSetupResult) => {
 				if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) return;
 				setCurrentInstance(null, void 0);
-				if (hydratedEl && !instance.scope.active) {
+				if (!instance.scope.active) {
 					if (isInPendingSuspense && --suspense.deps === 0) suspense.resolve();
 					return;
 				}
@@ -5886,7 +5973,7 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 		ctx: vnode.ctx,
 		ce: vnode.ce,
 		vi: vnode.vi,
-		vs: cloneVaporSlotMeta(vnode),
+		vs: cloneVaporSlotMeta(vnode, extraProps),
 		vb: vnode.vb,
 		ibu: vnode.ibu,
 		iu: vnode.iu,
@@ -5895,13 +5982,22 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
 	if (transition && cloneTransition) setTransitionHooks(cloned, transition.clone(cloned));
 	return cloned;
 }
-function cloneVaporSlotMeta(vnode) {
+function cloneVaporSlotMeta(vnode, extraProps) {
 	const vaporSlot = vnode.vs;
 	if (!vaporSlot) return vaporSlot;
 	const cloned = {
 		slot: vaporSlot.slot,
-		outlets: vaporSlot.outlets
+		outlets: vaporSlot.outlets,
+		props: vaporSlot.props
 	};
+	if (vaporSlot.props && extraProps) {
+		let extraSlotProps;
+		for (const key in extraProps) if (key !== "key") {
+			if (!extraSlotProps) extraSlotProps = {};
+			extraSlotProps[key] = extraProps[key];
+		}
+		if (extraSlotProps) cloned.props = mergeProps(vaporSlot.props, extraSlotProps);
+	}
 	if (vnode.el) {
 		cloned.state = vaporSlot.state;
 		cloned.ref = vaporSlot.ref;
@@ -6093,6 +6189,9 @@ const useInstanceOption = (key, silent = false) => {
 //#region packages/runtime-core/src/component.ts
 const emptyAppContext = /*@__PURE__*/ createAppContext();
 let uid = 0;
+function getNextUid() {
+	return uid;
+}
 /**
 * @internal for vapor
 */
@@ -6618,7 +6717,7 @@ function isMemoSame(cached, memo) {
 }
 //#endregion
 //#region packages/runtime-core/src/index.ts
-const version = "3.6.0-rc.10";
+const version = "3.6.0-rc.12";
 const warn = !!(process.env.NODE_ENV !== "production") ? warn$1 : NOOP;
 /**
 * Runtime error messages. Only exposed in dev or esm builds.
@@ -6656,4 +6755,4 @@ const resolveFilter = null;
 const compatUtils = null;
 const DeprecationTypes = null;
 //#endregion
-export { BaseTransition, BaseTransitionPropsValidators, Comment, DeprecationTypes, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, MismatchTypes, MoveType, NULL_DYNAMIC_COMPONENT, ReactiveEffect, SchedulerJobFlags, Static, Suspense, Teleport, Text, TrackOpTypes, TriggerOpTypes, VaporSlot, activate, assertNumber, baseEmit, baseNormalizePropsOptions, baseResolveTransitionHooks, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, checkTransitionMode, cloneVNode, compatUtils, computed, createAppAPI, createAsyncComponentContext, createBlock, createCanSetSetupRefChecker, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createInternalObject, createPropsRestProxy, createRenderer, createSlots, createStaticVNode, createTextVNode, createVNode, currentInstance, customRef, deactivate, defaultPropGetter, defineAsyncComponent, defineComponent, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSlots, devtools, devtoolsComponentAdded, effect, effectScope, endMeasure, ensureValidVNode, expose, filterModelListeners, flushOnAppMount, getAttributeMismatch, getComponentName, getContainerType, getCurrentInstance, getCurrentScope, getCurrentWatcher, getFunctionalFallthrough, getInheritedScopeIds, getTransitionRawChildren, guardReactiveProps, h, handleError, hasInjectionContext, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initFeatureFlags, inject, invalidateMount, invokeDirectiveHook, invokeSlotFallback, invokeVNodeHook, isAsyncWrapper, isEmitListener, isFunctionalFallthroughKey, isHydrating, isHydratingEnabled, isKeepAlive, isMapEqual, isMemoSame, isMismatchAllowed, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isSetEqual, isShallow, isTeleportDeferred, isTeleportDisabled, isTemplateNode, isTemplateRefKey, isUnchangedResourceProp, isVNode, isValidHtmlOrSvgAttribute, knownTemplateRefs, leaveCbKey, logMismatchError, markAsyncBoundary, markRaw, matches, mergeDefaults, mergeModels, mergeProps, nextTick, nextUid, normalizeClass, normalizeProps, normalizeRef, normalizeStyle, normalizeVNode, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, onWatcherCleanup, openBlock, performAsyncHydrate, performTransitionEnter, performTransitionLeave, popScopeId, popWarningContext, prepareTransitionLeave, prepareTransitionSwitch, provide, proxyRefs, pushScopeId, pushWarningContext, queueJob, queuePostFlushCb, queuePostRenderEffect, rawVaporSlotKey, reactive, readonly, ref, registerHMR, registerRuntimeCompiler, renderList, renderSlot, resetShapeFlag, resolveComponent, resolveCssVars, resolveDirective, resolveDynamicComponent, resolveFilter, resolvePropValue, resolveTarget as resolveTeleportTarget, resolveTransitionChild, resolveTransitionHooks, restoreCurrentInstance, setBlockTracking, setCurrentInstance, setCurrentRenderingInstance, setDevtoolsHook, setIsHydratingEnabled, setRef, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, shouldUpdateComponent, simpleSetCurrentInstance, ssrContextKey, ssrUtils, startMeasure, stop, toClassSet, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toStyleMap, toValue, transformVNodeArgs, triggerRef, unref, unregisterHMR, useAsyncComponentState, useAttrs, useId, useInstanceOption, useModel, useSSRContext, useSlots, useTemplateRef, useTransitionState, validateComponentName, validateProps, version, warn, warnExtraneousAttributes, warnPropMismatch, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withMemo, withScopeId };
+export { BaseTransition, BaseTransitionPropsValidators, Comment, DeprecationTypes, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, MismatchTypes, MoveType, NULL_DYNAMIC_COMPONENT, ReactiveEffect, SchedulerJobFlags, Static, Suspense, Teleport, Text, TrackOpTypes, TriggerOpTypes, VaporSlot, activate, assertNumber, baseEmit, baseNormalizePropsOptions, baseResolveTransitionHooks, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, checkTransitionMode, cloneVNode, compatUtils, computed, createAppAPI, createAsyncComponentContext, createBlock, createCanSetSetupRefChecker, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createInternalObject, createPropsRestProxy, createRenderer, createSlots, createStaticVNode, createTextVNode, createVNode, currentInstance, customRef, deactivate, defaultPropGetter, defineAsyncComponent, defineComponent, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSlots, devtools, devtoolsComponentAdded, effect, effectScope, endMeasure, ensureValidVNode, expose, filterModelListeners, filterSingleRoot, flushOnAppMount, getAttributeMismatch, getComponentName, getContainerType, getCurrentInstance, getCurrentScope, getCurrentWatcher, getFunctionalFallthrough, getInheritedScopeIds, getNextUid, getTransitionRawChildren, guardReactiveProps, h, handleError, hasInjectionContext, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initFeatureFlags, inject, invalidateMount, invokeDirectiveHook, invokeSlotFallback, invokeVNodeHook, isAsyncWrapper, isEmitListener, isFunctionalFallthroughKey, isHydrating, isHydratingEnabled, isKeepAlive, isMapEqual, isMemoSame, isMismatchAllowed, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isSetEqual, isShallow, isTeleportDeferred, isTeleportDisabled, isTemplateNode, isTemplateRefKey, isUnchangedResourceProp, isVNode, isValidHtmlOrSvgAttribute, knownTemplateRefs, leaveCbKey, logMismatchError, markAsyncBoundary, markRaw, matches, mergeDefaults, mergeModels, mergeProps, nextTick, nextUid, normalizeClass, normalizeProps, normalizeRef, normalizeStyle, normalizeVNode, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, onWatcherCleanup, openBlock, performAsyncHydrate, performTransitionEnter, performTransitionLeave, popScopeId, popWarningContext, prepareTransitionLeave, prepareTransitionSwitch, provide, proxyRefs, pushScopeId, pushWarningContext, queueJob, queuePostFlushCb, queuePostRenderEffect, rawVaporSlotKey, reactive, readonly, ref, registerHMR, registerRuntimeCompiler, renderList, renderSlot, resetShapeFlag, resolveComponent, resolveCssVars, resolveDirective, resolveDynamicComponent, resolveFilter, resolvePropValue, resolveTarget as resolveTeleportTarget, resolveTransitionChild, resolveTransitionHooks, restoreCurrentInstance, setBlockTracking, setCurrentInstance, setCurrentRenderingInstance, setDevtoolsHook, setIsHydratingEnabled, setRef, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, shouldUpdateComponent, simpleSetCurrentInstance, ssrContextKey, ssrUtils, startMeasure, stop, toClassSet, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toStyleMap, toValue, transformVNodeArgs, triggerRef, unref, unregisterHMR, useAsyncComponentState, useAttrs, useId, useInstanceOption, useModel, useSSRContext, useSlots, useTemplateRef, useTransitionState, validateComponentName, validateProps, version, warn, warnExtraneousAttributes, warnPropMismatch, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withMemo, withScopeId };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue/runtime-core",
-  "version": "3.6.0-rc.10",
+  "version": "3.6.0-rc.12",
   "description": "@vue/runtime-core",
   "main": "index.js",
   "module": "dist/runtime-core.esm-bundler.js",
@@ -46,7 +46,7 @@
   },
   "homepage": "https://github.com/vuejs/core/tree/main/packages/runtime-core#readme",
   "dependencies": {
-    "@vue/shared": "3.6.0-rc.10",
-    "@vue/reactivity": "3.6.0-rc.10"
+    "@vue/shared": "3.6.0-rc.12",
+    "@vue/reactivity": "3.6.0-rc.12"
   }
 }