@vue/compiler-core 3.6.0-beta.9 → 3.6.0-rc.10

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

@@ -1,5 +1,5 @@
 /**
-  * @vue/compiler-core v3.6.0-beta.9
+  * @vue/compiler-core v3.6.0-rc.10
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -547,13 +547,14 @@ var Tokenizer = class {
 		}
 	}
 	stateInterpolationOpen(c) {
-		if (c === this.delimiterOpen[this.delimiterIndex]) if (this.delimiterIndex === this.delimiterOpen.length - 1) {
-			const start = this.index + 1 - this.delimiterOpen.length;
-			if (start > this.sectionStart) this.cbs.ontext(this.sectionStart, start);
-			this.state = 3;
-			this.sectionStart = start;
-		} else this.delimiterIndex++;
-		else if (this.inRCDATA) {
+		if (c === this.delimiterOpen[this.delimiterIndex]) {
+			if (this.delimiterIndex === this.delimiterOpen.length - 1) {
+				const start = this.index + 1 - this.delimiterOpen.length;
+				if (start > this.sectionStart) this.cbs.ontext(this.sectionStart, start);
+				this.state = 3;
+				this.sectionStart = start;
+			} else this.delimiterIndex++;
+		} else if (this.inRCDATA) {
 			this.state = 32;
 			this.stateInRCDATA(c);
 		} else {
@@ -569,13 +570,14 @@ var Tokenizer = class {
 		}
 	}
 	stateInterpolationClose(c) {
-		if (c === this.delimiterClose[this.delimiterIndex]) if (this.delimiterIndex === this.delimiterClose.length - 1) {
-			this.cbs.oninterpolation(this.sectionStart, this.index + 1);
-			if (this.inRCDATA) this.state = 32;
-			else this.state = 1;
-			this.sectionStart = this.index + 1;
-		} else this.delimiterIndex++;
-		else {
+		if (c === this.delimiterClose[this.delimiterIndex]) {
+			if (this.delimiterIndex === this.delimiterClose.length - 1) {
+				this.cbs.oninterpolation(this.sectionStart, this.index + 1);
+				if (this.inRCDATA) this.state = 32;
+				else this.state = 1;
+				this.sectionStart = this.index + 1;
+			} else this.delimiterIndex++;
+		} else {
 			this.state = 3;
 			this.stateInterpolation(c);
 		}
@@ -690,9 +692,10 @@ var Tokenizer = class {
 			this.sectionStart = this.index;
 			if (this.mode === 0) this.state = 6;
 			else if (this.inSFCRoot) this.state = 34;
-			else if (!this.inXML) if (c === 116) this.state = 30;
-			else this.state = c === 115 ? 29 : 6;
-			else this.state = 6;
+			else if (!this.inXML) {
+				if (c === 116) this.state = 30;
+				else this.state = c === 115 ? 29 : 6;
+			} else this.state = 6;
 		} else if (c === 47) this.state = 8;
 		else {
 			this.state = 1;
@@ -1045,9 +1048,7 @@ var Tokenizer = class {
 				case 24:
 					this.stateInProcessingInstruction(c);
 					break;
-				case 33:
-					this.stateInEntity();
-					break;
+				case 33: this.stateInEntity();
 			}
 			this.index++;
 		}
@@ -1076,9 +1077,10 @@ var Tokenizer = class {
 	handleTrailingData() {
 		const endIndex = this.buffer.length;
 		if (this.sectionStart >= endIndex) return;
-		if (this.state === 28) if (this.currentSequence === Sequences.CdataEnd) this.cbs.oncdata(this.sectionStart, endIndex);
-		else this.cbs.oncomment(this.sectionStart, endIndex);
-		else if (this.state === 6 || this.state === 11 || this.state === 18 || this.state === 17 || this.state === 12 || this.state === 13 || this.state === 14 || this.state === 15 || this.state === 16 || this.state === 20 || this.state === 19 || this.state === 21 || this.state === 9) {} else this.cbs.ontext(this.sectionStart, endIndex);
+		if (this.state === 28) {
+			if (this.currentSequence === Sequences.CdataEnd) this.cbs.oncdata(this.sectionStart, endIndex);
+			else this.cbs.oncomment(this.sectionStart, endIndex);
+		} else if (this.state === 6 || this.state === 11 || this.state === 18 || this.state === 17 || this.state === 12 || this.state === 13 || this.state === 14 || this.state === 15 || this.state === 16 || this.state === 20 || this.state === 19 || this.state === 21 || this.state === 9) {} else this.cbs.ontext(this.sectionStart, endIndex);
 	}
 	emitCodePoint(cp, consumed) {}
 };
@@ -1411,9 +1413,7 @@ function extractIdentifiers(param, nodes = []) {
 		case "RestElement":
 			extractIdentifiers(param.argument, nodes);
 			break;
-		case "AssignmentPattern":
-			extractIdentifiers(param.left, nodes);
-			break;
+		case "AssignmentPattern": extractIdentifiers(param.left, nodes);
 	}
 	return nodes;
 }
@@ -1549,12 +1549,10 @@ const isMemberExpressionBrowser = (exp) => {
 					if (!--currentOpenParensCount) state = stateStack.pop();
 				}
 				break;
-			case 3:
-				if (char === currentStringType) {
-					state = stateStack.pop();
-					currentStringType = null;
-				}
-				break;
+			case 3: if (char === currentStringType) {
+				state = stateStack.pop();
+				currentStringType = null;
+			}
 		}
 	}
 	return !currentOpenBracketCount && !currentOpenParensCount;
@@ -1625,7 +1623,7 @@ function isTemplateNode(node) {
 function isSlotOutlet(node) {
 	return node.type === 1 && node.tagType === 2;
 }
-const propsHelperSet = new Set([NORMALIZE_PROPS, GUARD_REACTIVE_PROPS]);
+const propsHelperSet = /* @__PURE__ */ new Set([NORMALIZE_PROPS, GUARD_REACTIVE_PROPS]);
 function getUnnormalizedProps(props, callPath = []) {
 	if (props && !isString(props) && props.type === 14) {
 		const callee = props.callee;
@@ -1634,6 +1632,7 @@ function getUnnormalizedProps(props, callPath = []) {
 	return [props, callPath];
 }
 function injectProp(node, prop, context) {
+	if (node.type !== 13 && injectSlotKey(node, prop)) return;
 	let propsWithInjection;
 	/**
 	* 1. mergeProps(...)
@@ -1667,11 +1666,26 @@ function injectProp(node, prop, context) {
 		propsWithInjection = createCallExpression(context.helper(MERGE_PROPS), [createObjectExpression([prop]), props]);
 		if (parentCall && parentCall.callee === GUARD_REACTIVE_PROPS) parentCall = callPath[callPath.length - 2];
 	}
-	if (node.type === 13) if (parentCall) parentCall.arguments[0] = propsWithInjection;
-	else node.props = propsWithInjection;
-	else if (parentCall) parentCall.arguments[0] = propsWithInjection;
+	if (node.type === 13) {
+		if (parentCall) parentCall.arguments[0] = propsWithInjection;
+		else node.props = propsWithInjection;
+	} else if (parentCall) parentCall.arguments[0] = propsWithInjection;
 	else node.arguments[2] = propsWithInjection;
 }
+function injectSlotKey(node, prop) {
+	var _node$arguments, _node$arguments2, _node$arguments3;
+	if (prop.key.type !== 4 || prop.key.content !== "key") return false;
+	const props = node.arguments[2];
+	if (props && !isString(props)) {
+		const [unnormalizedProps] = getUnnormalizedProps(props);
+		if (unnormalizedProps && !isString(unnormalizedProps) && unnormalizedProps.type === 15 && hasProp(prop, unnormalizedProps)) return true;
+	}
+	(_node$arguments = node.arguments)[2] || (_node$arguments[2] = "{}");
+	(_node$arguments2 = node.arguments)[3] || (_node$arguments2[3] = "undefined");
+	(_node$arguments3 = node.arguments)[4] || (_node$arguments3[4] = "undefined");
+	node.arguments[5] = prop.value;
+	return true;
+}
 function hasProp(prop, props) {
 	let result = false;
 	if (prop.key.type === 4) {
@@ -1972,10 +1986,7 @@ const tokenizer = new Tokenizer(stack, {
 			case 18:
 			case 19:
 			case 20:
-			case 21:
-				emitError(9, end);
-				break;
-			default: break;
+			case 21: emitError(9, end);
 		}
 		for (let index = 0; index < stack.length; index++) {
 			onCloseTag(stack[index], end - 1);
@@ -1983,7 +1994,7 @@ const tokenizer = new Tokenizer(stack, {
 		}
 	},
 	oncdata(start, end) {
-		if (stack[0].ns !== 0) onText(getSlice(start, end), start, end);
+		if ((stack[0] ? stack[0].ns : currentOptions.ns) !== 0) onText(getSlice(start, end), start, end);
 		else emitError(1, start - 9);
 	},
 	onprocessinginstruction(start) {
@@ -2125,7 +2136,7 @@ function backTrack(index, c) {
 	while (currentInput.charCodeAt(i) !== c && i >= 0) i--;
 	return i;
 }
-const specialTemplateDir = new Set([
+const specialTemplateDir = /* @__PURE__ */ new Set([
 	"if",
 	"else",
 	"else-if",
@@ -2161,16 +2172,18 @@ function condenseWhitespace(nodes) {
 	let removedWhitespace = false;
 	for (let i = 0; i < nodes.length; i++) {
 		const node = nodes[i];
-		if (node.type === 2) if (!inPre) {
-			if (isAllWhitespace(node.content)) {
-				const prev = nodes[i - 1] && nodes[i - 1].type;
-				const next = nodes[i + 1] && nodes[i + 1].type;
-				if (!prev || !next || shouldCondense && (prev === 3 && (next === 3 || next === 1) || prev === 1 && (next === 3 || next === 1 && hasNewlineChar(node.content)))) {
-					removedWhitespace = true;
-					nodes[i] = null;
-				} else node.content = " ";
-			} else if (shouldCondense) node.content = condense(node.content);
-		} else node.content = node.content.replace(windowsNewlineRE, "\n");
+		if (node.type === 2) {
+			if (!inPre) {
+				if (isAllWhitespace(node.content)) {
+					const prev = nodes[i - 1] && nodes[i - 1].type;
+					const next = nodes[i + 1] && nodes[i + 1].type;
+					if (!prev || !next || shouldCondense && (prev === 3 && (next === 3 || next === 1) || prev === 1 && (next === 3 || next === 1 && hasNewlineChar(node.content)))) {
+						removedWhitespace = true;
+						nodes[i] = null;
+					} else node.content = " ";
+				} else if (shouldCondense) node.content = condense(node.content);
+			} else node.content = node.content.replace(windowsNewlineRE, "\n");
+		}
 	}
 	return removedWhitespace ? nodes.filter(Boolean) : nodes;
 }
@@ -2435,7 +2448,7 @@ function getConstantType(node, context) {
 			return 0;
 	}
 }
-const allowHoistedHelperSet = new Set([
+const allowHoistedHelperSet = /* @__PURE__ */ new Set([
 	NORMALIZE_CLASS,
 	NORMALIZE_STYLE,
 	NORMALIZE_PROPS,
@@ -2512,8 +2525,10 @@ function createTransformContext(root, { filename = "", prefixIdentifiers = false
 		imports: [],
 		cached: [],
 		constantCache: /* @__PURE__ */ new WeakMap(),
+		vForMemoKeyedNodes: /* @__PURE__ */ new WeakSet(),
 		temps: 0,
 		identifiers: Object.create(null),
+		identifierScopes: Object.create(null),
 		scopes: {
 			vFor: 0,
 			vSlot: 0,
@@ -2567,8 +2582,12 @@ function createTransformContext(root, { filename = "", prefixIdentifiers = false
 			context.parent.children.splice(removalIndex, 1);
 		},
 		onNodeRemoved: NOOP,
-		addIdentifiers(exp) {},
+		addIdentifiers(exp, type = "local") {},
 		removeIdentifiers(exp) {},
+		isSlotScopeIdentifier(name) {
+			const scopes = context.identifierScopes[name];
+			return scopes ? scopes[scopes.length - 1] === "slot" : false;
+		},
 		hoist(exp) {
 			if (isString(exp)) exp = createSimpleExpression(exp);
 			context.hoists.push(exp);
@@ -2590,7 +2609,7 @@ function transform(root, options) {
 	traverseNode(root, context);
 	if (options.hoistStatic) cacheStatic(root, context);
 	if (!options.ssr) createRootCodegen(root, context);
-	root.helpers = new Set([...context.helpers.keys()]);
+	root.helpers = /* @__PURE__ */ new Set([...context.helpers.keys()]);
 	root.components = [...context.components];
 	root.directives = [...context.directives];
 	root.imports = context.imports;
@@ -2637,8 +2656,10 @@ function traverseNode(node, context) {
 	const exitFns = [];
 	for (let i = 0; i < nodeTransforms.length; i++) {
 		const onExit = nodeTransforms[i](node, context);
-		if (onExit) if (isArray(onExit)) exitFns.push(...onExit);
-		else exitFns.push(onExit);
+		if (onExit) {
+			if (isArray(onExit)) exitFns.push(...onExit);
+			else exitFns.push(onExit);
+		}
 		if (!context.currentNode) return;
 		else node = context.currentNode;
 	}
@@ -2655,9 +2676,7 @@ function traverseNode(node, context) {
 		case 10:
 		case 11:
 		case 1:
-		case 0:
-			traverseChildren(node, context);
-			break;
+		case 0: traverseChildren(node, context);
 	}
 	context.currentNode = node;
 	let i = exitFns.length;
@@ -2863,10 +2882,12 @@ function genNodeList(nodes, context, multilines = false, comma = true) {
 		if (isString(node)) push(node, -3);
 		else if (isArray(node)) genNodeListAsArray(node, context);
 		else genNode(node, context);
-		if (i < nodes.length - 1) if (multilines) {
-			comma && push(",");
-			newline();
-		} else comma && push(", ");
+		if (i < nodes.length - 1) {
+			if (multilines) {
+				comma && push(",");
+				newline();
+			} else comma && push(", ");
+		}
 	}
 }
 function genNode(node, context) {
@@ -2932,6 +2953,7 @@ function genNode(node, context) {
 		case 24: break;
 		case 25: break;
 		case 26: break;
+		/* v8 ignore start */
 		case 10: break;
 		default: if (!!(process.env.NODE_ENV !== "production")) {
 			assert(false, `unhandled codegen node type: ${node.type}`);
@@ -2978,9 +3000,12 @@ function genVNodeCall(node, context) {
 	const { push, helper, pure } = context;
 	const { tag, props, children, patchFlag, dynamicProps, directives, isBlock, disableTracking, isComponent } = node;
 	let patchFlagString;
-	if (patchFlag) if (!!(process.env.NODE_ENV !== "production")) if (patchFlag < 0) patchFlagString = patchFlag + ` /* ${PatchFlagNames[patchFlag]} */`;
-	else patchFlagString = patchFlag + ` /* ${Object.keys(PatchFlagNames).map(Number).filter((n) => n > 0 && patchFlag & n).map((n) => PatchFlagNames[n]).join(`, `)} */`;
-	else patchFlagString = String(patchFlag);
+	if (patchFlag) {
+		if (!!(process.env.NODE_ENV !== "production")) {
+			if (patchFlag < 0) patchFlagString = patchFlag + ` /* ${PatchFlagNames[patchFlag]} */`;
+			else patchFlagString = patchFlag + ` /* ${Object.keys(PatchFlagNames).map(Number).filter((n) => n > 0 && patchFlag & n).map((n) => PatchFlagNames[n]).join(`, `)} */`;
+		} else patchFlagString = String(patchFlag);
+	}
 	if (directives) push(helper(WITH_DIRECTIVES) + `(`);
 	if (isBlock) push(`(${helper(OPEN_BLOCK)}(${disableTracking ? `true` : ``}), `);
 	if (pure) push(PURE_ANNOTATION);
@@ -3142,7 +3167,7 @@ function validateBrowserExpression(node, context, asParams = false, asRawStateme
 }
 //#endregion
 //#region packages/compiler-core/src/transforms/transformExpression.ts
-const isLiteralWhitelisted = /* @__PURE__ */ makeMap("true,false,null,this");
+const isLiteralWhitelisted = /*@__PURE__*/ makeMap("true,false,null,this");
 const transformExpression = (node, context) => {
 	if (node.type === 5) node.content = processExpression(node.content, context);
 	else if (node.type === 1) {
@@ -3152,7 +3177,7 @@ const transformExpression = (node, context) => {
 			if (dir.type === 7 && dir.name !== "for") {
 				const exp = dir.exp;
 				const arg = dir.arg;
-				if (exp && exp.type === 4 && !(dir.name === "on" && arg) && !(memo && arg && arg.type === 4 && arg.content === "key")) dir.exp = processExpression(exp, context, dir.name === "slot");
+				if (exp && exp.type === 4 && !(dir.name === "on" && arg) && !(memo && context.vForMemoKeyedNodes.has(node) && arg && arg.type === 4 && arg.content === "key")) dir.exp = processExpression(exp, context, dir.name === "slot");
 				if (arg && arg.type === 4 && !arg.isStatic) dir.arg = processExpression(arg, context);
 			}
 		}
@@ -3255,16 +3280,17 @@ function createChildrenCodegenNode(branch, keyIndex, context) {
 	const keyProperty = createObjectProperty(`key`, createSimpleExpression(`${keyIndex}`, false, locStub, 2));
 	const { children } = branch;
 	const firstChild = children[0];
-	if (children.length !== 1 || firstChild.type !== 1) if (children.length === 1 && firstChild.type === 11) {
-		const vnodeCall = firstChild.codegenNode;
-		injectProp(vnodeCall, keyProperty, context);
-		return vnodeCall;
+	if (children.length !== 1 || firstChild.type !== 1) {
+		if (children.length === 1 && firstChild.type === 11) {
+			const vnodeCall = firstChild.codegenNode;
+			injectProp(vnodeCall, keyProperty, context);
+			return vnodeCall;
+		} else {
+			let patchFlag = 64;
+			if (!!(process.env.NODE_ENV !== "production") && !branch.isTemplateIf && children.filter((c) => c.type !== 3).length === 1) patchFlag |= 2048;
+			return createVNodeCall(context, helper(FRAGMENT), createObjectExpression([keyProperty]), children, patchFlag, void 0, void 0, true, false, false, branch.loc);
+		}
 	} else {
-		let patchFlag = 64;
-		if (!!(process.env.NODE_ENV !== "production") && !branch.isTemplateIf && children.filter((c) => c.type !== 3).length === 1) patchFlag |= 2048;
-		return createVNodeCall(context, helper(FRAGMENT), createObjectExpression([keyProperty]), children, patchFlag, void 0, void 0, true, false, false, branch.loc);
-	}
-	else {
 		const ret = firstChild.codegenNode;
 		const vnodeCall = getMemoedVNodeCall(ret);
 		if (vnodeCall.type === 13) convertToBlock(vnodeCall, context);
@@ -3285,9 +3311,10 @@ function isSameKey(a, b) {
 	return true;
 }
 function getParentCondition(node) {
-	while (true) if (node.type === 19) if (node.alternate.type === 19) node = node.alternate;
-	else return node;
-	else if (node.type === 20) node = node.value;
+	while (true) if (node.type === 19) {
+		if (node.alternate.type === 19) node = node.alternate;
+		else return node;
+	} else if (node.type === 20) node = node.value;
 }
 //#endregion
 //#region packages/compiler-core/src/transforms/vFor.ts
@@ -3298,10 +3325,9 @@ const transformFor = createStructuralDirectiveTransform("for", (node, dir, conte
 		const isTemplate = isTemplateNode(node);
 		const memo = findDir(node, "memo");
 		const keyProp = findProp(node, `key`, false, true);
-		const isDirKey = keyProp && keyProp.type === 7;
+		keyProp && keyProp.type;
 		let keyExp = keyProp && (keyProp.type === 6 ? keyProp.value ? createSimpleExpression(keyProp.value.content, true) : void 0 : keyProp.exp);
-		if (memo && keyExp && isDirKey) {}
-		const keyProperty = keyProp && keyExp ? createObjectProperty(`key`, keyExp) : null;
+		const keyProperty = keyExp ? createObjectProperty(`key`, keyExp) : null;
 		const isStableFragment = forNode.source.type === 4 && forNode.source.constType > 0;
 		const fragmentFlag = isStableFragment ? 64 : keyProp ? 128 : 256;
 		forNode.codegenNode = createVNodeCall(context, helper(FRAGMENT), void 0, renderExp, fragmentFlag, void 0, void 0, true, !isStableFragment, false, node.loc);
@@ -3326,15 +3352,24 @@ const transformFor = createStructuralDirectiveTransform("for", (node, dir, conte
 			else {
 				childBlock = children[0].codegenNode;
 				if (isTemplate && keyProperty) injectProp(childBlock, keyProperty, context);
-				if (childBlock.isBlock !== !isStableFragment) if (childBlock.isBlock) {
-					removeHelper(OPEN_BLOCK);
-					removeHelper(getVNodeBlockHelper(context.inSSR, childBlock.isComponent));
-				} else removeHelper(getVNodeHelper(context.inSSR, childBlock.isComponent));
-				childBlock.isBlock = !isStableFragment;
+				const shouldUseBlock = !isStableFragment || childBlock.isBlockRequired === true;
+				if (childBlock.isBlock !== shouldUseBlock) {
+					if (childBlock.isBlock) {
+						removeHelper(OPEN_BLOCK);
+						removeHelper(getVNodeBlockHelper(context.inSSR, childBlock.isComponent));
+					} else removeHelper(getVNodeHelper(context.inSSR, childBlock.isComponent));
+				}
+				childBlock.isBlock = shouldUseBlock;
 				if (childBlock.isBlock) {
 					helper(OPEN_BLOCK);
 					helper(getVNodeBlockHelper(context.inSSR, childBlock.isComponent));
-				} else helper(getVNodeHelper(context.inSSR, childBlock.isComponent));
+				} else {
+					helper(getVNodeHelper(context.inSSR, childBlock.isComponent));
+					if (childBlock.needsPatch) {
+						var _childBlock$patchFlag;
+						childBlock.patchFlag = ((_childBlock$patchFlag = childBlock.patchFlag) !== null && _childBlock$patchFlag !== void 0 ? _childBlock$patchFlag : 0) | 512;
+					}
+				}
 			}
 			if (memo) {
 				const loop = createFunctionExpression(createForLoopParams(forNode.parseResult, [createSimpleExpression(`_cached`)]));
@@ -3527,8 +3562,10 @@ function buildSlots(node, context, buildSlotFn = buildClientSlotFn) {
 			return createObjectProperty(`default`, fn);
 		};
 		if (!hasTemplateSlots) slotsProperties.push(buildDefaultSlotProperty(void 0, children));
-		else if (implicitDefaultChildren.length && !implicitDefaultChildren.every(isWhitespaceText)) if (hasNamedDefaultSlot) context.onError(createCompilerError(39, implicitDefaultChildren[0].loc));
-		else slotsProperties.push(buildDefaultSlotProperty(void 0, implicitDefaultChildren));
+		else if (implicitDefaultChildren.length && !implicitDefaultChildren.every(isWhitespaceText)) {
+			if (hasNamedDefaultSlot) context.onError(createCompilerError(39, implicitDefaultChildren[0].loc));
+			else slotsProperties.push(buildDefaultSlotProperty(void 0, implicitDefaultChildren));
+		}
 	}
 	const slotFlag = hasDynamicSlots ? 2 : hasForwardedSlots(node.children) ? 3 : 1;
 	let slots = createObjectExpression(slotsProperties.concat(createObjectProperty(`_`, createSimpleExpression(slotFlag + (!!(process.env.NODE_ENV !== "production") ? ` /* ${slotFlagsText[slotFlag]} */` : ``), false))), loc);
@@ -3554,10 +3591,7 @@ function hasForwardedSlots(children) {
 				if (hasForwardedSlots(child.branches)) return true;
 				break;
 			case 10:
-			case 11:
-				if (hasForwardedSlots(child.children)) return true;
-				break;
-			default: break;
+			case 11: if (hasForwardedSlots(child.children)) return true;
 		}
 	}
 	return false;
@@ -3579,12 +3613,16 @@ const transformElement = (node, context) => {
 		let vnodeDynamicProps;
 		let dynamicPropNames;
 		let vnodeDirectives;
+		let needsPatch = false;
+		let isBlockRequired = false;
 		let shouldUseBlock = isDynamicComponent || vnodeTag === TELEPORT || vnodeTag === SUSPENSE || !isComponent && (tag === "svg" || tag === "foreignObject" || tag === "math");
 		if (props.length > 0) {
 			const propsBuildResult = buildProps(node, context, void 0, isComponent, isDynamicComponent);
 			vnodeProps = propsBuildResult.props;
 			patchFlag = propsBuildResult.patchFlag;
 			dynamicPropNames = propsBuildResult.dynamicPropNames;
+			needsPatch = propsBuildResult.needsPatch;
+			isBlockRequired = propsBuildResult.isBlockRequired;
 			const directives = propsBuildResult.directives;
 			vnodeDirectives = directives && directives.length ? createArrayExpression(directives.map((dir) => buildDirectiveArgs(dir, context))) : void 0;
 			if (propsBuildResult.shouldUseBlock) shouldUseBlock = true;
@@ -3613,7 +3651,10 @@ const transformElement = (node, context) => {
 			} else vnodeChildren = node.children;
 		}
 		if (dynamicPropNames && dynamicPropNames.length) vnodeDynamicProps = stringifyDynamicPropNames(dynamicPropNames);
-		node.codegenNode = createVNodeCall(context, vnodeTag, vnodeProps, vnodeChildren, patchFlag === 0 ? void 0 : patchFlag, vnodeDynamicProps, vnodeDirectives, !!shouldUseBlock, false, isComponent, node.loc);
+		const vnodeCall = node.codegenNode = createVNodeCall(context, vnodeTag, vnodeProps, vnodeChildren, patchFlag === 0 ? void 0 : patchFlag, vnodeDynamicProps, vnodeDirectives, !!shouldUseBlock, false, isComponent, node.loc);
+		needsPatch = needsPatch && (patchFlag === 0 || patchFlag === 32);
+		if (needsPatch) vnodeCall.needsPatch = true;
+		if (isBlockRequired) vnodeCall.isBlockRequired = true;
 	};
 };
 function resolveComponentType(node, context, ssr = false) {
@@ -3647,6 +3688,7 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 	const runtimeDirectives = [];
 	const hasChildren = children.length > 0;
 	let shouldUseBlock = false;
+	let isBlockRequired = false;
 	let patchFlag = 0;
 	let hasRef = false;
 	let hasClassBinding = false;
@@ -3671,12 +3713,12 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 			const isEventHandler = isOn(name);
 			if (isEventHandler && (!isComponent || isDynamicComponent) && name.toLowerCase() !== "onclick" && name !== "onUpdate:modelValue" && !isReservedProp(name)) hasHydrationEventBinding = true;
 			if (isEventHandler && isReservedProp(name)) hasVnodeHook = true;
+			if (name === "ref") hasRef = true;
 			if (isEventHandler && value.type === 14) value = value.arguments[0];
 			if (value.type === 20 || (value.type === 4 || value.type === 8) && getConstantType(value, context) > 0) return;
-			if (name === "ref") hasRef = true;
-			else if (name === "class") hasClassBinding = true;
+			if (name === "class") hasClassBinding = true;
 			else if (name === "style") hasStyleBinding = true;
-			else if (name !== "key" && !dynamicPropNames.includes(name)) dynamicPropNames.push(name);
+			else if (name !== "ref" && name !== "key" && !dynamicPropNames.includes(name)) dynamicPropNames.push(name);
 			if (isComponent && (name === "class" || name === "style") && !dynamicPropNames.includes(name)) dynamicPropNames.push(name);
 		} else hasDynamicKeys = true;
 	};
@@ -3702,35 +3744,40 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 			if (name === "once" || name === "memo") continue;
 			if (name === "is" || isVBind && isStaticArgOf(arg, "is") && (isComponentTag(tag) || isCompatEnabled("COMPILER_IS_ON_ELEMENT", context))) continue;
 			if (isVOn && ssr) continue;
-			if (isVBind && isStaticArgOf(arg, "key") || isVOn && hasChildren && isStaticArgOf(arg, "vue:before-update")) shouldUseBlock = true;
+			if (isVBind && isStaticArgOf(arg, "key")) shouldUseBlock = true;
+			if (isVOn && hasChildren && arg && isStaticExp(arg) && camelize(arg.content) === "vue:beforeUpdate") {
+				shouldUseBlock = true;
+				isBlockRequired = true;
+			}
 			if (isVBind && isStaticArgOf(arg, "ref")) pushRefVForMarker();
 			if (!arg && (isVBind || isVOn)) {
 				hasDynamicKeys = true;
-				if (exp) if (isVBind) {
-					pushMergeArg();
-					if (!!(process.env.NODE_ENV !== "production")) {
-						if (mergeArgs.some((arg) => {
-							if (arg.type === 15) return arg.properties.some(({ key }) => {
-								if (key.type !== 4 || !key.isStatic) return true;
-								return key.content !== "class" && key.content !== "style" && !isOn(key.content);
-							});
-							else return true;
-						})) checkCompatEnabled("COMPILER_V_BIND_OBJECT_ORDER", context, loc);
-					}
-					if (isCompatEnabled("COMPILER_V_BIND_OBJECT_ORDER", context)) {
-						mergeArgs.unshift(exp);
-						continue;
-					}
-					pushRefVForMarker();
-					pushMergeArg();
-					mergeArgs.push(exp);
-				} else pushMergeArg({
-					type: 14,
-					loc,
-					callee: context.helper(TO_HANDLERS),
-					arguments: isComponent ? [exp] : [exp, `true`]
-				});
-				else context.onError(createCompilerError(isVBind ? 34 : 35, loc));
+				if (exp) {
+					if (isVBind) {
+						pushMergeArg();
+						if (!!(process.env.NODE_ENV !== "production")) {
+							if (mergeArgs.some((arg) => {
+								if (arg.type === 15) return arg.properties.some(({ key }) => {
+									if (key.type !== 4 || !key.isStatic) return true;
+									return key.content !== "class" && key.content !== "style" && !isOn(key.content);
+								});
+								else return true;
+							})) checkCompatEnabled("COMPILER_V_BIND_OBJECT_ORDER", context, loc);
+						}
+						if (isCompatEnabled("COMPILER_V_BIND_OBJECT_ORDER", context)) {
+							mergeArgs.unshift(exp);
+							continue;
+						}
+						pushRefVForMarker();
+						pushMergeArg();
+						mergeArgs.push(exp);
+					} else pushMergeArg({
+						type: 14,
+						loc,
+						callee: context.helper(TO_HANDLERS),
+						arguments: isComponent ? [exp] : [exp, `true`]
+					});
+				} else context.onError(createCompilerError(isVBind ? 34 : 35, loc));
 				continue;
 			}
 			if (isVBind && modifiers.some((mod) => mod.content === "prop")) patchFlag |= 32;
@@ -3746,7 +3793,10 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 				}
 			} else if (!isBuiltInDirective(name)) {
 				runtimeDirectives.push(prop);
-				if (hasChildren) shouldUseBlock = true;
+				if (hasChildren) {
+					shouldUseBlock = true;
+					isBlockRequired = true;
+				}
 			}
 		}
 	}
@@ -3763,7 +3813,8 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 		if (dynamicPropNames.length) patchFlag |= 8;
 		if (hasHydrationEventBinding) patchFlag |= 32;
 	}
-	if (!shouldUseBlock && (patchFlag === 0 || patchFlag === 32) && (hasRef || hasVnodeHook || runtimeDirectives.length > 0)) patchFlag |= 512;
+	const needsPatch = (patchFlag === 0 || patchFlag === 32) && (hasRef || hasVnodeHook || runtimeDirectives.length > 0);
+	if (!shouldUseBlock && needsPatch) patchFlag |= 512;
 	if (!context.inSSR && propsExpression) switch (propsExpression.type) {
 		case 15:
 			let classKeyIndex = -1;
@@ -3784,16 +3835,16 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
 			} else propsExpression = createCallExpression(context.helper(NORMALIZE_PROPS), [propsExpression]);
 			break;
 		case 14: break;
-		default:
-			propsExpression = createCallExpression(context.helper(NORMALIZE_PROPS), [createCallExpression(context.helper(GUARD_REACTIVE_PROPS), [propsExpression])]);
-			break;
+		default: propsExpression = createCallExpression(context.helper(NORMALIZE_PROPS), [createCallExpression(context.helper(GUARD_REACTIVE_PROPS), [propsExpression])]);
 	}
 	return {
 		props: propsExpression,
 		directives: runtimeDirectives,
 		patchFlag,
 		dynamicPropNames,
-		shouldUseBlock
+		shouldUseBlock,
+		needsPatch,
+		isBlockRequired
 	};
 }
 function dedupeProperties(properties) {
@@ -3890,10 +3941,12 @@ function processSlotOutlet(node, context) {
 	for (let i = 0; i < node.props.length; i++) {
 		const p = node.props[i];
 		if (p.type === 6) {
-			if (p.value) if (p.name === "name") slotName = JSON.stringify(p.value.content);
-			else {
-				p.name = camelize(p.name);
-				nonNameProps.push(p);
+			if (p.value) {
+				if (p.name === "name") slotName = JSON.stringify(p.value.content);
+				else {
+					p.name = camelize(p.name);
+					nonNameProps.push(p);
+				}
 			}
 		} else if (p.name === "bind" && isStaticArgOf(p.arg, "name")) {
 			if (p.exp) slotName = p.exp;
@@ -3919,17 +3972,18 @@ const transformOn = (dir, node, context, augmentor) => {
 	const { loc, modifiers, arg } = dir;
 	if (!dir.exp && !modifiers.length) context.onError(createCompilerError(35, loc));
 	let eventName;
-	if (arg.type === 4) if (arg.isStatic) {
-		let rawName = arg.content;
-		if (!!(process.env.NODE_ENV !== "production") && rawName.startsWith("vnode")) context.onError(createCompilerError(52, arg.loc));
-		if (rawName.startsWith("vue:")) rawName = `vnode-${rawName.slice(4)}`;
-		eventName = createSimpleExpression(node.tagType !== 0 || rawName.startsWith("vnode") || !/[A-Z]/.test(rawName) ? toHandlerKey(camelize(rawName)) : `on:${rawName}`, true, arg.loc);
-	} else eventName = createCompoundExpression([
-		`${context.helperString(TO_HANDLER_KEY)}(`,
-		arg,
-		`)`
-	]);
-	else {
+	if (arg.type === 4) {
+		if (arg.isStatic) {
+			let rawName = arg.content;
+			if (!!(process.env.NODE_ENV !== "production") && rawName.startsWith("vnode")) context.onError(createCompilerError(52, arg.loc));
+			if (rawName.startsWith("vue:")) rawName = `vnode-${rawName.slice(4)}`;
+			eventName = createSimpleExpression(node.tagType !== 0 || rawName.startsWith("vnode") || !/[A-Z]/.test(rawName) ? toHandlerKey(camelize(rawName)) : `on:${rawName}`, true, arg.loc);
+		} else eventName = createCompoundExpression([
+			`${context.helperString(TO_HANDLER_KEY)}(`,
+			arg,
+			`)`
+		]);
+	} else {
 		eventName = arg;
 		eventName.children.unshift(`${context.helperString(TO_HANDLER_KEY)}(`);
 		eventName.children.push(`)`);
@@ -3965,11 +4019,14 @@ const transformBind = (dir, _node, context) => {
 		arg.children.unshift(`(`);
 		arg.children.push(`) || ""`);
 	} else if (!arg.isStatic) arg.content = arg.content ? `${arg.content} || ""` : `""`;
-	if (modifiers.some((mod) => mod.content === "camel")) if (arg.type === 4) if (arg.isStatic) arg.content = camelize(arg.content);
-	else arg.content = `${context.helperString(CAMELIZE)}(${arg.content})`;
-	else {
-		arg.children.unshift(`${context.helperString(CAMELIZE)}(`);
-		arg.children.push(`)`);
+	if (modifiers.some((mod) => mod.content === "camel")) {
+		if (arg.type === 4) {
+			if (arg.isStatic) arg.content = camelize(arg.content);
+			else arg.content = `${context.helperString(CAMELIZE)}(${arg.content})`;
+		} else {
+			arg.children.unshift(`${context.helperString(CAMELIZE)}(`);
+			arg.children.push(`)`);
+		}
 	}
 	if (!context.inSSR) {
 		if (modifiers.some((mod) => mod.content === "prop")) injectPrefix(arg, ".");
@@ -3978,9 +4035,10 @@ const transformBind = (dir, _node, context) => {
 	return { props: [createObjectProperty(arg, exp)] };
 };
 const injectPrefix = (arg, prefix) => {
-	if (arg.type === 4) if (arg.isStatic) arg.content = prefix + arg.content;
-	else arg.content = `\`${prefix}\${${arg.content}}\``;
-	else {
+	if (arg.type === 4) {
+		if (arg.isStatic) arg.content = prefix + arg.content;
+		else arg.content = `\`${prefix}\${${arg.content}}\``;
+	} else {
 		arg.children.unshift(`'${prefix}' + (`);
 		arg.children.push(`)`);
 	}
@@ -4101,7 +4159,7 @@ function rewriteFilter(node, context) {
 		const child = node.children[i];
 		if (typeof child !== "object") continue;
 		if (child.type === 4) parseFilter(child, context);
-		else if (child.type === 8) rewriteFilter(node, context);
+		else if (child.type === 8) rewriteFilter(child, context);
 		else if (child.type === 5) rewriteFilter(child.content, context);
 	}
 }
@@ -4127,11 +4185,12 @@ function parseFilter(node, context) {
 			if (c === 96 && prev !== 92) inTemplateString = false;
 		} else if (inRegex) {
 			if (c === 47 && prev !== 92) inRegex = false;
-		} else if (c === 124 && exp.charCodeAt(i + 1) !== 124 && exp.charCodeAt(i - 1) !== 124 && !curly && !square && !paren) if (expression === void 0) {
-			lastFilterIndex = i + 1;
-			expression = exp.slice(0, i).trim();
-		} else pushFilter();
-		else {
+		} else if (c === 124 && exp.charCodeAt(i + 1) !== 124 && exp.charCodeAt(i - 1) !== 124 && !curly && !square && !paren) {
+			if (expression === void 0) {
+				lastFilterIndex = i + 1;
+				expression = exp.slice(0, i).trim();
+			} else pushFilter();
+		} else {
 			switch (c) {
 				case 34:
 					inDouble = true;
@@ -4157,9 +4216,7 @@ function parseFilter(node, context) {
 				case 123:
 					curly++;
 					break;
-				case 125:
-					curly--;
-					break;
+				case 125: curly--;
 			}
 			if (c === 47) {
 				let j = i - 1;