@vue-jsx-vapor/compiler 2.5.0 → 2.5.1

package/dist/index.cjs

@@ -801,7 +801,7 @@ function processInlineHandlers(props, context) {
 		prop.values.forEach((value, i) => {
 			const isMemberExp = (0, __vue_compiler_dom.isMemberExpression)(value, context.options);
 			if (!isMemberExp) {
-				const name = getUniqueHandlerName(context, `_on_${prop.key.content}`);
+				const name = getUniqueHandlerName(context, `_on_${prop.key.content.replace(":", "_")}`);
 				handlers.push({
 					name,
 					value
@@ -1068,7 +1068,29 @@ function genFor(oper, context) {
 		idMap[rawIndex] = `${indexVar}.value`;
 		idMap[indexVar] = null;
 	}
-	const blockFn = context.withId(() => genBlock(render, context, args), idMap);
+	const { selectorPatterns, keyOnlyBindingPatterns } = matchPatterns(render, keyProp, idMap);
+	const patternFrag = [];
+	for (const [i, { selector }] of selectorPatterns.entries()) {
+		const selectorName = `_selector${id}_${i}`;
+		patternFrag.push(NEWLINE, `const ${selectorName} = `, ...genCall(`n${id}.useSelector`, [`() => `, ...genExpression(selector, context)]));
+	}
+	const blockFn = context.withId(() => {
+		const frag = [];
+		frag.push("(", ...args, ") => {", INDENT_START);
+		if (selectorPatterns.length || keyOnlyBindingPatterns.length) frag.push(...genBlockContent(render, context, false, () => {
+			const patternFrag$1 = [];
+			for (const [i, { effect }] of selectorPatterns.entries()) {
+				patternFrag$1.push(NEWLINE, `_selector${id}_${i}(() => {`, INDENT_START);
+				for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
+				patternFrag$1.push(INDENT_END, NEWLINE, `})`);
+			}
+			for (const { effect } of keyOnlyBindingPatterns) for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
+			return patternFrag$1;
+		}));
+		else frag.push(...genBlockContent(render, context));
+		frag.push(INDENT_END, NEWLINE, "}");
+		return frag;
+	}, idMap);
 	exitScope();
 	let flags = 0;
 	if (onlyChild) flags |= VaporVForFlags.FAST_REMOVE;
@@ -1077,7 +1099,8 @@ function genFor(oper, context) {
 	return [
 		NEWLINE,
 		`const n${id} = `,
-		...genCall(helper("createFor"), sourceExpr, blockFn, genCallback(keyProp), flags ? String(flags) : void 0)
+		...genCall(helper("createFor"), sourceExpr, blockFn, genCallback(keyProp), flags ? String(flags) : void 0),
+		...patternFrag
 	];
 	function parseValueDestructure() {
 		const map = /* @__PURE__ */ new Map();
@@ -1151,6 +1174,131 @@ function genFor(oper, context) {
 		return idMap$1;
 	}
 }
+function matchPatterns(render, keyProp, idMap) {
+	const selectorPatterns = [];
+	const keyOnlyBindingPatterns = [];
+	render.effect = render.effect.filter((effect) => {
+		if (keyProp !== void 0) {
+			const selector = matchSelectorPattern(effect, keyProp.ast, idMap);
+			if (selector) {
+				selectorPatterns.push(selector);
+				return false;
+			}
+			const keyOnly = matchKeyOnlyBindingPattern(effect, keyProp.ast);
+			if (keyOnly) {
+				keyOnlyBindingPatterns.push(keyOnly);
+				return false;
+			}
+		}
+		return true;
+	});
+	return {
+		keyOnlyBindingPatterns,
+		selectorPatterns
+	};
+}
+function matchKeyOnlyBindingPattern(effect, keyAst) {
+	if (effect.expressions.length === 1) {
+		const ast = effect.expressions[0].ast;
+		if (typeof ast === "object" && ast !== null && isKeyOnlyBinding(ast, keyAst)) return { effect };
+	}
+}
+function matchSelectorPattern(effect, keyAst, idMap) {
+	if (effect.expressions.length === 1) {
+		const ast = effect.expressions[0].ast;
+		const offset = effect.expressions[0].loc.start.offset;
+		if (typeof ast === "object" && ast) {
+			const matcheds = [];
+			(0, ast_kit.walkAST)(ast, { enter(node) {
+				if (typeof node === "object" && node && node.type === "BinaryExpression" && node.operator === "===" && node.left.type !== "PrivateName") {
+					const { left, right } = node;
+					for (const [a, b] of [[left, right], [right, left]]) {
+						const aIsKey = isKeyOnlyBinding(a, keyAst);
+						const bIsKey = isKeyOnlyBinding(b, keyAst);
+						const bVars = analyzeVariableScopes(b, idMap);
+						if (aIsKey && !bIsKey && !bVars.locals.length) matcheds.push([a, b]);
+					}
+				}
+			} });
+			if (matcheds.length === 1) {
+				const [key, selector] = matcheds[0];
+				const content$1 = effect.expressions[0].content;
+				let hasExtraId = false;
+				const parentStackMap = /* @__PURE__ */ new Map();
+				const parentStack = [];
+				(0, __vue_compiler_dom.walkIdentifiers)(ast, (id) => {
+					if (id.start !== key.start && id.start !== selector.start) hasExtraId = true;
+					parentStackMap.set(id, parentStack.slice());
+				}, false, parentStack);
+				if (!hasExtraId) {
+					const name = content$1.slice(selector.start - offset, selector.end - offset);
+					return {
+						effect,
+						selector: {
+							content: name,
+							ast: (0, __vue_shared.extend)({}, selector, {
+								start: 1,
+								end: name.length + 1
+							}),
+							loc: selector.loc,
+							isStatic: false
+						}
+					};
+				}
+			}
+		}
+		const content = effect.expressions[0].content;
+		if (typeof ast === "object" && ast && ast.type === "ConditionalExpression" && ast.test.type === "BinaryExpression" && ast.test.operator === "===" && ast.test.left.type !== "PrivateName" && (0, __vue_compiler_dom.isStaticNode)(ast.consequent) && (0, __vue_compiler_dom.isStaticNode)(ast.alternate)) {
+			const left = ast.test.left;
+			const right = ast.test.right;
+			for (const [a, b] of [[left, right], [right, left]]) {
+				const aIsKey = isKeyOnlyBinding(a, keyAst);
+				const bIsKey = isKeyOnlyBinding(b, keyAst);
+				const bVars = analyzeVariableScopes(b, idMap);
+				if (aIsKey && !bIsKey && !bVars.locals.length) return {
+					effect,
+					selector: {
+						content: content.slice(b.start - offset, b.end - offset),
+						ast: b,
+						loc: b.loc,
+						isStatic: false
+					}
+				};
+			}
+		}
+	}
+}
+function analyzeVariableScopes(ast, idMap) {
+	const globals = [];
+	const locals = [];
+	const ids = [];
+	const parentStackMap = /* @__PURE__ */ new Map();
+	const parentStack = [];
+	(0, __vue_compiler_dom.walkIdentifiers)(ast, (id) => {
+		ids.push(id);
+		parentStackMap.set(id, parentStack.slice());
+	}, false, parentStack);
+	for (const id of ids) {
+		if ((0, __vue_shared.isGloballyAllowed)(id.name)) continue;
+		if (idMap[id.name]) locals.push(id.name);
+		else globals.push(id.name);
+	}
+	return {
+		globals,
+		locals
+	};
+}
+function isKeyOnlyBinding(expr, keyAst) {
+	let only = true;
+	(0, ast_kit.walkAST)(expr, { enter(node) {
+		if ((0, __babel_types.isNodesEquivalent)(node, keyAst)) {
+			this.skip();
+			return;
+		}
+		if (node.type === "Identifier") only = false;
+	} });
+	return only;
+}
 
 //#endregion
 //#region src/generators/html.ts
@@ -1267,7 +1415,7 @@ function genOperation(oper, context) {
 		}
 	}
 }
-function genEffects(effects, context) {
+function genEffects(effects, context, genExtraFrag) {
 	const { helper } = context;
 	const [frag, push, unshift] = buildCodeFragment();
 	let operationsCount = 0;
@@ -1287,6 +1435,7 @@ function genEffects(effects, context) {
 		unshift(NEWLINE, `${helper("renderEffect")}(() => `);
 		push(`)`);
 	}
+	if (genExtraFrag) push(...context.withId(genExtraFrag, {}));
 	return frag;
 }
 function genEffect({ operations }, context) {
@@ -1353,19 +1502,19 @@ function genChildren(dynamic, context, pushBlock, from = `n${dynamic.id}`) {
 
 //#endregion
 //#region src/generators/block.ts
-function genBlock(oper, context, args = [], root, customReturns) {
+function genBlock(oper, context, args = [], root) {
 	return [
 		"(",
 		...args,
 		") => {",
 		INDENT_START,
-		...genBlockContent(oper, context, root, customReturns),
+		...genBlockContent(oper, context, root),
 		INDENT_END,
 		NEWLINE,
 		"}"
 	];
 }
-function genBlockContent(block, context, root, customReturns) {
+function genBlockContent(block, context, root, genEffectsExtraFrag) {
 	const [frag, push] = buildCodeFragment();
 	const { dynamic, effect, operation, returns } = block;
 	const resetBlock = context.enterBlock(block);
@@ -1381,11 +1530,11 @@ function genBlockContent(block, context, root, customReturns) {
 	for (const child of dynamic.children) push(...genSelf(child, context));
 	for (const child of dynamic.children) push(...genChildren(child, context, push, `n${child.id}`));
 	push(...genOperations(operation, context));
-	push(...genEffects(effect, context));
+	push(...genEffects(effect, context, genEffectsExtraFrag));
 	push(NEWLINE, `return `);
 	const returnNodes = returns.map((n) => `n${n}`);
 	const returnsCode = returnNodes.length > 1 ? genMulti(DELIMITERS_ARRAY, ...returnNodes) : [returnNodes[0] || "null"];
-	push(...customReturns ? customReturns(returnsCode) : returnsCode);
+	push(...returnsCode);
 	resetBlock();
 	return frag;
 	function genResolveAssets(kind, helper) {
@@ -2273,9 +2422,9 @@ function hasDynamicKeyVBind(node) {
 const delegatedEvents = /* @__PURE__ */ (0, __vue_shared.makeMap)("beforeinput,click,dblclick,contextmenu,focusin,focusout,input,keydown,keyup,mousedown,mousemove,mouseout,mouseover,mouseup,pointerdown,pointermove,pointerout,pointerover,pointerup,touchend,touchmove,touchstart");
 const transformVOn = (dir, node, context) => {
 	const { name, loc, value } = dir;
-	if (name.type === "JSXNamespacedName") return;
+	if (!name) return;
 	const isComponent = isJSXComponent(node);
-	const [nameString, ...modifiers] = name.name.replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
+	const [nameString, ...modifiers] = context.ir.source.slice(name.start, name.end).replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
 	if (!value && !modifiers.length) context.options.onError((0, __vue_compiler_dom.createCompilerError)(__vue_compiler_dom.ErrorCodes.X_V_ON_NO_EXPRESSION, resolveLocation(loc, context)));
 	let arg = resolveSimpleExpression(nameString, true, dir.name.loc);
 	const exp = resolveExpression(dir.value, context);
@@ -2473,13 +2622,10 @@ function createSlotBlock(slotNode, dir, context) {
 //#region src/transforms/vSlots.ts
 const transformVSlots = (dir, node, context) => {
 	if (!isJSXComponent(node)) return;
-	if (dir.value?.type === "JSXExpressionContainer") {
-		context.slots = [{
-			slotType: IRSlotType.EXPRESSION,
-			slots: resolveExpression(dir.value.expression, context)
-		}];
-		if (node.children.length) context.options.onError((0, __vue_compiler_dom.createCompilerError)(__vue_compiler_dom.ErrorCodes.X_V_SLOT_MIXED_SLOT_USAGE, resolveLocation(node.children[0].loc, context)));
-	}
+	if (dir.value?.type === "JSXExpressionContainer") context.slots = [{
+		slotType: IRSlotType.EXPRESSION,
+		slots: resolveExpression(dir.value.expression, context)
+	}];
 };
 
 //#endregion

package/dist/index.js

@@ -1,8 +1,8 @@
 import { parse, parseExpression } from "@babel/parser";
 import { NOOP, camelize, canSetValueDirectly, capitalize, extend, isArray, isBuiltInDirective, isGloballyAllowed, isHTMLTag, isSVGTag, isString, isVoidTag, makeMap, remove, shouldSetAsAttr, toHandlerKey } from "@vue/shared";
 import { DOMErrorCodes, ErrorCodes, NewlineType, NodeTypes, TS_NODE_TYPES, advancePositionWithClone, advancePositionWithMutation, createCompilerError, createDOMCompilerError, createSimpleExpression, defaultOnError, defaultOnWarn, isConstantNode, isFnExpression, isLiteralWhitelisted, isMemberExpression, isSimpleIdentifier, isStaticNode, isStaticProperty, isValidHTMLNesting, locStub, resolveModifiers, toValidAssetId, unwrapTSNode, walkIdentifiers } from "@vue/compiler-dom";
-import { walkIdentifiers as walkIdentifiers$1 } from "ast-kit";
-import { isLiteral, jsxClosingFragment, jsxExpressionContainer, jsxFragment, jsxOpeningFragment } from "@babel/types";
+import { walkAST, walkIdentifiers as walkIdentifiers$1 } from "ast-kit";
+import { isLiteral, isNodesEquivalent, jsxClosingFragment, jsxExpressionContainer, jsxFragment, jsxOpeningFragment } from "@babel/types";
 import { SourceMapGenerator } from "source-map-js";
 
 //#region src/ir/component.ts
@@ -778,7 +778,7 @@ function processInlineHandlers(props, context) {
 		prop.values.forEach((value, i) => {
 			const isMemberExp = isMemberExpression(value, context.options);
 			if (!isMemberExp) {
-				const name = getUniqueHandlerName(context, `_on_${prop.key.content}`);
+				const name = getUniqueHandlerName(context, `_on_${prop.key.content.replace(":", "_")}`);
 				handlers.push({
 					name,
 					value
@@ -1045,7 +1045,29 @@ function genFor(oper, context) {
 		idMap[rawIndex] = `${indexVar}.value`;
 		idMap[indexVar] = null;
 	}
-	const blockFn = context.withId(() => genBlock(render, context, args), idMap);
+	const { selectorPatterns, keyOnlyBindingPatterns } = matchPatterns(render, keyProp, idMap);
+	const patternFrag = [];
+	for (const [i, { selector }] of selectorPatterns.entries()) {
+		const selectorName = `_selector${id}_${i}`;
+		patternFrag.push(NEWLINE, `const ${selectorName} = `, ...genCall(`n${id}.useSelector`, [`() => `, ...genExpression(selector, context)]));
+	}
+	const blockFn = context.withId(() => {
+		const frag = [];
+		frag.push("(", ...args, ") => {", INDENT_START);
+		if (selectorPatterns.length || keyOnlyBindingPatterns.length) frag.push(...genBlockContent(render, context, false, () => {
+			const patternFrag$1 = [];
+			for (const [i, { effect }] of selectorPatterns.entries()) {
+				patternFrag$1.push(NEWLINE, `_selector${id}_${i}(() => {`, INDENT_START);
+				for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
+				patternFrag$1.push(INDENT_END, NEWLINE, `})`);
+			}
+			for (const { effect } of keyOnlyBindingPatterns) for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
+			return patternFrag$1;
+		}));
+		else frag.push(...genBlockContent(render, context));
+		frag.push(INDENT_END, NEWLINE, "}");
+		return frag;
+	}, idMap);
 	exitScope();
 	let flags = 0;
 	if (onlyChild) flags |= VaporVForFlags.FAST_REMOVE;
@@ -1054,7 +1076,8 @@ function genFor(oper, context) {
 	return [
 		NEWLINE,
 		`const n${id} = `,
-		...genCall(helper("createFor"), sourceExpr, blockFn, genCallback(keyProp), flags ? String(flags) : void 0)
+		...genCall(helper("createFor"), sourceExpr, blockFn, genCallback(keyProp), flags ? String(flags) : void 0),
+		...patternFrag
 	];
 	function parseValueDestructure() {
 		const map = /* @__PURE__ */ new Map();
@@ -1128,6 +1151,131 @@ function genFor(oper, context) {
 		return idMap$1;
 	}
 }
+function matchPatterns(render, keyProp, idMap) {
+	const selectorPatterns = [];
+	const keyOnlyBindingPatterns = [];
+	render.effect = render.effect.filter((effect) => {
+		if (keyProp !== void 0) {
+			const selector = matchSelectorPattern(effect, keyProp.ast, idMap);
+			if (selector) {
+				selectorPatterns.push(selector);
+				return false;
+			}
+			const keyOnly = matchKeyOnlyBindingPattern(effect, keyProp.ast);
+			if (keyOnly) {
+				keyOnlyBindingPatterns.push(keyOnly);
+				return false;
+			}
+		}
+		return true;
+	});
+	return {
+		keyOnlyBindingPatterns,
+		selectorPatterns
+	};
+}
+function matchKeyOnlyBindingPattern(effect, keyAst) {
+	if (effect.expressions.length === 1) {
+		const ast = effect.expressions[0].ast;
+		if (typeof ast === "object" && ast !== null && isKeyOnlyBinding(ast, keyAst)) return { effect };
+	}
+}
+function matchSelectorPattern(effect, keyAst, idMap) {
+	if (effect.expressions.length === 1) {
+		const ast = effect.expressions[0].ast;
+		const offset = effect.expressions[0].loc.start.offset;
+		if (typeof ast === "object" && ast) {
+			const matcheds = [];
+			walkAST(ast, { enter(node) {
+				if (typeof node === "object" && node && node.type === "BinaryExpression" && node.operator === "===" && node.left.type !== "PrivateName") {
+					const { left, right } = node;
+					for (const [a, b] of [[left, right], [right, left]]) {
+						const aIsKey = isKeyOnlyBinding(a, keyAst);
+						const bIsKey = isKeyOnlyBinding(b, keyAst);
+						const bVars = analyzeVariableScopes(b, idMap);
+						if (aIsKey && !bIsKey && !bVars.locals.length) matcheds.push([a, b]);
+					}
+				}
+			} });
+			if (matcheds.length === 1) {
+				const [key, selector] = matcheds[0];
+				const content$1 = effect.expressions[0].content;
+				let hasExtraId = false;
+				const parentStackMap = /* @__PURE__ */ new Map();
+				const parentStack = [];
+				walkIdentifiers(ast, (id) => {
+					if (id.start !== key.start && id.start !== selector.start) hasExtraId = true;
+					parentStackMap.set(id, parentStack.slice());
+				}, false, parentStack);
+				if (!hasExtraId) {
+					const name = content$1.slice(selector.start - offset, selector.end - offset);
+					return {
+						effect,
+						selector: {
+							content: name,
+							ast: extend({}, selector, {
+								start: 1,
+								end: name.length + 1
+							}),
+							loc: selector.loc,
+							isStatic: false
+						}
+					};
+				}
+			}
+		}
+		const content = effect.expressions[0].content;
+		if (typeof ast === "object" && ast && ast.type === "ConditionalExpression" && ast.test.type === "BinaryExpression" && ast.test.operator === "===" && ast.test.left.type !== "PrivateName" && isStaticNode(ast.consequent) && isStaticNode(ast.alternate)) {
+			const left = ast.test.left;
+			const right = ast.test.right;
+			for (const [a, b] of [[left, right], [right, left]]) {
+				const aIsKey = isKeyOnlyBinding(a, keyAst);
+				const bIsKey = isKeyOnlyBinding(b, keyAst);
+				const bVars = analyzeVariableScopes(b, idMap);
+				if (aIsKey && !bIsKey && !bVars.locals.length) return {
+					effect,
+					selector: {
+						content: content.slice(b.start - offset, b.end - offset),
+						ast: b,
+						loc: b.loc,
+						isStatic: false
+					}
+				};
+			}
+		}
+	}
+}
+function analyzeVariableScopes(ast, idMap) {
+	const globals = [];
+	const locals = [];
+	const ids = [];
+	const parentStackMap = /* @__PURE__ */ new Map();
+	const parentStack = [];
+	walkIdentifiers(ast, (id) => {
+		ids.push(id);
+		parentStackMap.set(id, parentStack.slice());
+	}, false, parentStack);
+	for (const id of ids) {
+		if (isGloballyAllowed(id.name)) continue;
+		if (idMap[id.name]) locals.push(id.name);
+		else globals.push(id.name);
+	}
+	return {
+		globals,
+		locals
+	};
+}
+function isKeyOnlyBinding(expr, keyAst) {
+	let only = true;
+	walkAST(expr, { enter(node) {
+		if (isNodesEquivalent(node, keyAst)) {
+			this.skip();
+			return;
+		}
+		if (node.type === "Identifier") only = false;
+	} });
+	return only;
+}
 
 //#endregion
 //#region src/generators/html.ts
@@ -1244,7 +1392,7 @@ function genOperation(oper, context) {
 		}
 	}
 }
-function genEffects(effects, context) {
+function genEffects(effects, context, genExtraFrag) {
 	const { helper } = context;
 	const [frag, push, unshift] = buildCodeFragment();
 	let operationsCount = 0;
@@ -1264,6 +1412,7 @@ function genEffects(effects, context) {
 		unshift(NEWLINE, `${helper("renderEffect")}(() => `);
 		push(`)`);
 	}
+	if (genExtraFrag) push(...context.withId(genExtraFrag, {}));
 	return frag;
 }
 function genEffect({ operations }, context) {
@@ -1330,19 +1479,19 @@ function genChildren(dynamic, context, pushBlock, from = `n${dynamic.id}`) {
 
 //#endregion
 //#region src/generators/block.ts
-function genBlock(oper, context, args = [], root, customReturns) {
+function genBlock(oper, context, args = [], root) {
 	return [
 		"(",
 		...args,
 		") => {",
 		INDENT_START,
-		...genBlockContent(oper, context, root, customReturns),
+		...genBlockContent(oper, context, root),
 		INDENT_END,
 		NEWLINE,
 		"}"
 	];
 }
-function genBlockContent(block, context, root, customReturns) {
+function genBlockContent(block, context, root, genEffectsExtraFrag) {
 	const [frag, push] = buildCodeFragment();
 	const { dynamic, effect, operation, returns } = block;
 	const resetBlock = context.enterBlock(block);
@@ -1358,11 +1507,11 @@ function genBlockContent(block, context, root, customReturns) {
 	for (const child of dynamic.children) push(...genSelf(child, context));
 	for (const child of dynamic.children) push(...genChildren(child, context, push, `n${child.id}`));
 	push(...genOperations(operation, context));
-	push(...genEffects(effect, context));
+	push(...genEffects(effect, context, genEffectsExtraFrag));
 	push(NEWLINE, `return `);
 	const returnNodes = returns.map((n) => `n${n}`);
 	const returnsCode = returnNodes.length > 1 ? genMulti(DELIMITERS_ARRAY, ...returnNodes) : [returnNodes[0] || "null"];
-	push(...customReturns ? customReturns(returnsCode) : returnsCode);
+	push(...returnsCode);
 	resetBlock();
 	return frag;
 	function genResolveAssets(kind, helper) {
@@ -2250,9 +2399,9 @@ function hasDynamicKeyVBind(node) {
 const delegatedEvents = /* @__PURE__ */ makeMap("beforeinput,click,dblclick,contextmenu,focusin,focusout,input,keydown,keyup,mousedown,mousemove,mouseout,mouseover,mouseup,pointerdown,pointermove,pointerout,pointerover,pointerup,touchend,touchmove,touchstart");
 const transformVOn = (dir, node, context) => {
 	const { name, loc, value } = dir;
-	if (name.type === "JSXNamespacedName") return;
+	if (!name) return;
 	const isComponent = isJSXComponent(node);
-	const [nameString, ...modifiers] = name.name.replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
+	const [nameString, ...modifiers] = context.ir.source.slice(name.start, name.end).replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
 	if (!value && !modifiers.length) context.options.onError(createCompilerError(ErrorCodes.X_V_ON_NO_EXPRESSION, resolveLocation(loc, context)));
 	let arg = resolveSimpleExpression(nameString, true, dir.name.loc);
 	const exp = resolveExpression(dir.value, context);
@@ -2450,13 +2599,10 @@ function createSlotBlock(slotNode, dir, context) {
 //#region src/transforms/vSlots.ts
 const transformVSlots = (dir, node, context) => {
 	if (!isJSXComponent(node)) return;
-	if (dir.value?.type === "JSXExpressionContainer") {
-		context.slots = [{
-			slotType: IRSlotType.EXPRESSION,
-			slots: resolveExpression(dir.value.expression, context)
-		}];
-		if (node.children.length) context.options.onError(createCompilerError(ErrorCodes.X_V_SLOT_MIXED_SLOT_USAGE, resolveLocation(node.children[0].loc, context)));
-	}
+	if (dir.value?.type === "JSXExpressionContainer") context.slots = [{
+		slotType: IRSlotType.EXPRESSION,
+		slots: resolveExpression(dir.value.expression, context)
+	}];
 };
 
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-jsx-vapor/compiler",
-  "version": "2.5.0",
+  "version": "2.5.1",
   "description": "Vue JSX Vapor Compiler",
   "type": "module",
   "keywords": [
@@ -36,8 +36,8 @@
   "dependencies": {
     "@babel/parser": "^7.28.0",
     "@babel/types": "^7.28.0",
-    "@vue/compiler-dom": "https://pkg.pr.new/@vue/compiler-dom@51677cd",
-    "@vue/shared": "https://pkg.pr.new/@vue/shared@51677cd",
+    "@vue/compiler-dom": "https://pkg.pr.new/@vue/compiler-dom@73bceb2",
+    "@vue/shared": "https://pkg.pr.new/@vue/shared@73bceb2",
     "ast-kit": "^2.1.1",
     "source-map-js": "^1.2.1"
   },