@vue/runtime-dom 3.6.0-rc.12 → 3.6.0-rc.14

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

@@ -1,9 +1,9 @@
 /**
-  * @vue/runtime-dom v3.6.0-rc.12
+  * @vue/runtime-dom v3.6.0-rc.14
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
-import { BaseTransition, BaseTransitionPropsValidators, Fragment, Static, Text, assertNumber, callWithAsyncErrorHandling, camelize, createHydrationRenderer, createRenderer, createVNode, defineComponent, getCurrentInstance, getTransitionRawChildren, h, isRuntimeOnly, nextTick, onBeforeUpdate, onMounted, onUnmounted, onUpdated, queuePostFlushCb, resolveTransitionHooks, setIsHydratingEnabled, setTransitionHooks, toRaw, unref, useInstanceOption, useTransitionState, warn, watch } from "@vue/runtime-core";
+import { BaseTransition, BaseTransitionPropsValidators, Fragment, Static, Text, assertNumber, callWithAsyncErrorHandling, camelize, createHydrationRenderer, createRenderer, createVNode, defineComponent, getCurrentInstance, getTransitionRawChildren, h, isRuntimeOnly, isVaporInteropEnabled, nextTick, onBeforeUpdate, onMounted, onUnmounted, onUpdated, queuePostFlushCb, resolveTransitionHooks, setIsHydratingEnabled, setTransitionHooks, toRaw, unref, useInstanceOption, useTransitionState, warn, watch, withTransitionEnabled } from "@vue/runtime-core";
 import { EMPTY_OBJ, NOOP, camelize as camelize$1, canSetValueDirectly, capitalize, extend, hasOwn, hyphenate, includeBooleanAttr, invokeArrayFns, isArray, isFunction, isHTMLTag, isMathMLTag, isModelListener, isNativeOn, isObject, isOn, isPlainObject, isSVGTag, isSet, isSpecialBooleanAttr, isString, isSymbol, looseEqual, looseIndexOf, looseToNumber, normalizeCssVarValue, shouldSetAsAttr, toNumber } from "@vue/shared";
 export * from "@vue/runtime-core";
 //#region packages/runtime-dom/src/nodeOps.ts
@@ -400,14 +400,14 @@ function setVarsOnVNode(vnode, vars) {
 	}
 	while (vnode.component) {
 		const component = vnode.component;
-		if (component.vapor) {
+		if (isVaporInteropEnabled && component.vapor) {
 			component.appContext.vapor.applyCssVars(vnode, vars);
 			return;
 		}
 		vnode = vnode.component.subTree;
 	}
 	if (vnode.shapeFlag & 1 && vnode.el) setVarsOnNode(vnode.el, vars);
-	else if (vnode.vb) vnode.ctx.appContext.vapor.applyCssVars(vnode, vars);
+	else if (isVaporInteropEnabled && vnode.vb) vnode.ctx.appContext.vapor.applyCssVars(vnode, vars);
 	else if (vnode.type === Fragment) vnode.children.forEach((c) => setVarsOnVNode(c, vars));
 	else if (vnode.type === Static) {
 		let { el, anchor } = vnode;
@@ -1110,7 +1110,7 @@ const decorate = (t) => {
 	delete t.props.mode;
 	return t;
 };
-const TransitionGroup = /* @__PURE__ */ decorate({
+const TransitionGroup = /*@__PURE__*/ withTransitionEnabled(/* @__PURE__ */ decorate({
 	name: "TransitionGroup",
 	props: /*@__PURE__*/ extend({}, TransitionPropsValidators, {
 		tag: String,
@@ -1119,6 +1119,11 @@ const TransitionGroup = /* @__PURE__ */ decorate({
 	setup(props, { slots }) {
 		const instance = getCurrentInstance();
 		const state = useTransitionState();
+		const group = {
+			props: {},
+			state,
+			instance
+		};
 		let prevChildren;
 		let children;
 		let origins;
@@ -1149,7 +1154,7 @@ const TransitionGroup = /* @__PURE__ */ decorate({
 		});
 		return () => {
 			const rawProps = toRaw(props);
-			const cssTransitionProps = resolveTransitionProps(rawProps);
+			const cssTransitionProps = group.props = resolveTransitionProps(rawProps);
 			let tag = rawProps.tag || Fragment;
 			prevChildren = [];
 			moves = void 0;
@@ -1159,12 +1164,17 @@ const TransitionGroup = /* @__PURE__ */ decorate({
 					prevChildren.push(child);
 					setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
 					positionMap.set(child, getPosition(child.el));
-				}
+				} else if (isVaporInteropEnabled && child.vs && child.vb) instance.appContext.vapor.forEachGroupChild(child, (el) => {
+					const row = { el };
+					prevChildren.push(row);
+					positionMap.set(row, getPosition(el));
+				});
 			}
 			children = slots.default ? getTransitionRawChildren(slots.default()) : [];
 			for (let i = 0; i < children.length; i++) {
 				const child = children[i];
-				if (child.key != null) setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
+				if (isVaporInteropEnabled && child.vs) child.vs.group = group;
+				else if (child.key != null) setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
 				else if (!!(process.env.NODE_ENV !== "production") && child.type !== Text) warn(`<TransitionGroup> children must be keyed.`);
 			}
 			if (prevChildren.length) {
@@ -1178,7 +1188,7 @@ const TransitionGroup = /* @__PURE__ */ decorate({
 			return createVNode(tag, null, children);
 		};
 	}
-});
+}));
 function callPendingCbs(el) {
 	if (el[moveCbKey]) el[moveCbKey]();
 	if (el[enterCbKey]) el[enterCbKey]();
@@ -1322,7 +1332,7 @@ const vModelTextInit = (el, trim, number, lazy, set) => {
 		if (e.target.composing) return;
 		(set || el[assignKey])(castValue(el.value, trim, number || el.type === "number"));
 	});
-	if (trim || number) addEventListener(el, "change", () => {
+	if (trim || number || el.type === "number") addEventListener(el, "change", () => {
 		el.value = castValue(el.value, trim, number || el.type === "number");
 	});
 	if (!lazy) {

package/dist/runtime-dom.global.js

@@ -1,5 +1,5 @@
 /**
-  * @vue/runtime-dom v3.6.0-rc.12
+  * @vue/runtime-dom v3.6.0-rc.14
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -428,6 +428,21 @@ var VueRuntimeDOM = (function(exports) {
 		return String(value);
 	}
 	//#endregion
+	//#region packages/shared/src/vaporFlags.ts
+	/**
+	* The data of the comment a vapor server render opens the branch of a `v-if`
+	* chain with, `<!--[1-->`: the digits are the branch's position in the chain,
+	* and `<!--]-->` closes it like a fragment.
+	*/
+	function isVaporBranchStart(data) {
+		if (data.length < 2 || data.charCodeAt(0) !== 91) return false;
+		for (let i = 1; i < data.length; i++) {
+			const c = data.charCodeAt(i);
+			if (c < 48 || c > 57) return false;
+		}
+		return true;
+	}
+	//#endregion
 	//#region packages/reactivity/src/debug.ts
 	const triggerEventInfos = [];
 	function onTrack(sub, debugInfo) {
@@ -3209,6 +3224,16 @@ var VueRuntimeDOM = (function(exports) {
 		};
 	}
 	//#endregion
+	//#region packages/runtime-core/src/vaporInteropState.ts
+	/**
+	* Set by `vaporInteropPlugin`. Stays false in apps that never import the
+	* plugin, so bundlers drop the vapor-in-vdom branches of the renderer.
+	*/
+	let isVaporInteropEnabled = false;
+	function setVaporInteropEnabled() {
+		isVaporInteropEnabled = true;
+	}
+	//#endregion
 	//#region packages/runtime-core/src/components/Teleport.ts
 	const pendingMounts = /* @__PURE__ */ new WeakMap();
 	const TeleportEndKey = Symbol("_vte");
@@ -3468,13 +3493,18 @@ var VueRuntimeDOM = (function(exports) {
 		onAfterAppear: TransitionHookValidator,
 		onAppearCancelled: TransitionHookValidator
 	};
+	let isTransitionEnabled = false;
+	function withTransitionEnabled(value) {
+		isTransitionEnabled = true;
+		return value;
+	}
 	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);
+		if (isVaporInteropEnabled && (vnode.type === VaporSlot || isVaporComponent(vnode.type))) return !getVaporInterface(instance, vnode).hasTransitionChild(vnode);
 		return !!vnode.component && isEmptyTransitionChild(vnode.component.subTree, instance);
 	}
 	const BaseTransitionImpl = {
@@ -3491,7 +3521,7 @@ var VueRuntimeDOM = (function(exports) {
 				const { mode } = rawProps;
 				checkTransitionMode(mode);
 				return prepareTransitionSwitch(instance.subTree, child, rawProps, state, instance, mode === "out-in" ? resumeAfterLeave || (resumeAfterLeave = () => {
-					if (!(instance.job.flags & 4)) instance.update();
+					if (!(instance.effect.flags & 1024)) instance.update();
 				}) : NOOP);
 			};
 		}
@@ -3511,7 +3541,7 @@ var VueRuntimeDOM = (function(exports) {
 		}
 		return child;
 	}
-	const BaseTransition = BaseTransitionImpl;
+	const BaseTransition = /*@__PURE__*/ withTransitionEnabled(BaseTransitionImpl);
 	function getLeavingNodesForType(state, vnode) {
 		const { leavingNodes } = state;
 		let leavingVNodesCache = leavingNodes.get(vnode.type);
@@ -3549,7 +3579,7 @@ var VueRuntimeDOM = (function(exports) {
 				return hooks;
 			}
 		}, props, state, instance);
-		if (vnode.type === VaporSlot) extend(hooks, {
+		if (isVaporInteropEnabled && vnode.type === VaporSlot) extend(hooks, {
 			__vapor: true,
 			props,
 			state,
@@ -3726,7 +3756,7 @@ var VueRuntimeDOM = (function(exports) {
 	function setTransitionHooks(vnode, hooks) {
 		if (vnode.shapeFlag & 6 && vnode.component) {
 			vnode.transition = hooks;
-			if (isVaporComponent(vnode.type)) getVaporInterface(vnode.component, vnode).setTransitionHooks(vnode.component, hooks);
+			if (isVaporInteropEnabled && isVaporComponent(vnode.type)) getVaporInterface(vnode.component, vnode).setTransitionHooks(vnode.component, hooks);
 			else {
 				const subTree = vnode.component.subTree;
 				return setTransitionHooks(isTeleport(subTree.type) ? getInnerChild$1(subTree) || subTree : subTree, hooks);
@@ -3765,7 +3795,7 @@ var VueRuntimeDOM = (function(exports) {
 		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.component && (!isVaporInteropEnabled || !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;
@@ -3952,6 +3982,8 @@ var VueRuntimeDOM = (function(exports) {
 		if (isMathMLContainer(container)) return "mathml";
 	};
 	const isComment = (node) => node.nodeType === 8;
+	/** The data of a comment opening a range a hydration steps over as one. */
+	const isRangeStart = (data) => data === "[" || data === "(" || isVaporBranchStart(data);
 	function createHydrationFunctions(rendererInternals) {
 		const { mt: mountComponent, p: patch, o: { patchProp, createText, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals;
 		const hydrate = (vnode, container) => {
@@ -3969,7 +4001,7 @@ var VueRuntimeDOM = (function(exports) {
 		};
 		const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => {
 			optimized = optimized || !!vnode.dynamicChildren;
-			const isFragmentStart = isComment(node) && (node.data === "[" || node.data === "(");
+			const isFragmentStart = isComment(node) && (node.data === "[" || node.data === "(" || isVaporInteropEnabled && isVaporBranchStart(node.data));
 			const onMismatch = () => handleMismatch(node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragmentStart);
 			const { type, ref, shapeFlag, patchFlag } = vnode;
 			let domType = node.nodeType;
@@ -4025,7 +4057,7 @@ var VueRuntimeDOM = (function(exports) {
 					else nextNode = hydrateFragment(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
 					break;
 				case VaporSlot:
-					nextNode = getVaporInterface(parentComponent, vnode).hydrateSlot(vnode, node, parentComponent, parentSuspense, slotScopeIds);
+					if (isVaporInteropEnabled) nextNode = getVaporInterface(parentComponent, vnode).hydrateSlot(vnode, node, parentComponent, parentSuspense, slotScopeIds);
 					break;
 				default: if (shapeFlag & 1) {
 					if ((domType !== 1 || vnode.type.toLowerCase() !== node.tagName.toLowerCase()) && !isTemplateNode(node)) nextNode = onMismatch();
@@ -4157,7 +4189,7 @@ var VueRuntimeDOM = (function(exports) {
 			if (fragmentSlotScopeIds) slotScopeIds = slotScopeIds ? slotScopeIds.concat(fragmentSlotScopeIds) : fragmentSlotScopeIds;
 			const container = parentNode(node);
 			const first = nextSibling(node);
-			const next = vnode.vo && node.data === "(" ? getVaporInterface(parentComponent, vnode).hydrateSlotOutlet(vnode, node, parentComponent, parentSuspense, slotScopeIds) : hydrateChildren(first, vnode, container, parentComponent, parentSuspense, slotScopeIds, optimized);
+			const next = isVaporInteropEnabled && vnode.vo && node.data === "(" ? getVaporInterface(parentComponent, vnode).hydrateSlotOutlet(vnode, node, parentComponent, parentSuspense, slotScopeIds) : hydrateChildren(first, vnode, container, parentComponent, parentSuspense, slotScopeIds, optimized);
 			if (next && isComment(next) && next.data === (node.data === "(" ? ")" : "]")) return nextSibling(vnode.anchor = next);
 			else {
 				logMismatchError();
@@ -4167,7 +4199,7 @@ var VueRuntimeDOM = (function(exports) {
 		};
 		const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
 			if (!isNodeMismatchAllowed(node, vnode)) {
-				warn$1(`Hydration node mismatch:\n- rendered on server:`, node, node.nodeType === 3 ? `(text)` : isComment(node) && (node.data === "[" || node.data === "(") ? `(start of fragment)` : ``, `\n- expected on client:`, vnode.type);
+				warn$1(`Hydration node mismatch:\n- rendered on server:`, node, node.nodeType === 3 ? `(text)` : isComment(node) && isRangeStart(node.data) ? `(start of fragment)` : ``, `\n- expected on client:`, vnode.type);
 				logMismatchError();
 			}
 			vnode.el = null;
@@ -4194,7 +4226,7 @@ var VueRuntimeDOM = (function(exports) {
 			while (node) {
 				node = nextSibling(node);
 				if (node && isComment(node)) {
-					if (node.data === open) match++;
+					if (node.data === open || isVaporInteropEnabled && open === "[" && isVaporBranchStart(node.data)) match++;
 					if (node.data === close) {
 						if (match === 0) return nextSibling(node);
 						else match--;
@@ -4450,9 +4482,9 @@ var VueRuntimeDOM = (function(exports) {
 		return teardown;
 	};
 	function forEachElement(node, cb) {
-		if (isComment(node) && (node.data === "[" || node.data === "(")) {
+		if (isComment(node) && isRangeStart(node.data)) {
 			const open = node.data;
-			const close = open === "[" ? "]" : ")";
+			const close = open === "(" ? ")" : "]";
 			let depth = 1;
 			let next = node.nextSibling;
 			while (next) {
@@ -4461,7 +4493,7 @@ var VueRuntimeDOM = (function(exports) {
 				} else if (isComment(next)) {
 					if (next.data === close) {
 						if (--depth === 0) break;
-					} else if (next.data === open) depth++;
+					} else if (close === "]" ? next.data === "[" || isVaporBranchStart(next.data) : next.data === open) depth++;
 				}
 				next = next.nextSibling;
 			}
@@ -4564,7 +4596,7 @@ var VueRuntimeDOM = (function(exports) {
 			setPendingRequest: (request) => pendingRequest = request
 		};
 	}
-	const useAsyncComponentState = (delay, timeout, onError, instance = currentInstance) => {
+	const useAsyncComponentState = (delay = 200, timeout, onError, instance = currentInstance) => {
 		const loaded = /* @__PURE__ */ ref(false);
 		const error = /* @__PURE__ */ ref();
 		const delayed = /* @__PURE__ */ ref(!!delay);
@@ -4621,7 +4653,12 @@ var VueRuntimeDOM = (function(exports) {
 	//#endregion
 	//#region packages/runtime-core/src/components/KeepAlive.ts
 	const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
-	const KeepAlive = {
+	let isKeepAliveEnabled = false;
+	function withKeepAliveEnabled(value) {
+		isKeepAliveEnabled = true;
+		return value;
+	}
+	const KeepAlive = /*@__PURE__*/ withKeepAliveEnabled({
 		name: `KeepAlive`,
 		__isKeepAlive: true,
 		props: {
@@ -4760,7 +4797,7 @@ var VueRuntimeDOM = (function(exports) {
 				return isSuspense(rawVNode.type) ? rawVNode : vnode;
 			};
 		}
-	};
+	});
 	function matches(pattern, name) {
 		if (isArray(pattern)) return pattern.some((p) => matches(p, name));
 		else if (isString(pattern)) return pattern.split(",").includes(name);
@@ -4992,11 +5029,12 @@ var VueRuntimeDOM = (function(exports) {
 	function renderSlot(slots, name, props, fallback, noSlotted, branchKey) {
 		if (props == null) props = {};
 		let slot = slots[name];
-		const vaporSlot = slot && slot[rawVaporSlotKey];
+		const vaporSlot = isVaporInteropEnabled && slot && slot[rawVaporSlotKey];
 		if (vaporSlot) {
 			const ret = (openBlock(), createBlock(VaporSlot, props));
 			ret.vs = {
 				slot: vaporSlot,
+				name,
 				outlets: fallback ? [{
 					fallback,
 					owner: currentRenderingInstance
@@ -5027,7 +5065,7 @@ var VueRuntimeDOM = (function(exports) {
 		try {
 			const validSlotContent = slot && ensureValidVNode(slot(props));
 			let attached = false;
-			if (fallback && validSlotContent && currentRenderingInstance) {
+			if (isVaporInteropEnabled && fallback && validSlotContent && currentRenderingInstance) {
 				const interop = currentRenderingInstance.appContext.vapor;
 				if (interop) attached = interop.attachSlotOutlet(validSlotContent, fallback, currentRenderingInstance);
 			}
@@ -6711,7 +6749,7 @@ var VueRuntimeDOM = (function(exports) {
 					processFragment(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized);
 					break;
 				case VaporSlot:
-					getVaporInterface(parentComponent, n2).slot(n1, n2, container, anchor, parentComponent, parentSuspense, slotScopeIds);
+					if (isVaporInteropEnabled) getVaporInterface(parentComponent, n2).slot(n1, n2, container, anchor, parentComponent, parentSuspense, slotScopeIds);
 					break;
 				default: if (shapeFlag & 1) processElement(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized);
 				else if (shapeFlag & 6) processComponent(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized);
@@ -6845,7 +6883,7 @@ var VueRuntimeDOM = (function(exports) {
 			let vnodeHook;
 			parentComponent && toggleRecurse(parentComponent, false);
 			if (vnodeHook = newProps.onVnodeBeforeUpdate) invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
-			if (n2.ibu) n2.ibu();
+			if (isVaporInteropEnabled && n2.ibu) n2.ibu();
 			if (dirs) invokeDirectiveHook(n2, n1, parentComponent, "beforeUpdate");
 			parentComponent && toggleRecurse(parentComponent, true);
 			if (isHmrUpdating || dynamicChildren && (!n1.dynamicChildren || n1.dynamicChildren.length !== dynamicChildren.length)) {
@@ -6879,9 +6917,9 @@ var VueRuntimeDOM = (function(exports) {
 					if (n1.children !== n2.children) hostSetElementText(el, n2.children);
 				}
 			} else if (!optimized && dynamicChildren == null) patchProps(el, oldProps, newProps, parentComponent, namespace);
-			if ((vnodeHook = newProps.onVnodeUpdated) || dirs || n2.iu) queuePostRenderEffect(() => {
+			if ((vnodeHook = newProps.onVnodeUpdated) || dirs || isVaporInteropEnabled && n2.iu) queuePostRenderEffect(() => {
 				vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
-				n2.iu && n2.iu();
+				isVaporInteropEnabled && n2.iu && n2.iu();
 				dirs && invokeDirectiveHook(n2, n1, parentComponent, "updated");
 			}, void 0, parentSuspense);
 		};
@@ -7089,7 +7127,7 @@ var VueRuntimeDOM = (function(exports) {
 					} else next = vnode;
 					if (bu) invokeArrayFns(bu);
 					if (vnodeHook = next.props && next.props.onVnodeBeforeUpdate) invokeVNodeHook(vnodeHook, parent, next, vnode);
-					if (next.ibu) next.ibu();
+					if (isVaporInteropEnabled && next.ibu) next.ibu();
 					toggleRecurse(instance, true);
 					startMeasure(instance, `render`);
 					const nextTree = renderComponentRoot(instance);
@@ -7102,9 +7140,9 @@ var VueRuntimeDOM = (function(exports) {
 					next.el = nextTree.el;
 					if (originNext === null) updateHOCHostEl(instance, nextTree.el);
 					if (u) queuePostRenderEffect(u, void 0, parentSuspense);
-					if ((vnodeHook = next.props && next.props.onVnodeUpdated) || next.iu) queuePostRenderEffect(() => {
+					if ((vnodeHook = next.props && next.props.onVnodeUpdated) || isVaporInteropEnabled && next.iu) queuePostRenderEffect(() => {
 						vnodeHook && invokeVNodeHook(vnodeHook, parent, next, vnode);
-						next.iu && next.iu();
+						isVaporInteropEnabled && next.iu && next.iu();
 					}, void 0, parentSuspense);
 					devtoolsComponentUpdated(instance);
 					popWarningContext();
@@ -7256,7 +7294,7 @@ var VueRuntimeDOM = (function(exports) {
 		};
 		const move = (vnode, container, anchor, moveType, parentComponent, parentSuspense = null) => {
 			const { el, type, transition, children, shapeFlag } = vnode;
-			if (isVaporComponent(type) || type === VaporSlot) {
+			if (isVaporInteropEnabled && (isVaporComponent(type) || type === VaporSlot)) {
 				getVaporInterface(parentComponent, vnode).move(vnode, container, anchor, moveType, parentSuspense);
 				return;
 			}
@@ -7300,11 +7338,11 @@ var VueRuntimeDOM = (function(exports) {
 			}
 			if (cacheIndex != null && (!vnode.ctx || vnode.ctx === parentComponent)) parentComponent.renderCache[cacheIndex] = void 0;
 			if (shapeFlag & 256) {
-				if (isVaporComponent(vnode.type)) getVaporInterface(parentComponent, vnode).deactivate(vnode, parentComponent.ctx.getStorageContainer(), parentSuspense);
+				if (isVaporInteropEnabled && isVaporComponent(vnode.type)) getVaporInterface(parentComponent, vnode).deactivate(vnode, parentComponent.ctx.getStorageContainer(), parentSuspense);
 				else parentComponent.ctx.deactivate(vnode);
 				return;
 			}
-			if (shapeFlag & 6 && isVaporComponent(type)) {
+			if (isVaporInteropEnabled && shapeFlag & 6 && isVaporComponent(type)) {
 				getVaporInterface(parentComponent, vnode).unmount(vnode, doRemove, parentSuspense);
 				return;
 			}
@@ -7322,7 +7360,7 @@ var VueRuntimeDOM = (function(exports) {
 				if (shapeFlag & 64) vnode.type.remove(vnode, parentComponent, parentSuspense, internals, doRemove);
 				else if (dynamicChildren && !dynamicChildren.hasOnce && (type !== Fragment || patchFlag > 0 && patchFlag & 64)) unmountChildren(dynamicChildren, parentComponent, parentSuspense, false, true);
 				else if (type === Fragment && patchFlag & 384 || !optimized && shapeFlag & 16) unmountChildren(children, parentComponent, parentSuspense);
-				if (type === VaporSlot) {
+				if (isVaporInteropEnabled && type === VaporSlot) {
 					getVaporInterface(parentComponent, vnode).unmount(vnode, doRemove, parentSuspense);
 					return;
 				}
@@ -7356,7 +7394,7 @@ var VueRuntimeDOM = (function(exports) {
 			if (transition) {
 				let leavingEl = leavingNode && leavingNode.el;
 				let isElement = !!(leavingNode && leavingNode.shapeFlag & 1);
-				if (isFragment && leavingNode && isVaporComponent(leavingNode.type)) {
+				if (isVaporInteropEnabled && isFragment && leavingNode && isVaporComponent(leavingNode.type)) {
 					leavingEl = getVaporInterface(leavingNode.component, leavingNode).getTransitionElement(leavingNode);
 					isElement = !!leavingEl;
 				}
@@ -7395,7 +7433,7 @@ var VueRuntimeDOM = (function(exports) {
 		};
 		const getNextHostNode = (vnode) => {
 			if (vnode.shapeFlag & 6) {
-				if (isVaporComponent(vnode.type)) return hostNextSibling(vnode.anchor);
+				if (isVaporInteropEnabled && isVaporComponent(vnode.type)) return hostNextSibling(vnode.anchor);
 				return getNextHostNode(vnode.component.subTree);
 			}
 			if (vnode.shapeFlag & 128) return vnode.suspense.next();
@@ -7456,7 +7494,7 @@ var VueRuntimeDOM = (function(exports) {
 		return currentNamespace === "svg" && type === "foreignObject" || currentNamespace === "mathml" && type === "annotation-xml" && props && props.encoding && props.encoding.includes("html") ? void 0 : currentNamespace;
 	}
 	function toggleRecurse({ effect, job, vapor }, allowed) {
-		if (!vapor) {
+		if (!isVaporInteropEnabled || !vapor) {
 			if (allowed) {
 				effect.flags |= 128;
 				job.flags |= 2;
@@ -7568,7 +7606,7 @@ var VueRuntimeDOM = (function(exports) {
 				currentParent = currentParent.parent;
 			} else break;
 		}
-		const vaporScopeIds = includeVaporRootIds && currentVNode.vaporScopeIds;
+		const vaporScopeIds = isVaporInteropEnabled && includeVaporRootIds && currentVNode.vaporScopeIds;
 		if (vaporScopeIds) inheritedScopeIds.push(...vaporScopeIds);
 		return inheritedScopeIds;
 	}
@@ -7581,8 +7619,13 @@ var VueRuntimeDOM = (function(exports) {
 	//#endregion
 	//#region packages/runtime-core/src/components/Suspense.ts
 	const isSuspense = (type) => type.__isSuspense;
+	let isSuspenseEnabled = false;
+	function withSuspenseEnabled(value) {
+		isSuspenseEnabled = true;
+		return value;
+	}
 	let suspenseId = 0;
-	const Suspense = {
+	const Suspense = /*@__PURE__*/ withSuspenseEnabled({
 		name: "Suspense",
 		__isSuspense: true,
 		process(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) {
@@ -7599,7 +7642,7 @@ var VueRuntimeDOM = (function(exports) {
 		},
 		hydrate: hydrateSuspense,
 		normalize: normalizeSuspenseChildren
-	};
+	});
 	function triggerEvent(vnode, name) {
 		const eventListener = vnode.props && vnode.props[name];
 		if (isFunction(eventListener)) eventListener();
@@ -8134,16 +8177,23 @@ var VueRuntimeDOM = (function(exports) {
 		if (!vaporSlot) return vaporSlot;
 		const cloned = {
 			slot: vaporSlot.slot,
+			name: vaporSlot.name,
 			outlets: vaporSlot.outlets,
-			props: vaporSlot.props
+			props: vaporSlot.props,
+			attrs: vaporSlot.attrs && vaporSlot.attrs === EMPTY_OBJ ? {} : vaporSlot.attrs,
+			group: vaporSlot.group
 		};
-		if (vaporSlot.props && extraProps) {
+		const attrs = cloned.attrs;
+		if (extraProps && vaporSlot.props) {
 			let extraSlotProps;
-			for (const key in extraProps) if (key !== "key") {
+			for (const key in extraProps) if (attrs ? !isReservedProp(key) : key !== "key") {
 				if (!extraSlotProps) extraSlotProps = {};
 				extraSlotProps[key] = extraProps[key];
 			}
-			if (extraSlotProps) cloned.props = mergeProps(vaporSlot.props, extraSlotProps);
+			if (extraSlotProps) {
+				if (attrs) cloned.attrs = mergeProps(attrs, extraSlotProps);
+				else cloned.props = mergeProps(vaporSlot.props, extraSlotProps);
+			}
 		}
 		if (vnode.el) {
 			cloned.state = vaporSlot.state;
@@ -8416,7 +8466,7 @@ var VueRuntimeDOM = (function(exports) {
 		isSSR && setInSSRSetupState(isSSR);
 		const { props, children, vi } = instance.vnode;
 		const isStateful = isStatefulComponent(instance);
-		if (vi) vi(instance);
+		if (isVaporInteropEnabled && vi) vi(instance);
 		else {
 			initProps(instance, props, isStateful, isSSR);
 			initSlots(instance, children, optimized || isSSR);
@@ -8834,7 +8884,7 @@ var VueRuntimeDOM = (function(exports) {
 	}
 	//#endregion
 	//#region packages/runtime-core/src/index.ts
-	const version = "3.6.0-rc.12";
+	const version = "3.6.0-rc.14";
 	const warn = warn$1;
 	/**
 	* Runtime error messages. Only exposed in dev or esm builds.
@@ -9247,14 +9297,14 @@ var VueRuntimeDOM = (function(exports) {
 		}
 		while (vnode.component) {
 			const component = vnode.component;
-			if (component.vapor) {
+			if (isVaporInteropEnabled && component.vapor) {
 				component.appContext.vapor.applyCssVars(vnode, vars);
 				return;
 			}
 			vnode = vnode.component.subTree;
 		}
 		if (vnode.shapeFlag & 1 && vnode.el) setVarsOnNode(vnode.el, vars);
-		else if (vnode.vb) vnode.ctx.appContext.vapor.applyCssVars(vnode, vars);
+		else if (isVaporInteropEnabled && vnode.vb) vnode.ctx.appContext.vapor.applyCssVars(vnode, vars);
 		else if (vnode.type === Fragment) vnode.children.forEach((c) => setVarsOnVNode(c, vars));
 		else if (vnode.type === Static) {
 			let { el, anchor } = vnode;
@@ -9933,7 +9983,7 @@ var VueRuntimeDOM = (function(exports) {
 		delete t.props.mode;
 		return t;
 	};
-	const TransitionGroup = /* @__PURE__ */ decorate({
+	const TransitionGroup = /*@__PURE__*/ withTransitionEnabled(/* @__PURE__ */ decorate({
 		name: "TransitionGroup",
 		props: /*@__PURE__*/ extend({}, TransitionPropsValidators, {
 			tag: String,
@@ -9942,6 +9992,11 @@ var VueRuntimeDOM = (function(exports) {
 		setup(props, { slots }) {
 			const instance = getCurrentInstance();
 			const state = useTransitionState();
+			const group = {
+				props: {},
+				state,
+				instance
+			};
 			let prevChildren;
 			let children;
 			let origins;
@@ -9972,7 +10027,7 @@ var VueRuntimeDOM = (function(exports) {
 			});
 			return () => {
 				const rawProps = /* @__PURE__ */ toRaw(props);
-				const cssTransitionProps = resolveTransitionProps(rawProps);
+				const cssTransitionProps = group.props = resolveTransitionProps(rawProps);
 				let tag = rawProps.tag || Fragment;
 				prevChildren = [];
 				moves = void 0;
@@ -9982,12 +10037,17 @@ var VueRuntimeDOM = (function(exports) {
 						prevChildren.push(child);
 						setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
 						positionMap.set(child, getPosition(child.el));
-					}
+					} else if (isVaporInteropEnabled && child.vs && child.vb) instance.appContext.vapor.forEachGroupChild(child, (el) => {
+						const row = { el };
+						prevChildren.push(row);
+						positionMap.set(row, getPosition(el));
+					});
 				}
 				children = slots.default ? getTransitionRawChildren(slots.default()) : [];
 				for (let i = 0; i < children.length; i++) {
 					const child = children[i];
-					if (child.key != null) setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
+					if (isVaporInteropEnabled && child.vs) child.vs.group = group;
+					else if (child.key != null) setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
 					else if (child.type !== Text) warn(`<TransitionGroup> children must be keyed.`);
 				}
 				if (prevChildren.length) {
@@ -10001,7 +10061,7 @@ var VueRuntimeDOM = (function(exports) {
 				return createVNode(tag, null, children);
 			};
 		}
-	});
+	}));
 	function callPendingCbs(el) {
 		if (el[moveCbKey]) el[moveCbKey]();
 		if (el[enterCbKey]) el[enterCbKey]();
@@ -10145,7 +10205,7 @@ var VueRuntimeDOM = (function(exports) {
 			if (e.target.composing) return;
 			(set || el[assignKey])(castValue(el.value, trim, number || el.type === "number"));
 		});
-		if (trim || number) addEventListener(el, "change", () => {
+		if (trim || number || el.type === "number") addEventListener(el, "change", () => {
 			el.value = castValue(el.value, trim, number || el.type === "number");
 		});
 		if (!lazy) {
@@ -10589,6 +10649,12 @@ var VueRuntimeDOM = (function(exports) {
 	exports.initCustomFormatter = initCustomFormatter;
 	exports.initDirectivesForSSR = initDirectivesForSSR;
 	exports.inject = inject;
+	Object.defineProperty(exports, "isKeepAliveEnabled", {
+		enumerable: true,
+		get: function() {
+			return isKeepAliveEnabled;
+		}
+	});
 	exports.isMemoSame = isMemoSame;
 	exports.isProxy = isProxy;
 	exports.isReactive = isReactive;
@@ -10596,7 +10662,25 @@ var VueRuntimeDOM = (function(exports) {
 	exports.isRef = isRef;
 	exports.isRuntimeOnly = isRuntimeOnly;
 	exports.isShallow = isShallow;
+	Object.defineProperty(exports, "isSuspenseEnabled", {
+		enumerable: true,
+		get: function() {
+			return isSuspenseEnabled;
+		}
+	});
+	Object.defineProperty(exports, "isTransitionEnabled", {
+		enumerable: true,
+		get: function() {
+			return isTransitionEnabled;
+		}
+	});
 	exports.isVNode = isVNode;
+	Object.defineProperty(exports, "isVaporInteropEnabled", {
+		enumerable: true,
+		get: function() {
+			return isVaporInteropEnabled;
+		}
+	});
 	exports.markRaw = markRaw;
 	exports.mergeDefaults = mergeDefaults;
 	exports.mergeModels = mergeModels;
@@ -10643,6 +10727,7 @@ var VueRuntimeDOM = (function(exports) {
 	exports.setDevtoolsHook = setDevtoolsHook;
 	exports.setIsHydratingEnabled = setIsHydratingEnabled;
 	exports.setTransitionHooks = setTransitionHooks;
+	exports.setVaporInteropEnabled = setVaporInteropEnabled;
 	exports.shallowReactive = shallowReactive;
 	exports.shallowReadonly = shallowReadonly;
 	exports.shallowRef = shallowRef;
@@ -10687,9 +10772,12 @@ var VueRuntimeDOM = (function(exports) {
 	exports.withCtx = withCtx;
 	exports.withDefaults = withDefaults;
 	exports.withDirectives = withDirectives;
+	exports.withKeepAliveEnabled = withKeepAliveEnabled;
 	exports.withKeys = withKeys;
 	exports.withMemo = withMemo;
 	exports.withModifiers = withModifiers;
 	exports.withScopeId = withScopeId;
+	exports.withSuspenseEnabled = withSuspenseEnabled;
+	exports.withTransitionEnabled = withTransitionEnabled;
 	return exports;
 })({});