vue 3.6.0-beta.12 → 3.6.0-beta.13

package/dist/vue.runtime-with-vapor.esm-browser.js

@@ -1,5 +1,5 @@
 /**
-  * vue v3.6.0-beta.12
+  * vue v3.6.0-beta.13
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -1222,9 +1222,6 @@ function targetTypeMap(rawType) {
 		default: return 0;
 	}
 }
-function getTargetType(value) {
-	return value["__v_skip"] || !Object.isExtensible(value) ? 0 : targetTypeMap(toRawType(value));
-}
 /* @__NO_SIDE_EFFECTS__ */
 function reactive(target) {
 	if (/* @__PURE__ */ isReadonly(target)) return target;
@@ -1337,10 +1334,11 @@ function createReactiveObject(target, isReadonly, baseHandlers, collectionHandle
 		return target;
 	}
 	if (target["__v_raw"] && !(isReadonly && target["__v_isReactive"])) return target;
-	const targetType = getTargetType(target);
-	if (targetType === 0) return target;
+	if (target["__v_skip"] || !Object.isExtensible(target)) return target;
 	const existingProxy = proxyMap.get(target);
 	if (existingProxy) return existingProxy;
+	const targetType = targetTypeMap(toRawType(target));
+	if (targetType === 0) return target;
 	const proxy = new Proxy(target, targetType === 2 ? collectionHandlers : baseHandlers);
 	proxyMap.set(target, proxy);
 	return proxy;
@@ -3216,17 +3214,16 @@ const TeleportImpl = {
 	},
 	remove(vnode, parentComponent, parentSuspense, { um: unmount, o: { remove: hostRemove } }, doRemove) {
 		const { shapeFlag, children, anchor, targetStart, targetAnchor, props } = vnode;
-		let shouldRemove = doRemove || !isTeleportDisabled(props);
+		const shouldRemove = doRemove || !isTeleportDisabled(props);
 		const pendingMount = pendingMounts.get(vnode);
 		if (pendingMount) {
 			pendingMount.flags |= 4;
 			pendingMounts.delete(vnode);
-			shouldRemove = false;
 		}
 		if (targetStart) hostRemove(targetStart);
 		if (targetAnchor) hostRemove(targetAnchor);
 		doRemove && hostRemove(anchor);
-		if (shapeFlag & 16) for (let i = 0; i < children.length; i++) {
+		if (!pendingMount && shapeFlag & 16) for (let i = 0; i < children.length; i++) {
 			const child = children[i];
 			unmount(child, parentComponent, parentSuspense, shouldRemove, !!child.dynamicChildren);
 		}
@@ -3887,15 +3884,11 @@ function createHydrationFunctions(rendererInternals) {
 			}
 			if (shapeFlag & 16 && !(props && (props.innerHTML || props.textContent))) {
 				let next = hydrateChildren(el.firstChild, vnode, el, parentComponent, parentSuspense, slotScopeIds, optimized);
-				let hasWarned = false;
+				if (next && !isMismatchAllowed(el, 1)) {
+					warn$1(`Hydration children mismatch on`, el, `\nServer rendered element contains more child nodes than client vdom.`);
+					logMismatchError$1();
+				}
 				while (next) {
-					if (!isMismatchAllowed(el, 1)) {
-						if (!hasWarned) {
-							warn$1(`Hydration children mismatch on`, el, `\nServer rendered element contains more child nodes than client vdom.`);
-							hasWarned = true;
-						}
-						logMismatchError$1();
-					}
 					const cur = next;
 					next = next.nextSibling;
 					remove(cur);
@@ -3934,7 +3927,7 @@ function createHydrationFunctions(rendererInternals) {
 		optimized = optimized || !!parentVNode.dynamicChildren;
 		const children = parentVNode.children;
 		const l = children.length;
-		let hasWarned = false;
+		let hasCheckedMismatch = false;
 		for (let i = 0; i < l; i++) {
 			const vnode = optimized ? children[i] : children[i] = normalizeVNode(children[i]);
 			const isText = vnode.type === Text$1;
@@ -3948,12 +3941,12 @@ function createHydrationFunctions(rendererInternals) {
 				node = hydrateNode(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
 			} else if (isText && !vnode.children) insert(vnode.el = createText(""), container);
 			else {
-				if (!isMismatchAllowed(container, 1)) {
-					if (!hasWarned) {
+				if (!hasCheckedMismatch) {
+					hasCheckedMismatch = true;
+					if (!isMismatchAllowed(container, 1)) {
 						warn$1(`Hydration children mismatch on`, container, `\nServer rendered element contains fewer child nodes than client vdom.`);
-						hasWarned = true;
+						logMismatchError$1();
 					}
-					logMismatchError$1();
 				}
 				patch(null, vnode, container, null, parentComponent, parentSuspense, getContainerType(container), slotScopeIds);
 			}
@@ -6995,8 +6988,10 @@ function baseCreateRenderer(options, createHydrationFns) {
 				else hostInsert(el, container, anchor);
 			};
 			const performLeave = () => {
+				const wasLeaving = el._isLeaving || !!el[leaveCbKey];
 				if (el._isLeaving) el[leaveCbKey](true);
-				leave(el, () => {
+				if (transition.persisted && !wasLeaving) remove();
+				else leave(el, () => {
 					remove();
 					afterLeave && afterLeave();
 				});
@@ -7217,6 +7212,10 @@ function invalidateMount(hooks) {
 	if (hooks) for (let i = 0; i < hooks.length; i++) hooks[i].flags |= 4;
 }
 function performTransitionEnter(el, transition, insert, parentSuspense, force = false) {
+	if (force && transition.persisted && !el[leaveCbKey]) {
+		insert();
+		return;
+	}
 	if (force || needTransition(parentSuspense, transition)) {
 		transition.beforeEnter(el);
 		insert();
@@ -8469,7 +8468,7 @@ function isMemoSame(cached, memo) {
 }
 //#endregion
 //#region packages/runtime-core/src/index.ts
-const version = "3.6.0-beta.12";
+const version = "3.6.0-beta.13";
 const warn = warn$1;
 /**
 * Runtime error messages. Only exposed in dev or esm builds.
@@ -9077,7 +9076,21 @@ function createInvoker$1(initialValue, instance) {
 	const invoker = (e) => {
 		if (!e._vts) e._vts = Date.now();
 		else if (e._vts <= invoker.attached) return;
-		callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5, [e]);
+		const value = invoker.value;
+		if (isArray(value)) {
+			const originalStop = e.stopImmediatePropagation;
+			e.stopImmediatePropagation = () => {
+				originalStop.call(e);
+				e._stopped = true;
+			};
+			const handlers = value.slice();
+			const args = [e];
+			for (let i = 0; i < handlers.length; i++) {
+				if (e._stopped) break;
+				const handler = handlers[i];
+				if (handler) callWithAsyncErrorHandling(handler, instance, 5, args);
+			}
+		} else callWithAsyncErrorHandling(value, instance, 5, [e]);
 	};
 	invoker.value = initialValue;
 	invoker.attached = getNow();
@@ -9088,16 +9101,6 @@ function sanitizeEventValue(value, propName) {
 	warn(`Wrong type passed as event handler to ${propName} - did you forget @ or : in front of your prop?\nExpected function or array of functions, received type ${typeof value}.`);
 	return NOOP;
 }
-function patchStopImmediatePropagation(e, value) {
-	if (isArray(value)) {
-		const originalStop = e.stopImmediatePropagation;
-		e.stopImmediatePropagation = () => {
-			originalStop.call(e);
-			e._stopped = true;
-		};
-		return value.map((fn) => (e) => !e._stopped && fn && fn(e));
-	} else return value;
-}
 //#endregion
 //#region packages/runtime-dom/src/patchProp.ts
 const patchProp = (el, key, prevValue, nextValue, namespace, parentComponent) => {
@@ -10125,6 +10128,7 @@ function resetInsertionState() {
 }
 //#endregion
 //#region packages/runtime-vapor/src/dom/hydration.ts
+const START_TAG_RE = /^<([^\s/>]+)/;
 let isHydratingEnabled = false;
 function setIsHydratingEnabled$1(value) {
 	isHydratingEnabled = value;
@@ -10247,18 +10251,18 @@ function exitHydrationCursor(cursor) {
 * Locate the first non-fragment-comment node and locate the next node
 * while handling potential fragments.
 */
-function adoptTemplateImpl(node, template) {
+function adoptTemplateImpl(node, template, adoptChildren = false, ns) {
 	if (!(template[0] === "<" && template[1] === "!")) {
 		if (template.trim() === "" && isComment(node, "]") && isComment(node.previousSibling, "[")) node.before(node = /* @__PURE__ */ createTextNode());
 		node = resolveHydrationTarget(node);
 	}
 	const type = node.nodeType;
-	if (type === 8 && !template.startsWith("<!") || type === 1 && !template.startsWith(`<` + node.tagName.toLowerCase())) node = handleMismatch(node, template);
+	if (type === 8 && !template.startsWith("<!") || type === 1 && !template.startsWith(`<` + node.tagName.toLowerCase())) node = handleMismatch(node, template, adoptChildren, ns);
 	advanceHydrationNode(node);
 	return node;
 }
-function locateNextNode(node) {
-	return isComment(node, "[") ? /* @__PURE__ */ _next(locateEndAnchor(node)) : isComment(node, "teleport start") ? /* @__PURE__ */ _next(locateEndAnchor(node, "teleport start", "teleport end")) : /* @__PURE__ */ _next(node);
+function nextLogicalSibling(node) {
+	return isComment(node, "[") ? locateEndAnchor(node).nextSibling : isComment(node, "teleport start") ? locateEndAnchor(node, "teleport start", "teleport end").nextSibling : node.nextSibling;
 }
 function locateHydrationNodeImpl(consumeFragmentStart = false) {
 	let node;
@@ -10287,18 +10291,15 @@ function locateHydrationBoundaryClose(node, closeHint = null) {
 	let close = closeHint;
 	if (!close || !isComment(close, "]")) if (isComment(node, "]")) close = node;
 	else {
-		let candidate = locateNextNode(node);
-		while (candidate && !isComment(candidate, "]")) candidate = locateNextNode(candidate);
+		let candidate = nextLogicalSibling(node);
+		while (candidate && !isComment(candidate, "]")) candidate = nextLogicalSibling(candidate);
 		close = candidate;
 	}
 	if (!close) return node;
 	return close;
 }
-function handleMismatch(node, template) {
-	if (!isMismatchAllowed(node.parentElement, 1)) {
-		warn(`Hydration node mismatch:\n- rendered on server:`, node, node.nodeType === 3 ? `(text)` : isComment(node, "[[") ? `(start of block node)` : ``, `\n- expected on client:`, template);
-		logMismatchError();
-	}
+function handleMismatch(node, template, adoptChildren, ns) {
+	warnHydrationNodeMismatch(node, template);
 	if (isComment(node, "[")) removeFragmentNodes(node);
 	const shouldPreserveAnchor = isHydrationAnchor(node);
 	const container = /* @__PURE__ */ parentNode(node);
@@ -10306,17 +10307,46 @@ function handleMismatch(node, template) {
 	if (!shouldPreserveAnchor) remove(node, container);
 	if (template[0] !== "<") return container.insertBefore(/* @__PURE__ */ createTextNode(template), next);
 	const t = /* @__PURE__ */ createElement("template");
-	t.innerHTML = template;
-	const newNode = (/* @__PURE__ */ _child(t.content)).cloneNode(true);
-	if (node.nodeType === 1) {
-		newNode.innerHTML = node.innerHTML;
-		Array.from(node.attributes).forEach((attr) => {
-			newNode.setAttribute(attr.name, attr.value);
-		});
+	let newNode;
+	if (ns) {
+		const tag = ns === 1 ? "svg" : "math";
+		t.innerHTML = `<${tag}>${template}</${tag}>`;
+		newNode = (/* @__PURE__ */ _child(/* @__PURE__ */ _child(t.content))).cloneNode(true);
+	} else {
+		t.innerHTML = template;
+		newNode = (/* @__PURE__ */ _child(t.content)).cloneNode(true);
+	}
+	if (adoptChildren && node.nodeType === 1 && !newNode.firstChild) {
+		let child = node.firstChild;
+		while (child) {
+			const nextChild = child.nextSibling;
+			newNode.appendChild(child);
+			child = nextChild;
+		}
 	}
 	container.insertBefore(newNode, next);
 	return newNode;
 }
+function validateHydrationTarget(node, template) {
+	let expectedType;
+	if (template[0] !== "<") expectedType = 3;
+	else if (template[1] === "!") expectedType = 8;
+	else expectedType = 1;
+	if (node.nodeType !== expectedType) {
+		warnHydrationNodeMismatch(node, template);
+		return;
+	}
+	if (expectedType !== 1) return;
+	const match = START_TAG_RE.exec(template);
+	const expectedTag = match && match[1];
+	if (expectedTag && node.tagName.toLowerCase() !== expectedTag.toLowerCase()) warnHydrationNodeMismatch(node, template);
+}
+function warnHydrationNodeMismatch(node, expected) {
+	if (!isMismatchAllowed(node.parentElement, 1)) {
+		warn(`Hydration node mismatch:\n- rendered on server:`, node, node.nodeType === 3 ? `(text)` : isComment(node, "[[") ? `(start of block node)` : ``, `\n- expected on client:`, expected);
+		logMismatchError();
+	}
+}
 let hasLoggedMismatchError = false;
 const logMismatchError = () => {
 	if (hasLoggedMismatchError) return;
@@ -10358,7 +10388,7 @@ function cleanupHydrationTail(node, container) {
 	}
 	let current = node;
 	while (current && current.parentNode === container) {
-		const next = locateNextNode(current);
+		const next = nextLogicalSibling(current);
 		removeHydrationNode(current);
 		current = next;
 	}
@@ -10389,7 +10419,7 @@ function finalizeHydrationBoundary(close) {
 	let hasRemovableNode = false;
 	while (cur && cur !== close) {
 		if (!isHydrationAnchor(cur)) hasRemovableNode = true;
-		cur = locateNextNode(cur);
+		cur = nextLogicalSibling(cur);
 	}
 	if (!cur) return;
 	if (!hasRemovableNode) {
@@ -10398,7 +10428,7 @@ function finalizeHydrationBoundary(close) {
 	}
 	warnHydrationChildrenMismatch(close.parentElement);
 	while (node && node !== close) {
-		const next = locateNextNode(node);
+		const next = nextLogicalSibling(node);
 		if (!isHydrationAnchor(node)) removeHydrationNode(node, close);
 		node = next;
 	}
@@ -10481,7 +10511,7 @@ function locateChildByLogicalIndex(parent, logicalIndex) {
 			child.$idx = logicalIndex;
 			return parent.$llc = child;
 		}
-		child = isComment(child, "[") ? locateEndAnchor(child).nextSibling : child.nextSibling;
+		child = nextLogicalSibling(child);
 		fromIndex++;
 	}
 	return null;
@@ -10535,6 +10565,66 @@ function propGetter(rawProps, key) {
 	return rawProps[key] && resolveSource(rawProps[key]);
 }
 //#endregion
+//#region packages/runtime-vapor/src/renderEffect.ts
+var RenderEffect = class extends ReactiveEffect {
+	constructor(render, noLifecycle = false) {
+		super(noLifecycle ? render : void 0);
+		this.render = render;
+		const instance = currentInstance;
+		if (!this.subs && !isVaporComponent(instance)) warn("renderEffect called without active EffectScope or Vapor instance.");
+		const job = () => {
+			if (this.dirty) this.run();
+		};
+		if (instance) {
+			if (!noLifecycle) {
+				this.onTrack = instance.rtc ? (e) => invokeArrayFns(instance.rtc, e) : void 0;
+				this.onTrigger = instance.rtg ? (e) => invokeArrayFns(instance.rtg, e) : void 0;
+			}
+			if (instance.type.ce) (instance.renderEffects || (instance.renderEffects = [])).push(this);
+			job.i = instance;
+		}
+		this.job = job;
+		this.i = instance;
+		this.flags |= 128;
+		this.job.flags |= 2;
+	}
+	fn() {
+		const instance = this.i;
+		const scope = this.subs ? this.subs.sub : void 0;
+		const hasUpdateHooks = instance && (instance.bu || instance.u);
+		if (instance) startMeasure(instance, `renderEffect`);
+		const prev = setCurrentInstance(instance, scope);
+		try {
+			if (hasUpdateHooks && instance.isMounted && !instance.isUpdating) {
+				instance.isUpdating = true;
+				try {
+					instance.bu && invokeArrayFns(instance.bu);
+					this.render();
+				} catch (err) {
+					instance.isUpdating = false;
+					throw err;
+				}
+				let updateJob = this.updateJob;
+				if (!updateJob) updateJob = this.updateJob = () => {
+					instance.isUpdating = false;
+					instance.u && invokeArrayFns(instance.u);
+				};
+				queuePostFlushCb(updateJob);
+			} else this.render();
+		} finally {
+			setCurrentInstance(...prev);
+			if (instance) endMeasure(instance, `renderEffect`);
+		}
+	}
+	notify() {
+		if (!(this.flags & 256)) queueJob(this.job, this.i ? this.i.uid : void 0);
+	}
+};
+function renderEffect(fn, noLifecycle = false) {
+	if (inOnceSlot) return fn();
+	new RenderEffect(fn, noLifecycle).run();
+}
+//#endregion
 //#region packages/runtime-vapor/src/componentProps.ts
 function resolveSource(source) {
 	return isFunction(source) ? resolveFunctionSource(source) : source;
@@ -10556,6 +10646,30 @@ function resolveFunctionSource(source) {
 	}
 	return source();
 }
+function snapshotRawProps(rawProps) {
+	const snapshot = Object.create(null);
+	for (const key in rawProps) if (key !== "$") snapshot[key] = resolveSource(rawProps[key]);
+	const dynamicSources = rawProps.$;
+	if (dynamicSources) {
+		const snapshotSources = [];
+		for (let i = 0; i < dynamicSources.length; i++) {
+			const source = dynamicSources[i];
+			const value = Object.create(null);
+			if (isFunction(source)) {
+				const resolved = resolveFunctionSource(source);
+				for (const key in resolved) value[key] = resolved[key];
+				snapshotSources[i] = () => value;
+			} else {
+				for (const key in source) value[key] = resolveSource(source[key]);
+				snapshotSources[i] = value;
+			}
+		}
+		const symbols = Object.getOwnPropertySymbols(dynamicSources);
+		for (let i = 0; i < symbols.length; i++) snapshotSources[symbols[i]] = dynamicSources[symbols[i]];
+		snapshot.$ = snapshotSources;
+	}
+	return snapshot;
+}
 function stabilizeDynamicSourceValue(oldValue, value) {
 	if (!isPlainObject(oldValue) || !isPlainObject(value)) return value;
 	const oldKeys = Object.keys(oldValue);
@@ -10567,7 +10681,7 @@ function stabilizeDynamicSourceValue(oldValue, value) {
 	}
 	return oldValue;
 }
-function getPropsProxyHandlers(comp, once) {
+function getPropsProxyHandlers(comp) {
 	if (comp.__propsHandlers) return comp.__propsHandlers;
 	const propsOptions = normalizePropsOptions(comp)[0];
 	const emitsOptions = normalizeEmitsOptions(comp);
@@ -10585,7 +10699,7 @@ function getPropsProxyHandlers(comp, once) {
 				source = dynamicSources[i];
 				isDynamic = isFunction(source);
 				source = isDynamic ? resolveFunctionSource(source) : source;
-				for (rawKey in source) if (camelize(rawKey) === key) return resolvePropValue(propsOptions, key, isDynamic ? source[rawKey] : resolveFunctionSource(source[rawKey]), instance, resolveDefault);
+				for (rawKey in source) if (camelize(rawKey) === key) return resolvePropValue(propsOptions, key, isDynamic ? source[rawKey] : resolveSource(source[rawKey]), instance, resolveDefault);
 			}
 		}
 		for (const rawKey in rawProps) if (camelize(rawKey) === key) return resolvePropValue(propsOptions, key, resolveSource(rawProps[rawKey]), instance, resolveDefault);
@@ -10593,8 +10707,8 @@ function getPropsProxyHandlers(comp, once) {
 	};
 	const withOnceCache = (getter) => {
 		return ((instance, key) => {
-			const cache = instance.oncePropsCache || (instance.oncePropsCache = {});
-			if (!(key in cache)) {
+			const cache = instance.oncePropsCache || (instance.oncePropsCache = Object.create(null));
+			if (!hasOwn(cache, key)) {
 				pauseTracking();
 				try {
 					cache[key] = getter(instance, key);
@@ -10606,15 +10720,16 @@ function getPropsProxyHandlers(comp, once) {
 		});
 	};
 	const getOnceProp = withOnceCache(getProp);
+	const getMaybeOnceProp = (instance, key) => (instance.isOnce ? getOnceProp : getProp)(instance, key);
 	const propsHandlers = propsOptions ? {
-		get: (target, key) => (once ? getOnceProp : getProp)(target, key),
+		get: getMaybeOnceProp,
 		has: (_, key) => isProp(key),
 		ownKeys: () => Object.keys(propsOptions),
 		getOwnPropertyDescriptor(target, key) {
 			if (isProp(key)) return {
 				configurable: true,
 				enumerable: true,
-				get: () => (once ? getOnceProp : getProp)(target, key)
+				get: () => getMaybeOnceProp(target, key)
 			};
 		}
 	} : null;
@@ -10630,15 +10745,36 @@ function getPropsProxyHandlers(comp, once) {
 		else return false;
 	};
 	const getOnceAttr = withOnceCache((instance, key) => getAttr(instance.rawProps, key));
+	const onceAttrKeys = Symbol();
+	const getAttrKeys = (target) => getKeysFromRawProps(target.rawProps).filter(isAttr);
+	const getOnceAttrKeys = (target) => {
+		const cache = target.oncePropsCache || (target.oncePropsCache = Object.create(null));
+		if (!hasOwn(cache, onceAttrKeys)) {
+			pauseTracking();
+			try {
+				const keys = getAttrKeys(target);
+				cache[onceAttrKeys] = keys;
+				for (let i = 0; i < keys.length; i++) {
+					const key = keys[i];
+					if (!hasOwn(cache, key)) cache[key] = getAttr(target.rawProps, key);
+				}
+			} finally {
+				resetTracking();
+			}
+		}
+		return cache[onceAttrKeys];
+	};
+	const getMaybeOnceAttrKeys = (target) => target.isOnce ? getOnceAttrKeys(target) : getAttrKeys(target);
+	const getMaybeOnceAttr = (instance, key) => instance.isOnce ? getOnceAttrKeys(instance).includes(key) ? getOnceAttr(instance, key) : void 0 : getAttr(instance.rawProps, key);
 	const attrsHandlers = {
-		get: (target, key) => once ? getOnceAttr(target, key) : getAttr(target.rawProps, key),
-		has: (target, key) => hasAttr(target.rawProps, key),
-		ownKeys: (target) => getKeysFromRawProps(target.rawProps).filter(isAttr),
+		get: getMaybeOnceAttr,
+		has: (target, key) => target.isOnce ? getOnceAttrKeys(target).includes(key) : hasAttr(target.rawProps, key),
+		ownKeys: getMaybeOnceAttrKeys,
 		getOwnPropertyDescriptor(target, key) {
-			if (isString(key) && hasAttr(target.rawProps, key)) return {
+			if (isString(key) && (target.isOnce ? getOnceAttrKeys(target).includes(key) : hasAttr(target.rawProps, key))) return {
 				configurable: true,
 				enumerable: true,
-				get: () => once ? getOnceAttr(target, key) : getAttr(target.rawProps, key)
+				get: () => getMaybeOnceAttr(target, key)
 			};
 		}
 	};
@@ -10660,7 +10796,7 @@ function getAttrFromRawProps(rawProps, key) {
 			isDynamic = isFunction(source);
 			source = isDynamic ? resolveFunctionSource(source) : source;
 			if (source && hasOwn(source, key)) {
-				const value = isDynamic ? source[key] : resolveFunctionSource(source[key]);
+				const value = isDynamic ? source[key] : resolveSource(source[key]);
 				if (merged) merged.push(value);
 				else return value;
 			}
@@ -10742,7 +10878,7 @@ function resolveDynamicProps(props) {
 		const isDynamic = isFunction(source);
 		const resolved = isDynamic ? resolveFunctionSource(source) : source;
 		for (const key in resolved) {
-			const value = isDynamic ? resolved[key] : resolveFunctionSource(source[key]);
+			const value = isDynamic ? resolved[key] : resolveSource(source[key]);
 			if (key === "class" || key === "style") {
 				const existing = mergedRawProps[key];
 				if (isArray(existing)) existing.push(value);
@@ -10782,18 +10918,23 @@ function on(el, event, handler, options = {}) {
 	if (isArray(handler)) handler.forEach((fn) => on(el, event, fn, options));
 	else {
 		if (!handler) return;
-		addEventListener(el, event, handler, options);
-		if (options.effect) onEffectCleanup(() => {
-			el.removeEventListener(event, handler, options);
-		});
+		addEventListener(el, event, createInvoker(handler), options);
+	}
+}
+function onBinding(el, event, handler, options = {}) {
+	if (isArray(handler)) handler.forEach((fn) => onBinding(el, event, fn, options));
+	else {
+		if (!handler) return;
+		onEffectCleanup(addEventListener(el, event, createInvoker(handler), options));
 	}
 }
 function delegate(el, event, handler) {
 	const key = `$evt${event}`;
 	const existing = el[key];
-	if (existing) if (isArray(existing)) existing.push(handler);
-	else el[key] = [existing, handler];
-	else el[key] = handler;
+	const invoker = createInvoker(handler);
+	if (existing) if (isArray(existing)) existing.push(invoker);
+	else el[key] = [existing, invoker];
+	else el[key] = invoker;
 }
 /**
 * Event delegation borrowed from solid
@@ -10832,7 +10973,13 @@ const delegatedEventHandler = (e) => {
 	}
 };
 function setDynamicEvents(el, events) {
-	for (const name in events) on(el, name, events[name], { effect: true });
+	for (const name in events) onBinding(el, name, events[name]);
+}
+function withVaporModifiers(fn, modifiers) {
+	return createInvoker(typeof fn === "function" ? withModifiers(fn, modifiers) : fn);
+}
+function withVaporKeys(fn, modifiers) {
+	return createInvoker(typeof fn === "function" ? withKeys(fn, modifiers) : fn);
 }
 function createInvoker(handler) {
 	const i = currentInstance;
@@ -10840,13 +10987,16 @@ function createInvoker(handler) {
 }
 //#endregion
 //#region packages/runtime-vapor/src/dom/prop.ts
-const hasFallthroughKey = (key) => currentInstance.hasFallthrough && key in currentInstance.attrs;
+const shouldSkipFallthroughKey = (el, key) => {
+	const instance = currentInstance;
+	return !isApplyingFallthroughProps && el.$root && instance.hasFallthrough && instance.type.inheritAttrs !== false && key in instance.attrs;
+};
 function setProp(el, key, value) {
 	if (key in el) setDOMProp(el, key, value);
 	else setAttr(el, key, value);
 }
 function setAttr(el, key, value, isSVG = false) {
-	if (!isApplyingFallthroughProps && el.$root && hasFallthroughKey(key)) return;
+	if (shouldSkipFallthroughKey(el, key)) return;
 	if (key === "true-value") el._trueValue = value;
 	else if (key === "false-value") el._falseValue = value;
 	if (isHydrating$1 && !attributeHasMismatch(el, key, value)) {
@@ -10862,7 +11012,7 @@ function setAttr(el, key, value, isSVG = false) {
 	}
 }
 function setDOMProp(el, key, value, forceHydrate = false, attrName) {
-	if (!isApplyingFallthroughProps && el.$root && hasFallthroughKey(key)) return;
+	if (shouldSkipFallthroughKey(el, key)) return;
 	if (isHydrating$1 && !attributeHasMismatch(el, key, value) && !shouldForceHydrate(el, key) && !forceHydrate) return;
 	const prev = el[key];
 	if (value === prev) return;
@@ -10980,7 +11130,7 @@ function setStyleIncremental(el, value) {
 	patchStyle(el, el[cacheKey], el[cacheKey] = normalizedValue);
 }
 function setValue(el, value, forceHydrate = false) {
-	if (!isApplyingFallthroughProps && el.$root && hasFallthroughKey("value")) return;
+	if (shouldSkipFallthroughKey(el, "value")) return;
 	el._value = value;
 	if (isHydrating$1 && !attributeHasMismatch(el, "value", getClientText(el, value)) && !shouldForceHydrate(el, "value") && !forceHydrate) return;
 	const oldValue = el.tagName === "OPTION" ? el.getAttribute("value") : el.value;
@@ -11081,8 +11231,10 @@ function setDynamicProp(el, key, value, isSVG = false) {
 	let forceHydrate = false;
 	if (key === "class") setClass(el, value, isSVG);
 	else if (key === "style") setStyle(el, value);
-	else if (isOn(key)) on(el, key[2].toLowerCase() + key.slice(3), value, { effect: true });
-	else if ((forceHydrate = key[0] === ".") ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, value, isSVG)) if (key === "innerHTML") setHtml(el, value);
+	else if (isOn(key)) {
+		if (shouldSkipFallthroughKey(el, key)) return;
+		onBinding(el, key[2].toLowerCase() + key.slice(3), value);
+	} else if ((forceHydrate = key[0] === ".") ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, value, isSVG)) if (key === "innerHTML") setHtml(el, value);
 	else if (key === "textContent") setElementText(el, value);
 	else if (key === "value" && canSetValueDirectly(el.tagName)) setValue(el, value, forceHydrate);
 	else setDOMProp(el, key, value, forceHydrate);
@@ -11115,9 +11267,10 @@ function classHasMismatch(el, expected, isIncremental) {
 		if (expected) hasMismatch = Array.from(expectedClassSet).some((cls) => !actualClassSet.has(cls));
 	} else hasMismatch = !isSetEqual(actualClassSet, expectedClassSet);
 	if (hasMismatch) {
-		warnPropMismatch(el, "class", 2, actual, expected);
-		logMismatchError();
-		return true;
+		if (warnPropMismatch(el, "class", 2, actual, expected)) {
+			logMismatchError();
+			return true;
+		}
 	}
 	return false;
 }
@@ -11133,9 +11286,10 @@ function styleHasMismatch(el, value, normalizedValue, isIncremental, instance =
 		if (expected) hasMismatch = Array.from(expectedStyleMap.entries()).some(([key, val]) => actualStyleMap.get(key) !== val);
 	} else hasMismatch = !isMapEqual(actualStyleMap, expectedStyleMap);
 	if (hasMismatch) {
-		warnPropMismatch(el, "style", 3, actual, expected);
-		logMismatchError();
-		return true;
+		if (warnPropMismatch(el, "style", 3, actual, expected)) {
+			logMismatchError();
+			return true;
+		}
 	}
 	return false;
 }
@@ -11158,9 +11312,10 @@ function attributeHasMismatch(el, key, value) {
 	if (isValidHtmlOrSvgAttribute(el, key)) {
 		const { actual, expected } = getAttributeMismatch(el, key, value);
 		if (actual !== expected) {
-			warnPropMismatch(el, key, 4, actual, expected);
-			logMismatchError();
-			return true;
+			if (warnPropMismatch(el, key, 4, actual, expected)) {
+				logMismatchError();
+				return true;
+			}
 		}
 	}
 	return false;
@@ -11203,6 +11358,15 @@ function setComponentScopeId(instance) {
 * When true, renderEffect should skip creating reactive effect.
 */
 let inOnceSlot = false;
+function withOnceSlot(fn, value = true) {
+	const prev = inOnceSlot;
+	try {
+		inOnceSlot = value;
+		return fn();
+	} finally {
+		inOnceSlot = prev;
+	}
+}
 /**
 * Current slot scopeIds for vdom interop
 */
@@ -11300,7 +11464,7 @@ function withVaporCtx(fn) {
 		}
 	};
 }
-function createSlot(name, rawProps, fallback, noSlotted, once) {
+function createSlot(name = "default", rawProps, fallback, flags = 0) {
 	if (isInteropEnabled && isCollectingVdomSlotVNodes) return;
 	const _insertionParent = insertionParent;
 	const _insertionAnchor = insertionAnchor;
@@ -11308,13 +11472,18 @@ function createSlot(name, rawProps, fallback, noSlotted, once) {
 	let hydrationCursor = null;
 	const instance = getScopeOwner();
 	const rawSlots = instance.rawSlots;
-	const slotProps = rawProps ? new Proxy(rawProps, rawPropsProxyHandlers) : EMPTY_OBJ;
-	const scopeId = !noSlotted && instance.type.__scopeId;
+	const scopeId = !(flags & 1) && instance.type.__scopeId;
 	const slotScopeIds = scopeId ? [`${scopeId}-s`] : null;
+	const once = !!(flags & 2);
+	const slotProps = rawProps ? new Proxy(once ? snapshotRawProps(rawProps) : rawProps, rawPropsProxyHandlers) : EMPTY_OBJ;
+	if (once && fallback) {
+		const originalFallback = fallback;
+		fallback = (...args) => withOnceSlot(() => originalFallback(...args));
+	}
 	let fragment;
 	if (/* @__PURE__ */ isRef(rawSlots._) && isInteropEnabled) {
 		if (isHydrating$1) hydrationCursor = enterHydrationCursor();
-		fragment = instance.appContext.vapor.vdomSlot(rawSlots._, name, slotProps, instance, fallback);
+		fragment = instance.appContext.vapor.vdomSlot(rawSlots._, name, slotProps, instance, fallback, once);
 	} else {
 		if (isHydrating$1) hydrationCursor = captureHydrationCursor();
 		const slotFragment = fragment = new SlotFragment();
@@ -11324,9 +11493,11 @@ function createSlot(name, rawProps, fallback, noSlotted, once) {
 			const slotName = isFunction(name) ? name() : name;
 			if (instance.ce || instance.parent && isAsyncWrapper(instance.parent) && instance.parent.ce) {
 				const el = /* @__PURE__ */ createElement("slot");
-				renderEffect(() => {
+				const setSlotProps = () => {
 					setDynamicProps(el, [slotProps, slotName !== "default" ? { name: slotName } : {}]);
-				});
+				};
+				if (once) setSlotProps();
+				else renderEffect(setSlotProps);
 				if (fallback) withOwnedSlotBoundary(slotFragment.parentSlotBoundary, () => {
 					const fallbackBlock = fallback();
 					slotFragment.customElementFallback = fallbackBlock;
@@ -11346,12 +11517,9 @@ function createSlot(name, rawProps, fallback, noSlotted, once) {
 				cachedSlot = slot;
 				cachedBoundSlot = () => {
 					const prevSlotScopeIds = setCurrentSlotScopeIds(slotScopeIds);
-					const prev = inOnceSlot;
 					try {
-						if (once) inOnceSlot = true;
-						return slot(slotProps);
+						return once ? withOnceSlot(() => slot(slotProps)) : slot(slotProps);
 					} finally {
-						inOnceSlot = prev;
 						setCurrentSlotScopeIds(prevSlotScopeIds);
 					}
 				};
@@ -11371,65 +11539,6 @@ function createSlot(name, rawProps, fallback, noSlotted, once) {
 	return fragment;
 }
 //#endregion
-//#region packages/runtime-vapor/src/renderEffect.ts
-var RenderEffect = class extends ReactiveEffect {
-	constructor(render) {
-		super();
-		this.render = render;
-		const instance = currentInstance;
-		if (!this.subs && !isVaporComponent(instance)) warn("renderEffect called without active EffectScope or Vapor instance.");
-		const job = () => {
-			if (this.dirty) this.run();
-		};
-		this.updateJob = () => {
-			instance.isUpdating = false;
-			instance.u && invokeArrayFns(instance.u);
-		};
-		if (instance) {
-			this.onTrack = instance.rtc ? (e) => invokeArrayFns(instance.rtc, e) : void 0;
-			this.onTrigger = instance.rtg ? (e) => invokeArrayFns(instance.rtg, e) : void 0;
-			if (instance.type.ce) (instance.renderEffects || (instance.renderEffects = [])).push(this);
-			job.i = instance;
-		}
-		this.job = job;
-		this.i = instance;
-		this.flags |= 128;
-		this.job.flags |= 2;
-	}
-	fn() {
-		const instance = this.i;
-		const scope = this.subs ? this.subs.sub : void 0;
-		const hasUpdateHooks = instance && (instance.bu || instance.u);
-		if (instance) startMeasure(instance, `renderEffect`);
-		const prev = setCurrentInstance(instance, scope);
-		try {
-			if (hasUpdateHooks && instance.isMounted && !instance.isUpdating) {
-				instance.isUpdating = true;
-				try {
-					instance.bu && invokeArrayFns(instance.bu);
-					this.render();
-				} catch (err) {
-					instance.isUpdating = false;
-					throw err;
-				}
-				queuePostFlushCb(this.updateJob);
-			} else this.render();
-		} finally {
-			setCurrentInstance(...prev);
-			if (instance) endMeasure(instance, `renderEffect`);
-		}
-	}
-	notify() {
-		if (!(this.flags & 256)) queueJob(this.job, this.i ? this.i.uid : void 0);
-	}
-};
-function renderEffect(fn, noLifecycle = false) {
-	if (inOnceSlot) return fn();
-	const effect = new RenderEffect(fn);
-	if (noLifecycle) effect.fn = fn;
-	effect.run();
-}
-//#endregion
 //#region packages/runtime-vapor/src/keepAlive.ts
 let isKeepAliveEnabled = false;
 let currentKeepAliveCtx = null;
@@ -11489,9 +11598,9 @@ function isVaporTransition(component) {
 }
 //#endregion
 //#region packages/runtime-vapor/src/fragment.ts
+const EMPTY_BLOCK = EMPTY_ARR;
 var VaporFragment = class {
 	constructor(nodes) {
-		this.vnode = null;
 		this.renderInstance = currentInstance;
 		this.slotOwner = currentSlotOwner;
 		this.inheritedSlotBoundary = currentSlotBoundary;
@@ -11500,9 +11609,15 @@ var VaporFragment = class {
 	}
 	runWithRenderCtx(fn, scope) {
 		const prevInstance = setCurrentInstance(this.renderInstance, scope);
+		const keepAliveCtx = isKeepAliveEnabled ? this.keepAliveCtx || null : null;
+		if (currentSlotOwner === this.slotOwner && currentSlotBoundary === this.inheritedSlotBoundary && (!isKeepAliveEnabled || currentKeepAliveCtx === keepAliveCtx)) try {
+			return fn();
+		} finally {
+			setCurrentInstance(...prevInstance);
+		}
 		const prevSlotOwner = setCurrentSlotOwner(this.slotOwner);
 		let prevKeepAliveCtx = null;
-		if (isKeepAliveEnabled) prevKeepAliveCtx = setCurrentKeepAliveCtx(this.keepAliveCtx || null);
+		if (isKeepAliveEnabled) prevKeepAliveCtx = setCurrentKeepAliveCtx(keepAliveCtx);
 		const prevBoundary = setCurrentSlotBoundary(this.inheritedSlotBoundary);
 		try {
 			return fn();
@@ -11534,10 +11649,12 @@ var ForBlock = class extends VaporFragment {
 	}
 };
 function getDynamicCloseOwner(isSlot, forwardedSlot, anchorLabel, nodes, currentSlotEndAnchor) {
-	const valid = isValidBlock(nodes);
-	if (isSlot) return !forwardedSlot || valid ? 1 : 3;
+	if (isSlot) {
+		if (!forwardedSlot) return 1;
+		return isValidBlock(nodes) ? 1 : 3;
+	}
 	if (anchorLabel === "if" && isArray(nodes) && nodes.length > 1) return 1;
-	if (anchorLabel === "if" && !valid && currentSlotEndAnchor && isHydratingSlotFallbackActive()) return 2;
+	if (anchorLabel === "if" && currentSlotEndAnchor && isHydratingSlotFallbackActive() && !isValidBlock(nodes)) return 2;
 	return 0;
 }
 function queueAnchorInsert(parentNode$1, nextNode, createAnchor) {
@@ -11547,110 +11664,9 @@ function queueAnchorInsert(parentNode$1, nextNode, createAnchor) {
 	});
 }
 var DynamicFragment = class extends VaporFragment {
-	constructor(anchorLabel, keyed = false, locate = true) {
-		super([]);
-		this.hydrate = (isEmpty = false, isSlot = false) => {
-			if (!isHydrating$1) return;
-			let advanceAfterRestore = null;
-			let exitHydrationBoundary;
-			const reuseAnchor = (anchor) => {
-				this.anchor = markHydrationAnchor(anchor);
-				if (currentHydrationNode === this.anchor) advanceHydrationNode(this.anchor);
-				else {
-					exitHydrationBoundary = enterHydrationBoundary(this.anchor);
-					advanceAfterRestore = this.anchor;
-				}
-			};
-			const createRuntimeAnchor = () => this.anchor = markHydrationAnchor(/* @__PURE__ */ createComment(this.anchorLabel));
-			const cleanupAndInsertRuntimeAnchor = (parentNode, nextNode, cleanupStart, cleanupUntil) => {
-				if (cleanupUntil) exitHydrationBoundary = enterHydrationBoundary(cleanupUntil);
-				else {
-					cleanupHydrationTail(cleanupStart);
-					setCurrentHydrationNode(null);
-				}
-				queueAnchorInsert(parentNode, nextNode, createRuntimeAnchor);
-			};
-			try {
-				if (isEmpty) {
-					if (isComment(currentHydrationNode, "")) {
-						reuseAnchor(currentHydrationNode);
-						return;
-					}
-					if (this.anchorLabel && currentHydrationNode && isComment(currentHydrationNode, "teleport anchor")) {
-						const parentNode$2 = /* @__PURE__ */ parentNode(currentHydrationNode);
-						const anchor = markHydrationAnchor(currentHydrationNode);
-						if (parentNode$2) {
-							queueAnchorInsert(parentNode$2, anchor, createRuntimeAnchor);
-							return;
-						}
-					}
-					if (!isSlot && this.anchorLabel && currentHydrationNode && !isHydratingSlotFallbackActive() && !isComment(currentHydrationNode, "]")) {
-						const parentNode$4 = /* @__PURE__ */ parentNode(currentHydrationNode);
-						const anchor = locateNextNode(currentHydrationNode);
-						const reusableAnchor = anchor && anchor.nodeType === 8 && isReusableDynamicFragmentAnchor(anchor, this.anchorLabel) && /* @__PURE__ */ parentNode(anchor) ? anchor : null;
-						if (parentNode$4) {
-							this.nodes = [];
-							if (reusableAnchor) reuseAnchor(reusableAnchor);
-							else cleanupAndInsertRuntimeAnchor(parentNode$4, anchor, currentHydrationNode, anchor);
-							return;
-						}
-					}
-				}
-				if (this.anchorLabel && !isValidBlock(this.nodes) && this.nodes instanceof Comment && isReusableDynamicFragmentAnchor(this.nodes, this.anchorLabel) && /* @__PURE__ */ parentNode(this.nodes)) {
-					const anchor = this.nodes;
-					this.nodes = [];
-					reuseAnchor(anchor);
-					return;
-				}
-				if (this.anchorLabel && !isValidBlock(this.nodes) && this.nodes instanceof Comment && !/* @__PURE__ */ parentNode(this.nodes) && currentHydrationNode) {
-					const parentNode$5 = /* @__PURE__ */ parentNode(currentHydrationNode);
-					const nextNode = locateNextNode(currentHydrationNode);
-					if (parentNode$5) {
-						this.nodes = [];
-						cleanupAndInsertRuntimeAnchor(parentNode$5, nextNode, currentHydrationNode, nextNode);
-						return;
-					}
-				}
-				const currentSlotEndAnchor = getCurrentSlotEndAnchor();
-				const forwardedSlot = this.forwarded;
-				const slotAnchor = isSlot ? currentSlotEndAnchor : null;
-				const closeOwner = getDynamicCloseOwner(isSlot, forwardedSlot, this.anchorLabel, this.nodes, currentSlotEndAnchor);
-				if (closeOwner === 1) {
-					const anchor = locateHydrationBoundaryClose(slotAnchor || currentHydrationNode, slotAnchor || null);
-					if (isComment(anchor, "]")) {
-						reuseAnchor(anchor);
-						return;
-					} else throw new Error(`Failed to locate ${this.anchorLabel} fragment anchor. this is likely a Vue internal bug.`);
-				} else if (closeOwner === 3 && currentSlotEndAnchor) {
-					const anchor = markHydrationAnchor(currentSlotEndAnchor);
-					queueAnchorInsert(anchor.parentNode, anchor.nextSibling, createRuntimeAnchor);
-					return;
-				} else if (closeOwner === 2 && currentSlotEndAnchor) {
-					const endAnchor = currentSlotEndAnchor;
-					queuePostFlushCb(() => {
-						const parentNode$6 = /* @__PURE__ */ parentNode(endAnchor);
-						if (!parentNode$6) return;
-						parentNode$6.insertBefore(createRuntimeAnchor(), endAnchor);
-					});
-					return;
-				}
-				let parentNode$3;
-				let nextNode;
-				if (this.anchorLabel === "if" && !isValidBlock(this.nodes) && currentSlotEndAnchor && currentHydrationNode === currentSlotEndAnchor) {
-					parentNode$3 = currentSlotEndAnchor.parentNode;
-					nextNode = currentSlotEndAnchor;
-				} else {
-					const node = findBlockNode(this.nodes);
-					parentNode$3 = node.parentNode;
-					nextNode = node.nextNode;
-				}
-				queueAnchorInsert(parentNode$3, nextNode, createRuntimeAnchor);
-			} finally {
-				exitHydrationBoundary && exitHydrationBoundary();
-				if (advanceAfterRestore && currentHydrationNode === advanceAfterRestore) advanceHydrationNode(advanceAfterRestore);
-			}
-		};
-		this.keyed = keyed;
+	constructor(anchorLabel, keyed = false, locate = true, trackSlotBoundary = true) {
+		super(EMPTY_BLOCK);
+		if (keyed) this.keyed = true;
 		if (isTransitionEnabled && currentInstance && isVaporTransition(currentInstance.type)) this.inTransition = true;
 		if (isHydrating$1) {
 			this.anchorLabel = anchorLabel;
@@ -11659,14 +11675,9 @@ var DynamicFragment = class extends VaporFragment {
 			this.anchor = anchorLabel ? /* @__PURE__ */ createComment(anchorLabel) : /* @__PURE__ */ createTextNode();
 			this.anchorLabel = anchorLabel;
 		}
-		this.registerSlotBoundaryDirty();
-	}
-	registerSlotBoundaryDirty() {
-		const boundary = this.inheritedSlotBoundary;
-		if (!boundary) return;
-		(this.onUpdated || (this.onUpdated = [])).push(() => boundary.markDirty());
+		if (trackSlotBoundary) trackSlotBoundaryDirtying(this);
 	}
-	update(render, key = render) {
+	update(render, key = render, noScope = false) {
 		if (key === this.current) {
 			if (isHydrating$1 && this.anchorLabel !== "slot") this.hydrate(true);
 			return;
@@ -11674,28 +11685,29 @@ var DynamicFragment = class extends VaporFragment {
 		const transition = isTransitionEnabled ? this.$transition : void 0;
 		if (transition && transition.state.isLeaving) {
 			this.current = key;
-			this.pending = {
+			const pending = this.pending;
+			if (pending) {
+				pending.render = render;
+				pending.key = key;
+				pending.noScope = noScope;
+			} else this.pending = {
 				render,
-				key
+				key,
+				noScope
 			};
 			return;
 		}
 		const instance = currentInstance;
 		const prevSub = setActiveSub();
 		const parent = isHydrating$1 ? null : this.anchor.parentNode;
-		if (this.scope) {
-			if (isKeepAliveEnabled) {
+		if (this.current !== void 0) {
+			const scope = this.scope;
+			if (scope) {
 				let retainScope = false;
-				const keepAliveCtx = this.keepAliveCtx;
-				if (keepAliveCtx) {
-					const cacheKey = this.keyed ? withCurrentCacheKey(this.current, () => keepAliveCtx.processShapeFlag(this.nodes)) : keepAliveCtx.processShapeFlag(this.nodes);
-					if (cacheKey !== false) {
-						keepAliveCtx.cacheScope(cacheKey, this.current, this.scope);
-						retainScope = true;
-					}
-				}
-				if (!retainScope) this.scope.stop();
-			} else this.scope.stop();
+				const onBeforeRemove = this.onBeforeRemove;
+				if (onBeforeRemove) for (let i = 0; i < onBeforeRemove.length; i++) retainScope = onBeforeRemove[i](scope) || retainScope;
+				if (!retainScope) scope.stop();
+			}
 			const mode = transition && transition.mode;
 			if (mode && (mode !== "in-out" || mode === "in-out" && render) && (mode !== "out-in" || isValidBlock(this.nodes))) {
 				applyTransitionLeaveHooks(this.nodes, transition, () => {
@@ -11704,8 +11716,8 @@ var DynamicFragment = class extends VaporFragment {
 						const pending = this.pending;
 						if (pending) {
 							this.pending = void 0;
-							this.renderBranch(pending.render, transition, parent, pending.key);
-						} else this.renderBranch(render, transition, parent, key);
+							this.renderBranch(pending.render, transition, parent, pending.key, pending.noScope);
+						} else this.renderBranch(render, transition, parent, key, noScope);
 					} finally {
 						setCurrentInstance(...prevInstance);
 					}
@@ -11717,27 +11729,33 @@ var DynamicFragment = class extends VaporFragment {
 				}
 			} else parent && remove(this.nodes, parent);
 		}
-		const isRevivingDeferredBranch = isHydrating$1 && isInDeferredHydrationBoundary() && !!render && this.anchorLabel !== "slot" && !isValidBlock(this.nodes);
-		const reusingDeferredAnchor = isRevivingDeferredBranch && !!this.anchor && !!this.anchor.parentNode;
-		if (isRevivingDeferredBranch) {
-			let slotEndAnchor = null;
-			const anchor = this.anchor || (currentHydrationNode === (slotEndAnchor = getCurrentSlotEndAnchor()) ? slotEndAnchor : null);
-			if (anchor) setCurrentHydrationNode(markHydrationAnchor(anchor));
+		let reusingDeferredAnchor = false;
+		if (isHydrating$1) {
+			const isRevivingDeferredBranch = isInDeferredHydrationBoundary() && !!render && this.anchorLabel !== "slot" && !isValidBlock(this.nodes);
+			reusingDeferredAnchor = isRevivingDeferredBranch && !!this.anchor && !!this.anchor.parentNode;
+			if (isRevivingDeferredBranch) {
+				let slotEndAnchor = null;
+				const anchor = this.anchor || (currentHydrationNode === (slotEndAnchor = getCurrentSlotEndAnchor()) ? slotEndAnchor : null);
+				if (anchor) setCurrentHydrationNode(markHydrationAnchor(anchor));
+			}
 		}
-		this.renderBranch(render, transition, parent, key);
+		this.renderBranch(render, transition, parent, key, noScope);
 		setActiveSub(prevSub);
 		if (isHydrating$1 && this.anchorLabel !== "slot" && !reusingDeferredAnchor) this.hydrate(render == null);
 	}
-	renderBranch(render, transition, parent, key) {
+	renderBranch(render, transition, parent, key, noScope = false) {
 		this.current = key;
 		if (render) {
 			const keepAliveCtx = isKeepAliveEnabled ? this.keepAliveCtx : null;
-			const scope = keepAliveCtx && keepAliveCtx.getScope(this.current);
-			if (scope) this.scope = scope;
-			else this.scope = new EffectScope();
+			const useScope = !noScope || !!this.hasFallthroughAttrs;
+			if (useScope) {
+				const scope = keepAliveCtx && keepAliveCtx.getScope(this.current);
+				if (scope) this.scope = scope;
+				else this.scope = new EffectScope();
+			} else this.scope = void 0;
 			const renderBranch = () => {
 				try {
-					this.nodes = this.runWithRenderCtx(() => this.scope.run(render) || []);
+					this.nodes = this.runWithRenderCtx(() => (useScope ? this.scope.run(render) : render()) || EMPTY_BLOCK, this.scope);
 				} finally {
 					const key = this.keyed ? this.current : this.$key;
 					if (key !== void 0 && (transition || this.inTransition || keepAliveCtx)) setBlockKey(this.nodes, key);
@@ -11748,20 +11766,119 @@ var DynamicFragment = class extends VaporFragment {
 			if (keepAliveCtx && this.keyed) withCurrentCacheKey(key, renderBranch);
 			else renderBranch();
 			if (parent) {
-				if (this.attrs) {
-					if (this.nodes instanceof Element) this.scope.run(() => {
-						renderEffect(() => applyFallthroughProps(this.nodes, this.attrs));
-					});
-					else if (this.anchorLabel === "slot" || isArray(this.nodes) && this.nodes.length) warnExtraneousAttributes(this.attrs);
-				}
+				const onBeforeInsert = this.onBeforeInsert;
+				if (onBeforeInsert) onBeforeInsert.forEach((hook) => hook(this.nodes));
 				insert(this.nodes, parent, this.anchor);
-				if (keepAliveCtx && transition && transition.mode === "out-in") keepAliveCtx.cacheBlock();
 			}
 		} else {
 			this.scope = void 0;
-			this.nodes = [];
+			this.nodes = EMPTY_BLOCK;
+		}
+		if (parent) {
+			const onUpdated = this.onUpdated;
+			if (onUpdated) onUpdated.forEach((hook) => hook(this.nodes));
+		}
+	}
+	hydrate(isEmpty = false, isSlot = false) {
+		if (!isHydrating$1) return;
+		let advanceAfterRestore = null;
+		let exitHydrationBoundary;
+		const reuseAnchor = (anchor) => {
+			this.anchor = markHydrationAnchor(anchor);
+			if (currentHydrationNode === this.anchor) advanceHydrationNode(this.anchor);
+			else {
+				exitHydrationBoundary = enterHydrationBoundary(this.anchor);
+				advanceAfterRestore = this.anchor;
+			}
+		};
+		const createRuntimeAnchor = () => this.anchor = markHydrationAnchor(/* @__PURE__ */ createComment(this.anchorLabel));
+		const cleanupAndInsertRuntimeAnchor = (parentNode, nextNode, cleanupStart, cleanupUntil) => {
+			if (cleanupUntil) exitHydrationBoundary = enterHydrationBoundary(cleanupUntil);
+			else {
+				cleanupHydrationTail(cleanupStart);
+				setCurrentHydrationNode(null);
+			}
+			queueAnchorInsert(parentNode, nextNode, createRuntimeAnchor);
+		};
+		try {
+			if (isEmpty) {
+				if (isComment(currentHydrationNode, "")) {
+					reuseAnchor(currentHydrationNode);
+					return;
+				}
+				if (this.anchorLabel && currentHydrationNode && isComment(currentHydrationNode, "teleport anchor")) {
+					const parentNode$2 = /* @__PURE__ */ parentNode(currentHydrationNode);
+					const anchor = markHydrationAnchor(currentHydrationNode);
+					if (parentNode$2) {
+						queueAnchorInsert(parentNode$2, anchor, createRuntimeAnchor);
+						return;
+					}
+				}
+				if (!isSlot && this.anchorLabel && currentHydrationNode && !isHydratingSlotFallbackActive() && !isComment(currentHydrationNode, "]")) {
+					const parentNode$4 = /* @__PURE__ */ parentNode(currentHydrationNode);
+					const anchor = nextLogicalSibling(currentHydrationNode);
+					const reusableAnchor = anchor && anchor.nodeType === 8 && isReusableDynamicFragmentAnchor(anchor, this.anchorLabel) && /* @__PURE__ */ parentNode(anchor) ? anchor : null;
+					if (parentNode$4) {
+						this.nodes = EMPTY_BLOCK;
+						if (reusableAnchor) reuseAnchor(reusableAnchor);
+						else cleanupAndInsertRuntimeAnchor(parentNode$4, anchor, currentHydrationNode, anchor);
+						return;
+					}
+				}
+			}
+			if (this.anchorLabel && !isValidBlock(this.nodes) && this.nodes instanceof Comment && isReusableDynamicFragmentAnchor(this.nodes, this.anchorLabel) && /* @__PURE__ */ parentNode(this.nodes)) {
+				const anchor = this.nodes;
+				this.nodes = EMPTY_BLOCK;
+				reuseAnchor(anchor);
+				return;
+			}
+			if (this.anchorLabel && !isValidBlock(this.nodes) && this.nodes instanceof Comment && !/* @__PURE__ */ parentNode(this.nodes) && currentHydrationNode) {
+				const parentNode$5 = /* @__PURE__ */ parentNode(currentHydrationNode);
+				const nextNode = nextLogicalSibling(currentHydrationNode);
+				if (parentNode$5) {
+					this.nodes = EMPTY_BLOCK;
+					cleanupAndInsertRuntimeAnchor(parentNode$5, nextNode, currentHydrationNode, nextNode);
+					return;
+				}
+			}
+			const currentSlotEndAnchor = getCurrentSlotEndAnchor();
+			const forwardedSlot = isSlot ? this.forwarded : false;
+			const slotAnchor = isSlot ? currentSlotEndAnchor : null;
+			const closeOwner = getDynamicCloseOwner(isSlot, forwardedSlot, this.anchorLabel, this.nodes, currentSlotEndAnchor);
+			if (closeOwner === 1) {
+				const anchor = locateHydrationBoundaryClose(slotAnchor || currentHydrationNode, slotAnchor || null);
+				if (isComment(anchor, "]")) {
+					reuseAnchor(anchor);
+					return;
+				} else throw new Error(`Failed to locate ${this.anchorLabel} fragment anchor. this is likely a Vue internal bug.`);
+			} else if (closeOwner === 3 && currentSlotEndAnchor) {
+				const anchor = markHydrationAnchor(currentSlotEndAnchor);
+				queueAnchorInsert(anchor.parentNode, anchor.nextSibling, createRuntimeAnchor);
+				return;
+			} else if (closeOwner === 2 && currentSlotEndAnchor) {
+				const endAnchor = currentSlotEndAnchor;
+				queuePostFlushCb(() => {
+					const parentNode$6 = /* @__PURE__ */ parentNode(endAnchor);
+					if (!parentNode$6) return;
+					parentNode$6.insertBefore(createRuntimeAnchor(), endAnchor);
+				});
+				return;
+			}
+			let parentNode$3;
+			let nextNode;
+			if (this.anchorLabel === "if" && !isValidBlock(this.nodes) && currentSlotEndAnchor && currentHydrationNode === currentSlotEndAnchor) {
+				parentNode$3 = currentSlotEndAnchor.parentNode;
+				nextNode = currentSlotEndAnchor;
+			} else {
+				const node = findBlockNode(this.nodes);
+				parentNode$3 = node.parentNode;
+				nextNode = node.nextNode;
+			}
+			queueAnchorInsert(parentNode$3, nextNode, createRuntimeAnchor);
+		} finally {
+			exitHydrationBoundary && exitHydrationBoundary();
+			if (advanceAfterRestore && currentHydrationNode === advanceAfterRestore) advanceHydrationNode(advanceAfterRestore);
 		}
-		if (parent && this.onUpdated) this.onUpdated.forEach((hook) => hook(this.nodes));
 	}
 };
 let currentSlotBoundary = null;
@@ -11967,6 +12084,13 @@ function commitSlotFallback(outlet, block, scope) {
 	outlet.activeFallback = block;
 	outlet.fallbackScope = scope;
 	ensureSlotFallbackOrderHook(outlet, block);
+	if (isTransitionEnabled) {
+		const transitionOutlet = outlet;
+		if (transitionOutlet.$transition) {
+			setBlockKey(block, "_fb");
+			transitionOutlet.$transition = applyTransitionHooks(block, transitionOutlet.$transition);
+		}
+	}
 	insertActiveSlotFallback(outlet);
 }
 function syncActiveSlotFallback(outlet) {
@@ -12061,7 +12185,7 @@ function isReusableDynamicFragmentAnchor(node, anchorLabel) {
 }
 var SlotFragment = class extends DynamicFragment {
 	constructor() {
-		super("slot", false, false);
+		super("slot", false, false, false);
 		this.disposed = false;
 		this.forwarded = false;
 		this.parentSlotBoundary = getCurrentSlotBoundary();
@@ -12085,7 +12209,6 @@ var SlotFragment = class extends DynamicFragment {
 			markDirty: () => markSlotFallbackDirty(this)
 		};
 	}
-	registerSlotBoundaryDirty() {}
 	get fallbackBlock() {
 		return this.activeFallback;
 	}
@@ -12208,21 +12331,32 @@ function isValidBlock(block) {
 	}
 }
 function insert(block, parent, anchor = null, parentSuspense) {
-	anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
 	if (block instanceof Node) {
-		if (!isHydrating$1) if (isTransitionEnabled && block instanceof Element && block.$transition && !block.$transition.disabled) performTransitionEnter(block, block.$transition, () => parent.insertBefore(block, anchor), parentSuspense);
-		else parent.insertBefore(block, anchor);
-	} else if (isVaporComponent(block)) if (block.isMounted && !block.isDeactivated) insert(block.block, parent, anchor);
-	else mountComponent(block, parent, anchor);
-	else if (isArray(block)) for (const b of block) insert(b, parent, anchor);
-	else {
-		if (block.anchor) {
-			insert(block.anchor, parent, anchor);
-			anchor = block.anchor;
-		}
-		if (block.insert) block.insert(parent, anchor, block.$transition);
-		else insert(block.nodes, parent, anchor, parentSuspense);
+		insertNode(block, parent, anchor, parentSuspense);
+		return;
 	}
+	if (isVaporComponent(block)) {
+		anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
+		if (block.isMounted && !block.isDeactivated) insert(block.block, parent, anchor);
+		else mountComponent(block, parent, anchor);
+	} else if (isArray(block)) {
+		anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
+		for (const b of block) insert(b, parent, anchor);
+	} else insertFragment(block, parent, anchor, parentSuspense);
+}
+function insertNode(block, parent, anchor = null, parentSuspense) {
+	anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
+	if (!isHydrating$1) if (isTransitionEnabled && block instanceof Element && block.$transition && !block.$transition.disabled) performTransitionEnter(block, block.$transition, () => parent.insertBefore(block, anchor), parentSuspense);
+	else parent.insertBefore(block, anchor);
+}
+function insertFragment(block, parent, anchor = null, parentSuspense) {
+	anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
+	if (block.anchor) {
+		insertNode(block.anchor, parent, anchor, parentSuspense);
+		anchor = block.anchor;
+	}
+	if (block.insert) block.insert(parent, anchor, block.$transition);
+	else insert(block.nodes, parent, anchor, parentSuspense);
 }
 function move(block, parent, anchor = null, moveType = 1, parentComponent, parentSuspense) {
 	anchor = anchor === 0 ? parent.$fc || /* @__PURE__ */ _child(parent) : anchor;
@@ -12249,16 +12383,20 @@ function prepend(parent, ...blocks) {
 	while (i--) insert(blocks[i], parent, 0);
 }
 function remove(block, parent) {
-	if (block instanceof Node) if (isTransitionEnabled && block.$transition && block instanceof Element) performTransitionLeave(block, block.$transition, () => parent && parent.removeChild(block));
-	else parent && parent.removeChild(block);
+	if (block instanceof Node) removeNode(block, parent);
 	else if (isVaporComponent(block)) unmountComponent(block, parent);
 	else if (isArray(block)) for (let i = 0; i < block.length; i++) remove(block[i], parent);
-	else {
-		if (block.remove) block.remove(parent, block.$transition);
-		else remove(block.nodes, parent);
-		if (block.anchor) remove(block.anchor, parent);
-		if (block.scope) block.scope.stop();
-	}
+	else removeFragment(block, parent);
+}
+function removeNode(block, parent) {
+	if (isTransitionEnabled && block.$transition && block instanceof Element) performTransitionLeave(block, block.$transition, () => parent && parent.removeChild(block));
+	else parent && parent.removeChild(block);
+}
+function removeFragment(block, parent) {
+	if (block.remove) block.remove(parent, block.$transition);
+	else remove(block.nodes, parent);
+	if (block.anchor) removeNode(block.anchor, parent);
+	if (block.scope) block.scope.stop();
 }
 /**
 * dev / test only
@@ -12386,7 +12524,12 @@ function setParentSuspense(suspense) {
 }
 //#endregion
 //#region packages/runtime-vapor/src/component.ts
+function normalizeRawSlots(rawSlots) {
+	return rawSlots && isFunction(rawSlots) ? { default: rawSlots } : rawSlots;
+}
 function createComponent(component, rawProps, rawSlots, isSingleRoot, once, appContext = currentInstance && currentInstance.appContext || emptyContext, managedMount = false) {
+	const wasInOnceSlot = inOnceSlot;
+	if (wasInOnceSlot) once = true;
 	if (isInteropEnabled && isCollectingVdomSlotVNodes) {
 		if (component.__vapor) return;
 		const owner = getScopeOwner();
@@ -12427,7 +12570,7 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, once, appC
 			if (cached) return cached;
 		}
 		if (isInteropEnabled && appContext.vapor && !component.__vapor) {
-			const frag = appContext.vapor.vdomMount(component, currentInstance, rawProps, rawSlots);
+			const frag = appContext.vapor.vdomMount(component, currentInstance, rawProps, normalizeRawSlots(rawSlots), once);
 			if (isCollectingVdomSlotVNodes) return frag;
 			if (!isHydrating$1) {
 				if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
@@ -12435,7 +12578,7 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, once, appC
 			return frag;
 		}
 		if (isTeleportEnabled && isVaporTeleport(component)) {
-			const frag = component.process(rawProps, rawSlots);
+			const frag = component.process(rawProps, normalizeRawSlots(rawSlots));
 			if (_insertionParent) onScopeDispose(() => frag.dispose(), true);
 			if (!isHydrating$1) {
 				if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
@@ -12461,7 +12604,10 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, once, appC
 			hasInitMeasure = true;
 			instance.propsOptions = normalizePropsOptions(component);
 			instance.emitsOptions = normalizeEmitsOptions(component);
-			if (isHydrating$1 && isAsyncWrapper(instance) && component.__asyncHydrate && !component.__asyncResolved) component.__asyncHydrate(currentHydrationNode, instance, () => setupComponent(instance, component));
+			if (isHydrating$1 && isAsyncWrapper(instance) && component.__asyncHydrate && !component.__asyncResolved) {
+				const setup = () => setupComponent(instance, component);
+				component.__asyncHydrate(currentHydrationNode, instance, wasInOnceSlot ? () => withOnceSlot(setup, false) : setup);
+			} else if (wasInOnceSlot) withOnceSlot(() => setupComponent(instance, component), false);
 			else setupComponent(instance, component);
 		} finally {
 			if (hasWarningContext) popWarningContext();
@@ -12582,6 +12728,7 @@ var VaporComponentInstance = class {
 		}
 		this.block = null;
 		this.scope = new EffectScope(true);
+		this.isOnce = !!once;
 		this.emit = emit.bind(null, this);
 		this.expose = expose.bind(null, this);
 		this.refs = EMPTY_OBJ;
@@ -12595,15 +12742,16 @@ var VaporComponentInstance = class {
 		this.asyncDep = null;
 		this.asyncResolved = false;
 		this.isMounted = this.isUnmounted = this.isUpdating = this.isDeactivated = false;
-		this.rawProps = rawProps || EMPTY_OBJ;
-		this.hasFallthrough = hasFallthroughAttrs(comp, rawProps);
+		this.rawProps = this.isOnce && rawProps ? snapshotRawProps(rawProps) : rawProps || EMPTY_OBJ;
+		this.hasFallthrough = hasFallthroughAttrs(comp, this.rawProps);
 		if (rawProps || comp.props) {
-			const [propsHandlers, attrsHandlers] = getPropsProxyHandlers(comp, once);
+			const [propsHandlers, attrsHandlers] = getPropsProxyHandlers(comp);
 			this.attrs = new Proxy(this, attrsHandlers);
 			this.props = comp.props ? new Proxy(this, propsHandlers) : isFunction(comp) ? this.attrs : EMPTY_OBJ;
 		} else this.props = this.attrs = EMPTY_OBJ;
-		this.rawSlots = rawSlots || EMPTY_OBJ;
-		this.slots = rawSlots ? rawSlots.$ ? new Proxy(rawSlots, dynamicSlotsProxyHandlers) : rawSlots : EMPTY_OBJ;
+		const normalizedRawSlots = normalizeRawSlots(rawSlots);
+		this.rawSlots = normalizedRawSlots || EMPTY_OBJ;
+		this.slots = normalizedRawSlots ? normalizedRawSlots.$ ? new Proxy(normalizedRawSlots, dynamicSlotsProxyHandlers) : normalizedRawSlots : EMPTY_OBJ;
 		this.scopeId = getCurrentScopeId();
 		if (comp.ce) comp.ce(this);
 		if (this.props === this.attrs) this.accessedAttrs = true;
@@ -12628,6 +12776,14 @@ function isVaporComponent(value) {
 	return value instanceof VaporComponentInstance;
 }
 /**
+* Resolve an asset component by name before passing it to the fallback helper;
+* a string passed directly to `createComponentWithFallback` is plain element
+* fallback, not a component name.
+*/
+function createAssetComponent(name, rawProps, rawSlots, isSingleRoot, once, maybeSelfReference, appContext) {
+	return createComponentWithFallback(resolveComponent(name, maybeSelfReference), rawProps, rawSlots, isSingleRoot, once, appContext);
+}
+/**
 * Used when a component cannot be resolved at compile time
 * and needs rely on runtime resolution - where it might fallback to a plain
 * element if the resolution fails.
@@ -12640,7 +12796,7 @@ function createComponentWithFallback(comp, rawProps, rawSlots, isSingleRoot, onc
 				if (isComment(node, "")) advanceHydrationNode(node);
 				return node;
 			}
-			const nextAnchor = locateNextNode(currentHydrationNode);
+			const nextAnchor = nextLogicalSibling(currentHydrationNode);
 			if (nextAnchor && isReusableNullComponentAnchor(nextAnchor)) return nextAnchor;
 		}
 		return /* @__PURE__ */ createComment("ndc");
@@ -12652,12 +12808,17 @@ function isReusableNullComponentAnchor(node) {
 	return isComment(node, "") || isComment(node, "dynamic-component") || isComment(node, "async component") || isComment(node, "keyed");
 }
 function createPlainElement(comp, rawProps, rawSlots, isSingleRoot, once) {
+	rawSlots = normalizeRawSlots(rawSlots);
 	const _insertionParent = insertionParent;
 	const _insertionAnchor = insertionAnchor;
 	let hydrationCursor = null;
 	if (isHydrating$1) hydrationCursor = enterHydrationCursor();
 	else resetInsertionState();
-	const el = isHydrating$1 ? adoptTemplate(currentHydrationNode, `<${comp}/>`) : /* @__PURE__ */ createElement(comp);
+	const defaultSlot = rawSlots && getSlot(rawSlots, "default");
+	const hasDynamicSlots = !!rawSlots && !!rawSlots.$;
+	const adoptHydrationChildren = !!defaultSlot;
+	const hydrationTemplate = hasDynamicSlots && !defaultSlot ? `<${comp}><!></${comp}>` : `<${comp}/>`;
+	const el = isHydrating$1 ? adoptTemplate(currentHydrationNode, hydrationTemplate, adoptHydrationChildren) : /* @__PURE__ */ createElement(comp);
 	el.$root = isSingleRoot;
 	if (!isHydrating$1) {
 		const scopeId = getCurrentScopeId();
@@ -12671,7 +12832,7 @@ function createPlainElement(comp, rawProps, rawSlots, isSingleRoot, once) {
 	if (rawSlots) {
 		let nextNode = null;
 		if (isHydrating$1) {
-			nextNode = locateNextNode(el);
+			nextNode = nextLogicalSibling(el);
 			setCurrentHydrationNode(el.firstChild);
 		}
 		if (rawSlots.$) {
@@ -12792,7 +12953,7 @@ function handleSetupResult(setupResult, component, instance) {
 	else if (setupResult === EMPTY_OBJ && component.render) instance.block = callRender(component.render, instance, setupResult);
 	else instance.block = setupResult;
 	if (instance.hasFallthrough && component.inheritAttrs !== false && Object.keys(instance.attrs).length) {
-		const root = getRootElement(instance.block, (frag) => frag.attrs = instance.attrs, false);
+		const root = getRootElement(instance.block, (frag) => registerDynamicFragmentFallthroughAttrs(frag, instance.attrs), false);
 		if (root) renderEffect(() => {
 			const attrs = isFunction(component) && !(isTransitionEnabled ? isVaporTransition(component) : false) ? getFunctionalFallthrough(instance.attrs) : instance.attrs;
 			if (attrs) applyFallthroughProps(root, attrs);
@@ -12805,6 +12966,15 @@ function getCurrentScopeId() {
 	const scopeOwner = getScopeOwner();
 	return scopeOwner ? scopeOwner.type.__scopeId : void 0;
 }
+function registerDynamicFragmentFallthroughAttrs(frag, attrs) {
+	frag.hasFallthroughAttrs = true;
+	(frag.onBeforeInsert || (frag.onBeforeInsert = [])).push((nodes) => {
+		if (nodes instanceof Element) frag.scope.run(() => {
+			renderEffect(() => applyFallthroughProps(nodes, attrs));
+		});
+		else if (frag.anchorLabel === "slot" || isArray(nodes) && nodes.length) warnExtraneousAttributes(attrs);
+	});
+}
 //#endregion
 //#region packages/runtime-vapor/src/apiCreateApp.ts
 let _createApp;
@@ -12948,7 +13118,7 @@ function defineVaporAsyncComponent(source) {
 function createInnerComp(comp, parent, rawProps = parent.rawProps, rawSlots = parent.rawSlots) {
 	const prevInstance = setCurrentInstance(parent);
 	try {
-		return createComponent(comp, rawProps, rawSlots, void 0, void 0, parent.appContext);
+		return createComponent(comp, rawProps, rawSlots, void 0, parent.isOnce, parent.appContext);
 	} finally {
 		setCurrentInstance(...prevInstance);
 	}
@@ -13012,10 +13182,11 @@ function setDisplay(target, value) {
 		else el.style.display = "none";
 		else if (isHydrating$1) {
 			if (!value && el.style.display !== "none") {
-				warnPropMismatch(el, "style", 3, `display: ${el.style.display}`, "display: none");
-				logMismatchError();
-				el.style.display = "none";
-				el[vShowOriginalDisplay] = "";
+				if (warnPropMismatch(el, "style", 3, `display: ${el.style.display}`, "display: none")) {
+					logMismatchError();
+					el.style.display = "none";
+					el[vShowOriginalDisplay] = "";
+				}
 			}
 		} else el.style.display = value ? el[vShowOriginalDisplay] : "none";
 		el[vShowHidden] = !value;
@@ -13165,7 +13336,7 @@ function applyResolvedTransitionHooks(block, hooks) {
 		if (block.length === 1) block = block[0];
 		else if (block.length === 0) return { hooks };
 	}
-	if (hooks.applyGroup && block instanceof ForFragment) {
+	if (hooks.applyGroup && (block instanceof ForFragment || block instanceof SlotFragment || isVaporComponent(block) && block.block instanceof SlotFragment)) {
 		hooks.applyGroup(block, hooks.props, hooks.state, hooks.instance);
 		return { hooks };
 	}
@@ -13518,7 +13689,7 @@ const VaporKeepAlive = /* @__PURE__ */ withKeepAliveEnabled(/* @__PURE__ */ defi
 			keptAliveScopes.forEach((scope) => scope.stop());
 			keptAliveScopes.clear();
 		});
-		const prevCtx = setCurrentKeepAliveCtx({
+		const keepAliveCtx = {
 			processShapeFlag,
 			cacheBlock,
 			cacheScope(cacheKey, scopeLookupKey, scope) {
@@ -13533,11 +13704,14 @@ const VaporKeepAlive = /* @__PURE__ */ withKeepAliveEnabled(/* @__PURE__ */ defi
 			getScope(key) {
 				return deleteScope(key);
 			}
-		});
+		};
+		const prevCtx = setCurrentKeepAliveCtx(keepAliveCtx);
 		let children = slots.default();
 		setCurrentKeepAliveCtx(prevCtx);
+		registerDynamicFragmentHooks(children, keepAliveCtx);
 		if (isArray(children)) {
 			children = children.filter((child) => !(child instanceof Comment));
+			if (children.length === 1) registerDynamicFragmentHooks(children[0], keepAliveCtx);
 			if (children.length > 1) {
 				warn(`KeepAlive should contain exactly one component child.`);
 				return children;
@@ -13546,6 +13720,20 @@ const VaporKeepAlive = /* @__PURE__ */ withKeepAliveEnabled(/* @__PURE__ */ defi
 		return children;
 	}
 }));
+function registerDynamicFragmentHooks(block, keepAliveCtx) {
+	if (!isDynamicFragment(block)) return;
+	(block.onBeforeRemove || (block.onBeforeRemove = [])).push((scope) => {
+		const cacheKey = block.keyed ? withCurrentCacheKey(block.current, () => keepAliveCtx.processShapeFlag(block.nodes)) : keepAliveCtx.processShapeFlag(block.nodes);
+		if (cacheKey !== false) {
+			keepAliveCtx.cacheScope(cacheKey, block.current, scope);
+			return true;
+		}
+		return false;
+	});
+	(block.onUpdated || (block.onUpdated = [])).unshift(() => {
+		if (block.$transition && block.$transition.mode === "out-in") keepAliveCtx.cacheBlock(block);
+	});
+}
 const shouldCache = (block, props, interop = false) => {
 	const isAsync = isAsyncWrapper(interop ? block.vnode : block);
 	const type = interop && isInteropEnabled ? block.vnode.type : block.type;
@@ -13635,7 +13823,9 @@ const vaporInteropImpl = {
 		const instance = vnode.component = createComponent(vnode.type, { $: dynamicPropSource }, rawSlots, void 0, void 0, parentComponent ? parentComponent.appContext : vnode.appContext, true);
 		instance.rawPropsRef = propsRef;
 		instance.rawSlotsRef = slotsRef;
-		ensureVNodeHookState(instance, vnode);
+		const vnodeHookState = ensureVNodeHookState(instance, vnode);
+		const applyScopeId = (vnode) => setInteropVnodeScopeId(instance, vnode, instance.parent);
+		vnodeHookState.postRootSyncHooks.push(applyScopeId);
 		if (parentComponent && isKeepAlive(parentComponent)) {
 			enableKeepAlive();
 			instance.shapeFlag = vnode.shapeFlag;
@@ -13654,6 +13844,7 @@ const vaporInteropImpl = {
 			vnode.dirs = null;
 		}
 		mountComponent(instance, container, selfAnchor);
+		if (!isHydrating$1) applyScopeId(vnodeHookState.vnode);
 		simpleSetCurrentInstance(prev);
 		return instance;
 	},
@@ -13674,6 +13865,7 @@ const vaporInteropImpl = {
 			instance.rawSlotsRef.value = normalizeInteropSlots(n2.children);
 			queuePostFlushCb(() => {
 				syncVNodeEl(n2, instance);
+				setInteropVnodeScopeId(instance, n2, instance.parent);
 				if (!instance.isUpdating) vnodeHookState.skipVnodeHooks = false;
 			});
 		}
@@ -13945,13 +14137,22 @@ function appendVnodeUpdatedHook(vnode, hook) {
 	const existing = props.onVnodeUpdated;
 	props.onVnodeUpdated = existing ? isArray(existing) ? [...existing, hook] : [existing, hook] : hook;
 }
+function appendVnodeBeforeUpdateHook(vnode, hook) {
+	const props = vnode.props || (vnode.props = {});
+	const existing = props.onVnodeBeforeUpdate;
+	props.onVnodeBeforeUpdate = existing ? isArray(existing) ? [...existing, hook] : [existing, hook] : hook;
+}
 function trackFragmentVNodeUpdates(frag, vnode) {
-	const refresh = () => {
+	const beforeUpdate = () => {
+		if (frag.onBeforeUpdate) for (let i = 0; i < frag.onBeforeUpdate.length; i++) frag.onBeforeUpdate[i]();
+	};
+	const updated = () => {
 		frag.nodes = resolveVNodeNodes(vnode);
 		frag.validityPending = false;
 		if (frag.onUpdated) frag.onUpdated.forEach((m) => m());
 	};
-	appendVnodeUpdatedHook(vnode, refresh);
+	appendVnodeBeforeUpdateHook(vnode, beforeUpdate);
+	appendVnodeUpdatedHook(vnode, updated);
 }
 /**
 * Mount VNode in vapor
@@ -14005,7 +14206,7 @@ function mountVNode(internals, vnode, parentComponent) {
 /**
 * Mount vdom component in vapor
 */
-function createVDOMComponent(internals, component, parentComponent, rawProps, rawSlots) {
+function createVDOMComponent(internals, component, parentComponent, rawProps, rawSlots, once) {
 	const suspense = parentSuspense || parentComponent && parentComponent.suspense;
 	const useBridge = shouldUseRendererBridge(component);
 	const comp = useBridge ? ensureRendererBridge(component) : component;
@@ -14026,7 +14227,7 @@ function createVDOMComponent(internals, component, parentComponent, rawProps, ra
 		}
 		setCurrentKeepAliveCtx(null);
 	}
-	const wrapper = new VaporComponentInstance(useBridge ? comp : { props: component.props }, rawProps, rawSlots, parentComponent ? parentComponent.appContext : void 0, void 0);
+	const wrapper = new VaporComponentInstance(useBridge ? comp : { props: component.props }, rawProps, rawSlots, parentComponent ? parentComponent.appContext : void 0, once);
 	if (isCollectingVdomSlotVNodes) collectedVdomSlotVNodes.set(frag, createCollectedVDOMSlotVNode(component, rawProps, wrapper.slots));
 	vnode.vi = (instance) => {
 		instance.props = /* @__PURE__ */ shallowReactive(wrapper.props);
@@ -14197,7 +14398,7 @@ function trackSlotVNodeUpdatesWithRefresh(vnode, refresh) {
 /**
 * Mount vdom slot in vapor
 */
-function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallback) {
+function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallback, once) {
 	const suspense = parentSuspense || parentComponent.suspense;
 	const frag = new VaporFragment([]);
 	trackSlotBoundaryDirtying(frag);
@@ -14242,7 +14443,7 @@ function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallb
 			if (!isContentUpdateRecheck && inheritedBoundary) inheritedBoundary.markDirty();
 		}
 	};
-	localFallback = fallback ? () => fallback(internals, parentComponent) : void 0;
+	localFallback = fallback ? once ? () => withOnceSlot(() => fallback(internals, parentComponent)) : () => fallback(internals, parentComponent) : void 0;
 	const setRenderedContent = (rendered) => {
 		contentState.rendered = rendered;
 		if (isVNode(rendered)) {
@@ -14299,12 +14500,13 @@ function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallb
 		const prev = currentInstance;
 		simpleSetCurrentInstance(instance);
 		try {
-			renderEffect(() => {
+			const renderSlotContent = () => {
 				runWithFragmentRenderCtx(frag, () => withOwnedSlotBoundary(boundary, () => {
 					let slotContent;
 					let slotContentValid = false;
 					if (slotsRef.value) {
-						slotContent = renderSlot(slotsRef.value, isFunction(name) ? name() : name, props);
+						const renderContent = () => renderSlot(slotsRef.value, isFunction(name) ? name() : name, props);
+						slotContent = once ? withOnceSlot(renderContent) : renderContent();
 						if (isVNode(slotContent)) if (slotContent.type === Fragment) {
 							const children = slotContent.children;
 							ensureVaporSlotFallback(children, localFallback);
@@ -14367,7 +14569,8 @@ function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallb
 					setRenderedContent(null);
 					finishContentUpdate();
 				}));
-			});
+			};
+			once ? renderSlotContent() : renderEffect(renderSlotContent);
 		} finally {
 			simpleSetCurrentInstance(prev);
 		}
@@ -14664,7 +14867,8 @@ function ensureVNodeHookState(instance, vnode) {
 	if (!state) {
 		state = {
 			vnode,
-			skipVnodeHooks: false
+			skipVnodeHooks: false,
+			postRootSyncHooks: []
 		};
 		vnodeHookStateMap.set(instance, state);
 		(instance.bu || (instance.bu = [])).push(() => {
@@ -14672,7 +14876,11 @@ function ensureVNodeHookState(instance, vnode) {
 			const vnodeHook = state.vnode.props && state.vnode.props.onVnodeBeforeUpdate;
 			if (vnodeHook) callWithAsyncErrorHandling(vnodeHook, instance.parent, 7, [state.vnode, state.vnode]);
 		});
-		(instance.u || (instance.u = [])).unshift(() => syncVNodeEl(state.vnode, instance));
+		(instance.u || (instance.u = [])).unshift(() => {
+			syncVNodeEl(state.vnode, instance);
+			const hooks = state.postRootSyncHooks;
+			for (let i = 0; i < hooks.length; i++) hooks[i](state.vnode);
+		});
 		instance.u.push(() => {
 			if (state.skipVnodeHooks) {
 				state.skipVnodeHooks = false;
@@ -14860,6 +15068,32 @@ function createInteropRawSlots(slotsRef) {
 	});
 	return rawSlots;
 }
+const interopScopeIdRootMap = /* @__PURE__ */ new WeakMap();
+const interopScopeIdFragmentMap = /* @__PURE__ */ new WeakMap();
+function trackInteropScopeIdFragment(instance, frag) {
+	if (interopScopeIdFragmentMap.get(frag) === instance) return;
+	interopScopeIdFragmentMap.set(frag, instance);
+	(frag.onUpdated || (frag.onUpdated = [])).push(() => {
+		const state = vnodeHookStateMap.get(instance);
+		if (!state) return;
+		syncVNodeEl(state.vnode, instance);
+		setInteropVnodeScopeId(instance, state.vnode, instance.parent);
+	});
+}
+function setInteropVnodeScopeId(instance, vnode, parentComponent) {
+	const root = getRootElement(instance, (frag) => trackInteropScopeIdFragment(instance, frag));
+	if (!root) {
+		interopScopeIdRootMap.delete(instance);
+		return;
+	}
+	if (interopScopeIdRootMap.get(instance) === root) return;
+	interopScopeIdRootMap.set(instance, root);
+	const scopeIds = [];
+	if (vnode.scopeId) scopeIds.push(vnode.scopeId);
+	if (vnode.slotScopeIds) scopeIds.push(...vnode.slotScopeIds);
+	scopeIds.push(...getInheritedScopeIds(vnode, parentComponent));
+	for (let i = 0; i < scopeIds.length; i++) root.setAttribute(scopeIds[i], "");
+}
 //#endregion
 //#region packages/runtime-vapor/src/components/Teleport.ts
 const VaporTeleportImpl = {
@@ -15203,16 +15437,19 @@ var VaporElement = class extends VueElementBase {
 //#region packages/runtime-vapor/src/dom/template.ts
 let t;
 /* @__NO_SIDE_EFFECTS__ */
-function template(html, root, isStatic, ns) {
+function template(html, flags = 0, ns) {
+	const root = !!(flags & 1);
+	const isStatic = !!(flags & 2);
 	let node;
 	return () => {
 		if (isHydrating$1) {
 			let adopted = null;
 			if (isStatic) {
 				adopted = resolveHydrationTarget(currentHydrationNode);
+				if (html !== "") validateHydrationTarget(adopted, html);
 				node = adopted.cloneNode(true);
 				advanceHydrationNode(adopted);
-			} else adopted = adoptTemplate(currentHydrationNode, html);
+			} else adopted = adoptTemplate(currentHydrationNode, html, false, ns);
 			if (root) adopted.$root = true;
 			return adopted;
 		}
@@ -15238,30 +15475,32 @@ function template(html, root, isStatic, ns) {
 }
 //#endregion
 //#region packages/runtime-vapor/src/apiCreateIf.ts
-function createIf(condition, b1, b2, blockShape, once, index) {
+function createIf(condition, b1, b2, flags = 1) {
 	const _insertionParent = insertionParent;
 	const _insertionAnchor = insertionAnchor;
 	if (!isHydrating$1) resetInsertionState();
 	let hydrationCursor = null;
 	let branchShape;
 	let frag;
-	if (once) {
+	if (flags & 16) {
 		const ok = condition();
 		if (isHydrating$1) {
-			branchShape = decodeIfShape(blockShape, ok);
+			branchShape = decodeIfShape(flags, ok);
 			hydrationCursor = enterHydrationCursor(branchShape === 2);
 		}
 		frag = ok ? b1() : b2 ? b2() : [/* @__PURE__ */ createComment("if")];
 	} else {
-		const keyed = index != null;
+		const index = flags >> 7;
+		const keyed = index > 0;
+		const keyBase = keyed ? (index - 1) * 2 : 0;
 		frag = new DynamicFragment("if", keyed, false);
 		renderEffect(() => {
 			const ok = condition();
 			if (isHydrating$1) {
-				branchShape = decodeIfShape(blockShape, ok);
+				branchShape = decodeIfShape(flags, ok);
 				hydrationCursor = enterHydrationCursor(branchShape === 2);
 			}
-			frag.update(ok ? b1 : b2, keyed ? `${index}${ok ? 0 : 1}` : void 0);
+			frag.update(ok ? b1 : b2, keyed ? keyBase + (ok ? 0 : 1) : void 0, isNoScopeBranch(flags, ok));
 		});
 	}
 	if (!isHydrating$1) {
@@ -15278,6 +15517,9 @@ function createIf(condition, b1, b2, blockShape, once, index) {
 function decodeIfShape(shape, ok) {
 	return shape >> (ok ? 0 : 2) & 3;
 }
+function isNoScopeBranch(flags, ok) {
+	return !!(flags & (ok ? 32 : 64));
+}
 //#endregion
 //#region packages/runtime-vapor/src/apiCreateFragment.ts
 /**
@@ -15318,6 +15560,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 	let isMounted = false;
 	let oldBlocks = [];
 	let newBlocks;
+	let newKeys;
 	let parent;
 	let parentAnchor;
 	let pendingHydrationAnchor = false;
@@ -15326,6 +15569,8 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 	const instance = currentInstance;
 	const canUseFastRemove = !!(flags & 1);
 	const isComponent = !!(flags & 2);
+	const isSingleNode = !!(flags & 8);
+	const isFragment = !!(flags & 16);
 	const slotOwner = currentSlotOwner;
 	if (!instance) warn("createFor() can only be used inside setup()");
 	if (!isComponent) onScopeDispose(() => {
@@ -15339,7 +15584,13 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 		const newLength = source.values.length;
 		const oldLength = oldBlocks.length;
 		newBlocks = new Array(newLength);
+		newKeys = void 0;
+		if (getKey) {
+			newKeys = new Array(newLength);
+			for (let i = 0; i < newLength; i++) newKeys[i] = getKey(...getItem(source, i));
+		}
 		const prevSub = setActiveSub();
+		if (isMounted && frag.onBeforeUpdate) for (let i = 0; i < frag.onBeforeUpdate.length; i++) frag.onBeforeUpdate[i]();
 		if (!isMounted) {
 			isMounted = true;
 			if (isHydrating$1) hydrateList(source, newLength);
@@ -15364,7 +15615,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 				{
 					const keyToIndexMap = /* @__PURE__ */ new Map();
 					for (let i = 0; i < newLength; i++) {
-						const key = getKey(...getItem(source, i));
+						const key = newKeys[i];
 						if (key != null) {
 							if (keyToIndexMap.has(key)) warn(`Duplicate keys found during update:`, JSON.stringify(key), `Make sure keys are unique.`);
 							keyToIndexMap.set(key, i);
@@ -15380,7 +15631,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 				while (endOffset < commonLength) {
 					const index = newLength - endOffset - 1;
 					const item = getItem(source, index);
-					const key = getKey(...item);
+					const key = newKeys[index];
 					const existingBlock = oldBlocks[oldLength - endOffset - 1];
 					if (existingBlock.key !== key) break;
 					update(existingBlock, ...item);
@@ -15392,7 +15643,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 				const e3 = newLength - endOffset;
 				for (let i = 0; i < e1; i++) {
 					const currentItem = getItem(source, i);
-					const currentKey = getKey(...currentItem);
+					const currentKey = newKeys[i];
 					const oldBlock = oldBlocks[i];
 					const oldKey = oldBlock.key;
 					if (oldKey === currentKey) update(newBlocks[i] = oldBlock, currentItem[0]);
@@ -15408,7 +15659,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 				for (let i = e1; i < e2; i++) oldKeyIndexPairs[oldKeyIndexPairsLength++] = [oldBlocks[i].key, i];
 				for (let i = e1; i < e3; i++) {
 					const blockItem = getItem(source, i);
-					const blockKey = getKey(...blockItem);
+					const blockKey = newKeys[i];
 					queuedBlocks[queuedBlocksLength++] = [
 						i,
 						blockItem,
@@ -15474,7 +15725,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 								const { item, key } = action;
 								moveLink(mount(source, index, anchorNode, item, key), nextBlock.prev, nextBlock);
 							} else if (action.block.next !== nextBlock) {
-								insert(action.block, parent, anchorNode);
+								insertForBlock(action.block, anchorNode);
 								moveLink(action.block, nextBlock.prev, nextBlock);
 							}
 						} else if ("source" in action) {
@@ -15485,7 +15736,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 						} else if (action.block.next !== void 0) {
 							let anchorNode = anchor ? normalizeAnchor(anchor.nodes) : parentAnchor;
 							if (!anchorNode.parentNode) anchorNode = parentAnchor;
-							insert(action.block, parent, anchorNode);
+							insertForBlock(action.block, anchorNode);
 							moveLink(action.block, blocksTail);
 							blocksTail = action.block;
 						}
@@ -15501,7 +15752,9 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 	};
 	const needKey = renderItem.length > 1;
 	const needIndex = renderItem.length > 2;
-	const mount = (source, idx, anchor = parentAnchor, [item, key, index] = getItem(source, idx), key2 = getKey && getKey(item, key, index)) => {
+	const insertForBlock = isSingleNode ? (block, anchor) => insertNode(block.nodes, parent, anchor) : isFragment ? (block, anchor) => insertFragment(block.nodes, parent, anchor) : (block, anchor) => insert(block.nodes, parent, anchor);
+	const removeForBlock = isSingleNode ? (block) => removeNode(block.nodes, parent) : isFragment ? (block) => removeFragment(block.nodes, parent) : (block) => remove(block.nodes, parent);
+	const mount = (source, idx, anchor = parentAnchor, [item, key, index] = getItem(source, idx), key2 = newKeys ? newKeys[idx] : getKey && getKey(item, key, index)) => {
 		const itemRef = /* @__PURE__ */ shallowRef(item);
 		const keyRef = needKey ? /* @__PURE__ */ shallowRef(key) : void 0;
 		const indexRef = needIndex ? /* @__PURE__ */ shallowRef(index) : void 0;
@@ -15518,8 +15771,11 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 			}
 		}
 		const block = newBlocks[idx] = new ForBlock(nodes, scope, itemRef, keyRef, indexRef, key2);
-		if (isTransitionEnabled && frag.$transition) applyTransitionHooks(block.nodes, frag.$transition);
-		if (parent) insert(block.nodes, parent, anchor);
+		if (isTransitionEnabled && frag.$transition) {
+			if (frag.$transition.applyGroup) setBlockKey(block.nodes, block.key);
+			applyTransitionHooks(block.nodes, frag.$transition);
+		}
+		if (parent) insertForBlock(block, anchor);
 		return block;
 	};
 	function hydrateList(source, newLength) {
@@ -15543,7 +15799,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 					if (isComment(currentHydrationNode, "]")) {
 						nextNode = markHydrationAnchor(currentHydrationNode);
 						setCurrentHydrationNode(nextNode);
-					} else nextNode = locateNextNode(currentHydrationNode);
+					} else nextNode = nextLogicalSibling(currentHydrationNode);
 					mount(source, i);
 					if (nextNode) setCurrentHydrationNode(nextNode);
 				}
@@ -15580,7 +15836,7 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
 	};
 	const unmount = (block, doRemove = true) => {
 		if (!isComponent) block.scope.stop();
-		if (doRemove) remove(block.nodes, parent);
+		if (doRemove) removeForBlock(block);
 	};
 	if (flags & 4) renderList();
 	else renderEffect(() => {
@@ -15734,9 +15990,18 @@ function getItem({ keys, values, needsWrap, isReadonlySource }, idx) {
 }
 function normalizeAnchor(node) {
 	if (node instanceof Node) return node;
-	else if (isArray(node)) return normalizeAnchor(node[0]);
-	else if (isVaporComponent(node)) return normalizeAnchor(node.block);
-	else return normalizeAnchor(node.nodes);
+	else if (isArray(node)) {
+		for (let i = 0; i < node.length; i++) {
+			const anchor = normalizeAnchor(node[i]);
+			if (anchor) return anchor;
+		}
+		return;
+	} else if (isVaporComponent(node)) return normalizeAnchor(node.block);
+	else {
+		const getEffectiveOutput = node.getEffectiveOutput;
+		const nodes = getEffectiveOutput ? getEffectiveOutput.call(node) : node.nodes;
+		return isValidBlock(nodes) ? normalizeAnchor(nodes) : node.anchor || normalizeAnchor(nodes);
+	}
 }
 function getRestElement(val, keys) {
 	const res = {};
@@ -15751,6 +16016,10 @@ function isForBlock(block) {
 }
 //#endregion
 //#region packages/runtime-vapor/src/apiTemplateRef.ts
+function getTemplateRefUpdateFragment(el) {
+	if (isDynamicFragment(el)) return el;
+	if (isVaporComponent(el) && isAsyncWrapper(el)) return el.block;
+}
 function ensureCleanup(el) {
 	let cleanupRef = refCleanups.get(el);
 	if (!cleanupRef) {
@@ -15768,8 +16037,8 @@ function createTemplateRefSetter() {
 	const oldRefMap = /* @__PURE__ */ new WeakMap();
 	const setRefMap = /* @__PURE__ */ new WeakMap();
 	return (el, ref, refFor, refKey) => {
-		if (isDynamicFragment(el) || isVaporComponent(el) && isAsyncWrapper(el)) {
-			const frag = isDynamicFragment(el) ? el : el.block;
+		const frag = getTemplateRefUpdateFragment(el);
+		if (frag) {
 			const doSet = () => {
 				if (isVaporComponent(el) && el.isDeactivated) return;
 				oldRefMap.set(el, setRef$1(instance, el, ref, oldRefMap.get(el), refFor, refKey));
@@ -15784,6 +16053,19 @@ function createTemplateRefSetter() {
 		return oldRef;
 	};
 }
+function setStaticTemplateRef(el, ref, refFor, refKey) {
+	const instance = currentInstance;
+	const oldRef = setRef$1(instance, el, ref, void 0, refFor, refKey);
+	const frag = getTemplateRefUpdateFragment(el);
+	if (frag) (frag.onUpdated || (frag.onUpdated = [])).push(() => {
+		if (isVaporComponent(el) && el.isDeactivated) return;
+		setRef$1(instance, el, ref, oldRef, refFor, refKey);
+	});
+	return oldRef;
+}
+function setTemplateRefBinding(el, getter, setter = createTemplateRefSetter(), refFor, refKey) {
+	renderEffect(() => setter(el, getter(), refFor, refKey));
+}
 /**
 * Function for handling a template ref
 */
@@ -15924,6 +16206,7 @@ function createDynamicComponent(getter, rawProps, rawSlots, isSingleRoot, once)
 	if (!isHydrating$1) resetInsertionState();
 	const hydrationCursor = isHydrating$1 ? captureHydrationCursor() : null;
 	const frag = new DynamicFragment("dynamic-component");
+	const normalizedRawSlots = normalizeRawSlots(rawSlots);
 	const scopeOwner = getScopeOwner();
 	const renderFn = () => {
 		const value = getter();
@@ -15943,7 +16226,7 @@ function createDynamicComponent(getter, rawProps, rawSlots, isSingleRoot, once)
 				}
 				return frag;
 			}
-			return createComponentWithFallback(withScopeOwner(scopeOwner, () => resolveDynamicComponent(value)), rawProps, rawSlots, isSingleRoot, once, appContext);
+			return createComponentWithFallback(withScopeOwner(scopeOwner, () => resolveDynamicComponent(value)), rawProps, normalizedRawSlots, isSingleRoot, once, appContext);
 		}, value);
 	};
 	if (once) renderFn();
@@ -16043,6 +16326,7 @@ function withVaporDirectives(node, dirs) {
 //#region packages/runtime-vapor/src/components/TransitionGroup.ts
 const positionMap = /* @__PURE__ */ new WeakMap();
 const newPositionMap = /* @__PURE__ */ new WeakMap();
+const transitionGroupUpdateOwnerMap = /* @__PURE__ */ new WeakMap();
 let isForHydrationAnchorResolverRegistered = false;
 let currentForHydrationContainer;
 function ensureForHydrationAnchorResolver() {
@@ -16073,16 +16357,18 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 		ensureTransitionHooksRegistered();
 		const instance = currentInstance;
 		const state = useTransitionState();
-		let cssTransitionProps = resolveTransitionProps(props);
+		let cssTransitionProps;
 		const propsProxy = new Proxy({}, { get(_, key) {
 			return cssTransitionProps[key];
 		} });
-		renderEffect(() => {
-			cssTransitionProps = resolveTransitionProps(props);
-		});
-		let prevChildren;
+		renderEffect(() => cssTransitionProps = resolveTransitionProps(props), true);
+		let prevChildren = [];
+		let isUpdatePending = false;
+		let isUpdatedPending = false;
 		let slottedBlock = [];
-		onBeforeUpdate(() => {
+		const beforeUpdate = () => {
+			if (isUpdatePending) return;
+			isUpdatePending = true;
 			prevChildren = [];
 			const children = getTransitionBlocks(slottedBlock);
 			for (let i = 0; i < children.length; i++) {
@@ -16094,8 +16380,11 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 					positionMap.set(child, el.getBoundingClientRect());
 				}
 			}
-		});
-		onUpdated(() => {
+		};
+		const flushUpdated = () => {
+			isUpdatedPending = false;
+			if (!isUpdatePending) return;
+			isUpdatePending = false;
 			if (!prevChildren.length) return;
 			const moveClass = props.moveClass || `${props.name || "v"}-move`;
 			const firstChild = getFirstConnectedChild(prevChildren);
@@ -16112,7 +16401,14 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 			forceReflow();
 			movedChildren.forEach((c) => handleMovedChildren(getTransitionElement(c), moveClass));
 			prevChildren = [];
-		});
+		};
+		const updated = () => {
+			if (!isUpdatePending || isUpdatedPending) return;
+			isUpdatedPending = true;
+			queuePostFlushCb(flushUpdated);
+		};
+		onBeforeUpdate(beforeUpdate);
+		onUpdated(updated);
 		const frag = new DynamicFragment("transition-group");
 		let currentTag;
 		let currentSlot;
@@ -16128,7 +16424,7 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 				ensureForHydrationAnchorResolver();
 				prevForHydrationContainer = currentForHydrationContainer;
 				currentForHydrationContainer = container;
-				nextNode = locateNextNode(container);
+				nextNode = nextLogicalSibling(container);
 				setCurrentHydrationNode(container.firstChild || container);
 			}
 			let block = slottedBlock;
@@ -16136,7 +16432,10 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 			try {
 				frag.update(() => {
 					block = slot && slot() || [];
-					transitionBlocks = applyGroupTransitionHooks(block, propsProxy, state, instance);
+					transitionBlocks = applyGroupTransitionHooks(block, propsProxy, state, instance, {
+						beforeUpdate,
+						updated
+					});
 					if (container) {
 						if (!isHydrating$1) insert(block, container);
 						return container;
@@ -16158,9 +16457,9 @@ const VaporTransitionGroup = /* @__PURE__ */ decorate(/* @__PURE__ */ defineVapo
 		return frag;
 	}
 }));
-function applyGroupTransitionHooks(block, props, state, instance) {
+function applyGroupTransitionHooks(block, props, state, instance, updateHooks) {
 	const fragments = [];
-	const children = getTransitionBlocks(block, (frag) => fragments.push(frag));
+	const children = getTransitionBlocks(block, (frag) => fragments.push(frag), (owner) => trackTransitionGroupUpdate(owner, updateHooks));
 	for (let i = 0; i < children.length; i++) {
 		const child = children[i];
 		if (isValidTransitionBlock(child)) if (child.$key != null) setTransitionHooks$1(child, resolveTransitionHooks$1(child, props, state, instance));
@@ -16168,11 +16467,45 @@ function applyGroupTransitionHooks(block, props, state, instance) {
 	}
 	fragments.forEach((frag) => {
 		const hooks = resolveTransitionHooks$1(frag, props, state, instance);
-		hooks.applyGroup = applyGroupTransitionHooks;
+		hooks.applyGroup = (block, props, state, instance) => applyGroupTransitionHooks(block, props, state, instance, updateHooks);
 		frag.$transition = hooks;
 	});
 	return children;
 }
+function trackTransitionGroupUpdate(owner, updateHooks) {
+	const registeredHooks = transitionGroupUpdateOwnerMap.get(owner);
+	if (registeredHooks) {
+		registeredHooks.beforeUpdate = updateHooks.beforeUpdate;
+		registeredHooks.updated = updateHooks.updated;
+		return;
+	}
+	transitionGroupUpdateOwnerMap.set(owner, updateHooks);
+	if (isFragment(owner)) {
+		(owner.onBeforeUpdate || (owner.onBeforeUpdate = [])).push(() => updateHooks.beforeUpdate());
+		(owner.onUpdated || (owner.onUpdated = [])).push(() => updateHooks.updated());
+	} else {
+		let isPending = false;
+		const flushUpdated = () => {
+			isPending = false;
+			updateHooks.updated();
+		};
+		owner.scope.run(() => {
+			watch$1(() => {
+				const prev = setCurrentInstance(owner, owner.scope);
+				try {
+					return resolveDynamicProps(owner.rawProps);
+				} finally {
+					setCurrentInstance(...prev);
+				}
+			}, () => {
+				if (isPending) return;
+				isPending = true;
+				updateHooks.beforeUpdate();
+				queuePostFlushCb(flushUpdated);
+			});
+		});
+	}
+}
 function inheritKey(children, key) {
 	if (key === void 0 || children.length === 0) return;
 	for (let i = 0; i < children.length; i++) {
@@ -16180,25 +16513,30 @@ function inheritKey(children, key) {
 		child.$key = String(key) + String(child.$key != null ? child.$key : i);
 	}
 }
-function getTransitionBlocks(block, onFragment) {
+function getTransitionBlocks(block, onFragment, onUpdateOwner) {
 	let children = [];
 	if (block instanceof Element) children.push(block);
 	else if (isVaporComponent(block)) {
-		const blocks = getTransitionBlocks(block.block, onFragment);
+		const isRootSlot = block.block instanceof SlotFragment;
+		if (onUpdateOwner && !isRootSlot) onUpdateOwner(block);
+		const blocks = getTransitionBlocks(block.block, onFragment, isRootSlot ? onUpdateOwner : void 0);
 		inheritKey(blocks, block.$key);
 		children.push(...blocks);
 	} else if (isArray(block)) for (let i = 0; i < block.length; i++) {
 		const b = block[i];
-		const blocks = getTransitionBlocks(b, onFragment);
+		const blocks = getTransitionBlocks(b, onFragment, onUpdateOwner);
 		if (isForBlock(b)) blocks.forEach((block) => block.$key = b.key);
 		children.push(...blocks);
 	}
-	else if (isFragment(block)) if (isInteropEnabled && block.vnode) children.push(block);
-	else {
+	else if (isFragment(block)) {
 		if (onFragment) onFragment(block);
-		const blocks = getTransitionBlocks(block.nodes, onFragment);
-		inheritKey(blocks, block.$key);
-		children.push(...blocks);
+		if (onUpdateOwner) onUpdateOwner(block);
+		if (isInteropEnabled && block.vnode) children.push(block);
+		else {
+			const blocks = getTransitionBlocks(block.nodes, onFragment, onUpdateOwner);
+			inheritKey(blocks, block.$key);
+			children.push(...blocks);
+		}
 	}
 	return children;
 }
@@ -16225,4 +16563,4 @@ function getFirstConnectedChild(children) {
 	}
 }
 //#endregion
-export { BaseTransition, BaseTransitionPropsValidators, Comment$1 as Comment, DeprecationTypes, DynamicFragment, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, MismatchTypes, MoveType, NULL_DYNAMIC_COMPONENT, ReactiveEffect, SchedulerJobFlags, Static, Suspense, Teleport, Text$1 as Text, TrackOpTypes, Transition, TransitionGroup, TransitionPropsValidators, TriggerOpTypes, VaporElement, VaporFragment, VaporKeepAlive, VaporSlot, VaporTeleport, VaporTransition, VaporTransitionGroup, VueElement, VueElementBase, activate, applyCheckboxModel, applyDynamicModel, applyRadioModel, applySelectModel, applyTextModel, applyVShow, assertNumber, baseApplyTranslation, baseEmit, baseNormalizePropsOptions, baseResolveTransitionHooks, baseUseCssVars, callPendingCbs, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, checkTransitionMode, child, cloneVNode, compatUtils, compile, computed, createApp, createAppAPI, createAsyncComponentContext, createBlock, createCanSetSetupRefChecker, createCommentVNode, createComponent, createComponentWithFallback, createDynamicComponent, createElementBlock, createBaseVNode as createElementVNode, createFor, createForSlots, createHydrationRenderer, createIf, createInternalObject, createInvoker, createKeyedFragment, createPlainElement, createPropsRestProxy, createRenderer, createSSRApp, createSelector, createSlot, createSlots, createStaticVNode, createTemplateRefSetter, createTextNode, createTextVNode, createVNode, createVaporApp, createVaporSSRApp, currentInstance, customRef, deactivate, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSSRCustomElement, defineSlots, defineVaporAsyncComponent, defineVaporComponent, defineVaporCustomElement, defineVaporSSRCustomElement, delegate, delegateEvents, devtools, devtoolsComponentAdded, effect, effectScope, endMeasure, ensureHydrationRenderer, ensureRenderer, ensureValidVNode, ensureVaporSlotFallback, expose, flushOnAppMount, forceReflow, getAttributeMismatch, getComponentName, getCurrentInstance, getCurrentScope, getCurrentWatcher, getDefaultValue, getFunctionalFallthrough, getInheritedScopeIds, getRestElement, getTransitionRawChildren, guardReactiveProps, h, handleError, handleMovedChildren, hasCSSTransform, hasInjectionContext, hydrate, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initDirectivesForSSR, initFeatureFlags, inject, insert, invalidateMount, invokeDirectiveHook, isAsyncWrapper, isEmitListener, isFragment, isHydrating, isKeepAlive, isMapEqual, isMemoSame, isMismatchAllowed, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isSetEqual, isShallow, isTeleportDeferred, isTeleportDisabled, isTemplateNode, isTemplateRefKey, isVNode, isValidHtmlOrSvgAttribute, isVaporComponent, knownTemplateRefs, leaveCbKey, markAsyncBoundary, markRaw, matches, mergeDefaults, mergeModels, mergeProps, next, nextTick, nextUid, nodeOps, normalizeClass, normalizeContainer, normalizeProps, normalizeRef, normalizeStyle, normalizeVNode, nthChild, on, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, onWatcherCleanup, openBlock, patchProp, patchStyle, performAsyncHydrate, performTransitionEnter, performTransitionLeave, popScopeId, popWarningContext, prepend, provide, proxyRefs, pushScopeId, pushWarningContext, queueJob, queuePostFlushCb, reactive, readonly, ref, registerHMR, registerRuntimeCompiler, remove, render, renderEffect, renderList, renderSlot, resetShapeFlag, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolvePropValue, resolveTarget as resolveTeleportTarget, resolveTransitionHooks, resolveTransitionProps, setAttr, setBlockHtml, setBlockKey, setBlockText, setBlockTracking, setClass, setClassName, setCurrentInstance, setCurrentRenderingInstance, setDOMProp, setDevtoolsHook, setDynamicEvents, setDynamicProps, setElementText, setHtml, setInsertionState, setIsHydratingEnabled, setProp, setRef, setStyle, setText, setTransitionHooks, setValue, setVarsOnNode, shallowReactive, shallowReadonly, shallowRef, shouldSetAsProp, shouldSetAsPropForVueCE, shouldUpdateComponent, simpleSetCurrentInstance, ssrContextKey, ssrUtils, startMeasure, stop, svgNS, template, toClassSet, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toStyleMap, toValue, transformVNodeArgs, triggerRef, txt, unref, unregisterHMR, unsafeToTrustedHTML, useAsyncComponentState, useAttrs, useCssModule, useCssVars, useHost, useId, useInstanceOption, useModel, useSSRContext, useShadowRoot, useSlots, useTemplateRef, useTransitionState, useVaporCssVars, vModelCheckbox, vModelCheckboxInit, vModelCheckboxUpdate, vModelDynamic, getValue as vModelGetValue, vModelRadio, vModelSelect, vModelSelectInit, vModelSetSelected, vModelText, vModelTextInit, vModelTextUpdate, vShow, vShowHidden, vShowOriginalDisplay, validateComponentName, validateProps, vaporInteropPlugin, version, warn, warnExtraneousAttributes, warnPropMismatch, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId, withVaporCtx, withVaporDirectives, xlinkNS };
+export { BaseTransition, BaseTransitionPropsValidators, Comment$1 as Comment, DeprecationTypes, DynamicFragment, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, MismatchTypes, MoveType, NULL_DYNAMIC_COMPONENT, ReactiveEffect, SchedulerJobFlags, Static, Suspense, Teleport, Text$1 as Text, TrackOpTypes, Transition, TransitionGroup, TransitionPropsValidators, TriggerOpTypes, VaporElement, VaporFragment, VaporKeepAlive, VaporSlot, VaporTeleport, VaporTransition, VaporTransitionGroup, VueElement, VueElementBase, activate, applyCheckboxModel, applyDynamicModel, applyRadioModel, applySelectModel, applyTextModel, applyVShow, assertNumber, baseApplyTranslation, baseEmit, baseNormalizePropsOptions, baseResolveTransitionHooks, baseUseCssVars, callPendingCbs, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, checkTransitionMode, child, cloneVNode, compatUtils, compile, computed, createApp, createAppAPI, createAssetComponent, createAsyncComponentContext, createBlock, createCanSetSetupRefChecker, createCommentVNode, createComponent, createComponentWithFallback, createDynamicComponent, createElementBlock, createBaseVNode as createElementVNode, createFor, createForSlots, createHydrationRenderer, createIf, createInternalObject, createInvoker, createKeyedFragment, createPlainElement, createPropsRestProxy, createRenderer, createSSRApp, createSelector, createSlot, createSlots, createStaticVNode, createTemplateRefSetter, createTextNode, createTextVNode, createVNode, createVaporApp, createVaporSSRApp, currentInstance, customRef, deactivate, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSSRCustomElement, defineSlots, defineVaporAsyncComponent, defineVaporComponent, defineVaporCustomElement, defineVaporSSRCustomElement, delegate, delegateEvents, devtools, devtoolsComponentAdded, effect, effectScope, endMeasure, ensureHydrationRenderer, ensureRenderer, ensureValidVNode, ensureVaporSlotFallback, expose, flushOnAppMount, forceReflow, getAttributeMismatch, getComponentName, getCurrentInstance, getCurrentScope, getCurrentWatcher, getDefaultValue, getFunctionalFallthrough, getInheritedScopeIds, getRestElement, getTransitionRawChildren, guardReactiveProps, h, handleError, handleMovedChildren, hasCSSTransform, hasInjectionContext, hydrate, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initDirectivesForSSR, initFeatureFlags, inject, insert, invalidateMount, invokeDirectiveHook, isAsyncWrapper, isEmitListener, isFragment, isHydrating, isKeepAlive, isMapEqual, isMemoSame, isMismatchAllowed, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isSetEqual, isShallow, isTeleportDeferred, isTeleportDisabled, isTemplateNode, isTemplateRefKey, isVNode, isValidHtmlOrSvgAttribute, isVaporComponent, knownTemplateRefs, leaveCbKey, markAsyncBoundary, markRaw, matches, mergeDefaults, mergeModels, mergeProps, next, nextTick, nextUid, nodeOps, normalizeClass, normalizeContainer, normalizeProps, normalizeRef, normalizeStyle, normalizeVNode, nthChild, on, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onBinding, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, onWatcherCleanup, openBlock, patchProp, patchStyle, performAsyncHydrate, performTransitionEnter, performTransitionLeave, popScopeId, popWarningContext, prepend, provide, proxyRefs, pushScopeId, pushWarningContext, queueJob, queuePostFlushCb, reactive, readonly, ref, registerHMR, registerRuntimeCompiler, remove, render, renderEffect, renderList, renderSlot, resetShapeFlag, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolvePropValue, resolveTarget as resolveTeleportTarget, resolveTransitionHooks, resolveTransitionProps, setAttr, setBlockHtml, setBlockKey, setBlockText, setBlockTracking, setClass, setClassName, setCurrentInstance, setCurrentRenderingInstance, setDOMProp, setDevtoolsHook, setDynamicEvents, setDynamicProps, setElementText, setHtml, setInsertionState, setIsHydratingEnabled, setProp, setRef, setStaticTemplateRef, setStyle, setTemplateRefBinding, setText, setTransitionHooks, setValue, setVarsOnNode, shallowReactive, shallowReadonly, shallowRef, shouldSetAsProp, shouldSetAsPropForVueCE, shouldUpdateComponent, simpleSetCurrentInstance, ssrContextKey, ssrUtils, startMeasure, stop, svgNS, template, toClassSet, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toStyleMap, toValue, transformVNodeArgs, triggerRef, txt, unref, unregisterHMR, unsafeToTrustedHTML, useAsyncComponentState, useAttrs, useCssModule, useCssVars, useHost, useId, useInstanceOption, useModel, useSSRContext, useShadowRoot, useSlots, useTemplateRef, useTransitionState, useVaporCssVars, vModelCheckbox, vModelCheckboxInit, vModelCheckboxUpdate, vModelDynamic, getValue as vModelGetValue, vModelRadio, vModelSelect, vModelSelectInit, vModelSetSelected, vModelText, vModelTextInit, vModelTextUpdate, vShow, vShowHidden, vShowOriginalDisplay, validateComponentName, validateProps, vaporInteropPlugin, version, warn, warnExtraneousAttributes, warnPropMismatch, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId, withVaporCtx, withVaporDirectives, withVaporKeys, withVaporModifiers, xlinkNS };