@vue/language-core 2.0.17 → 2.0.19

package/lib/codegen/script/globalTypes.js

@@ -7,16 +7,20 @@ function generateGlobalTypes(vueCompilerOptions) {
     return `export const __VLS_globalTypesStart = {};
 declare global {
 	// @ts-ignore
-	type __VLS_IntrinsicElements = __VLS_PickNotAny<import('vue/jsx-runtime').JSX.IntrinsicElements, __VLS_PickNotAny<globalThis.JSX.IntrinsicElements, Record<string, any>>>;
+	type __VLS_IntrinsicElements = __VLS_PickNotAny<import('${vueCompilerOptions.lib}/jsx-runtime').JSX.IntrinsicElements, __VLS_PickNotAny<globalThis.JSX.IntrinsicElements, Record<string, any>>>;
 	// @ts-ignore
-	type __VLS_Element = __VLS_PickNotAny<import('vue/jsx-runtime').JSX.Element, globalThis.JSX.Element>;
+	type __VLS_Element = __VLS_PickNotAny<import('${vueCompilerOptions.lib}/jsx-runtime').JSX.Element, globalThis.JSX.Element>;
 	// @ts-ignore
 	type __VLS_GlobalComponents = ${[
-        `__VLS_PickNotAny<import('vue').GlobalComponents, {}>`,
+        `__VLS_PickNotAny<import('${vueCompilerOptions.lib}').GlobalComponents, {}>`,
         `__VLS_PickNotAny<import('@vue/runtime-core').GlobalComponents, {}>`,
         `__VLS_PickNotAny<import('@vue/runtime-dom').GlobalComponents, {}>`,
         `Pick<typeof import('${vueCompilerOptions.lib}'), 'Transition' | 'TransitionGroup' | 'KeepAlive' | 'Suspense' | 'Teleport'>`
     ].join(' & ')};
+	type __VLS_BuiltInPublicProps =
+		__VLS_PickNotAny<import('${vueCompilerOptions.lib}').VNodeProps, {}>
+		& __VLS_PickNotAny<import('${vueCompilerOptions.lib}').AllowedComponentProps, {}>
+		& __VLS_PickNotAny<import('${vueCompilerOptions.lib}').ComponentCustomProps, {}>;
 	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
 	type __VLS_PickNotAny<A, B> = __VLS_IsAny<A> extends true ? B : A;
 
@@ -67,8 +71,6 @@ declare global {
 		N3 extends keyof __VLS_GlobalComponents ? N3 extends N0 ? Pick<__VLS_GlobalComponents, N0 extends keyof __VLS_GlobalComponents ? N0 : never> : { [K in N0]: __VLS_GlobalComponents[N3] } :
 		${vueCompilerOptions.strictTemplates ? '{}' : '{ [K in N0]: unknown }'}
 
-	type __VLS_FillingEventArg_ParametersLength<E extends (...args: any) => any> = __VLS_IsAny<Parameters<E>> extends true ? -1 : Parameters<E>['length'];
-	type __VLS_FillingEventArg<E> = E extends (...args: any) => any ? __VLS_FillingEventArg_ParametersLength<E> extends 0 ? ($event?: undefined) => ReturnType<E> : E : E;
 	function __VLS_asFunctionalComponent<T, K = T extends new (...args: any) => any ? InstanceType<T> : unknown>(t: T, instance?: K):
 		T extends new (...args: any) => any
 		? (props: ${fnPropsType}, ctx?: any) => __VLS_Element & { __ctx?: {
@@ -81,12 +83,6 @@ declare global {
 		: (_: {}${vueCompilerOptions.strictTemplates ? '' : ' & Record<string, unknown>'}, ctx?: any) => { __ctx?: { attrs?: any, expose?: any, slots?: any, emit?: any, props?: {}${vueCompilerOptions.strictTemplates ? '' : ' & Record<string, unknown>'} } };
 	function __VLS_elementAsFunction<T>(tag: T, endTag?: T): (_: T${vueCompilerOptions.strictTemplates ? '' : ' & Record<string, unknown>'}) => void;
 	function __VLS_functionalComponentArgsRest<T extends (...args: any) => any>(t: T): Parameters<T>['length'] extends 2 ? [any] : [];
-	function __VLS_pickEvent<E1, E2>(emitEvent: E1, propEvent: E2): __VLS_FillingEventArg<
-		__VLS_PickNotAny<
-			__VLS_AsFunctionOrAny<E2>,
-			__VLS_AsFunctionOrAny<E1>
-		>
-	> | undefined;
 	function __VLS_pickFunctionalComponentCtx<T, K>(comp: T, compInstance: K): __VLS_PickNotAny<
 		'__ctx' extends keyof __VLS_PickNotAny<K, {}> ? K extends { __ctx?: infer Ctx } ? Ctx : never : any
 		, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any

package/lib/codegen/script/scriptSetup.js

@@ -255,10 +255,6 @@ function* generateComponentProps(options, ctx, scriptSetup, scriptSetupRanges, d
     yield `let __VLS_functionalComponentProps!: `;
     yield `${ctx.helperTypes.OmitKeepDiscriminatedUnion.name}<InstanceType<typeof __VLS_fnComponent>['$props'], keyof __VLS_BuiltInPublicProps>`;
     yield common_1.endOfLine;
-    yield `type __VLS_BuiltInPublicProps =${common_1.newLine}`
-        + `	import('${options.vueCompilerOptions.lib}').VNodeProps${common_1.newLine}`
-        + `	& import('${options.vueCompilerOptions.lib}').AllowedComponentProps${common_1.newLine}`
-        + `	& import('${options.vueCompilerOptions.lib}').ComponentCustomProps${common_1.endOfLine}`;
     if (scriptSetupRanges.defineProp.length) {
         yield `const __VLS_defaults = {${common_1.newLine}`;
         for (const defineProp of scriptSetupRanges.defineProp) {

package/lib/codegen/template/element.js

@@ -32,7 +32,6 @@ function* generateComponent(options, ctx, node, currentComponent, componentCtxVa
     const isComponentTag = node.tag.toLowerCase() === 'component';
     let props = node.props;
     let dynamicTagInfo;
-    let usedComponentEventsVar = false;
     if (isComponentTag) {
         for (const prop of node.props) {
             if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE && prop.name === 'bind' && prop.arg?.loc.source === 'is' && prop.exp) {
@@ -158,12 +157,12 @@ function* generateComponent(options, ctx, node, currentComponent, componentCtxVa
     componentCtxVar = var_defineComponentCtx;
     currentComponent = node;
     for (const failedExp of propsFailedExps) {
-        yield* (0, interpolation_1.generateInterpolation)(options, ctx, failedExp.loc.source, failedExp.loc, failedExp.loc.start.offset, ctx.codeFeatures.all, '(', ')');
+        yield* (0, interpolation_1.generateInterpolation)(options, ctx, failedExp.node.loc.source, failedExp.node.loc, failedExp.node.loc.start.offset, ctx.codeFeatures.all, failedExp.prefix, failedExp.suffix);
         yield common_1.endOfLine;
     }
     yield* generateVScope(options, ctx, node, props);
     ctx.usedComponentCtxVars.add(componentCtxVar);
-    yield* (0, elementEvents_1.generateElementEvents)(options, ctx, node, var_functionalComponent, var_componentInstance, var_componentEmit, var_componentEvents, () => usedComponentEventsVar = true);
+    const usedComponentEventsVar = yield* (0, elementEvents_1.generateElementEvents)(options, ctx, node, var_functionalComponent, var_componentInstance, var_componentEmit, var_componentEvents);
     const slotDir = node.props.find(p => p.type === CompilerDOM.NodeTypes.DIRECTIVE && p.name === 'slot');
     if (slotDir) {
         yield* generateComponentSlot(options, ctx, node, slotDir, currentComponent, componentCtxVar);
@@ -196,7 +195,7 @@ function* generateElement(options, ctx, node, currentComponent, componentCtxVar)
     yield* (0, common_1.wrapWith)(startTagOffset, startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{`, ...(0, elementProps_1.generateElementProps)(options, ctx, node, node.props, true, propsFailedExps), `}`);
     yield `)${common_1.endOfLine}`;
     for (const failedExp of propsFailedExps) {
-        yield* (0, interpolation_1.generateInterpolation)(options, ctx, failedExp.loc.source, failedExp.loc, failedExp.loc.start.offset, ctx.codeFeatures.all, '(', ')');
+        yield* (0, interpolation_1.generateInterpolation)(options, ctx, failedExp.node.loc.source, failedExp.node.loc, failedExp.node.loc.start.offset, ctx.codeFeatures.all, failedExp.prefix, failedExp.suffix);
         yield common_1.endOfLine;
     }
     yield* generateVScope(options, ctx, node, node.props);

package/lib/codegen/template/elementEvents.d.ts

@@ -3,7 +3,7 @@ import type * as ts from 'typescript';
 import type { Code } from '../../types';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
-export declare function generateElementEvents(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, componentVar: string, componentInstanceVar: string, emitVar: string, eventsVar: string, used: () => void): Generator<Code>;
-export declare function generateEventArg(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, arg: CompilerDOM.SimpleExpressionNode, access: boolean, enableHover: boolean): Generator<Code>;
+export declare function generateElementEvents(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, componentVar: string, componentInstanceVar: string, emitVar: string, eventsVar: string): Generator<Code>;
+export declare function generateEventArg(ctx: TemplateCodegenContext, arg: CompilerDOM.SimpleExpressionNode, enableHover: boolean): Generator<Code>;
 export declare function generateEventExpression(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, prop: CompilerDOM.DirectiveNode): Generator<Code>;
 export declare function isCompoundExpression(ts: typeof import('typescript'), ast: ts.SourceFile): boolean;

package/lib/codegen/template/elementEvents.js

@@ -7,44 +7,52 @@ const shared_2 = require("../../utils/shared");
 const common_1 = require("../common");
 const camelized_1 = require("./camelized");
 const interpolation_1 = require("./interpolation");
-const objectProperty_1 = require("./objectProperty");
-function* generateElementEvents(options, ctx, node, componentVar, componentInstanceVar, emitVar, eventsVar, used) {
+function* generateElementEvents(options, ctx, node, componentVar, componentInstanceVar, emitVar, eventsVar) {
+    let usedComponentEventsVar = false;
+    let propsVar;
     for (const prop of node.props) {
         if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
             && prop.name === 'on'
-            && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-            used();
-            const eventVar = ctx.getInternalVariable();
-            yield `let ${eventVar} = {${common_1.newLine}`;
-            yield `/**__VLS_emit,${emitVar},${prop.arg.loc.source}*/${common_1.newLine}`;
-            yield `'${prop.arg.loc.source}': __VLS_pickEvent(`;
-            yield `${eventsVar}['${prop.arg.loc.source}'], `;
-            yield `({} as __VLS_FunctionalComponentProps<typeof ${componentVar}, typeof ${componentInstanceVar}>)`;
-            yield* generateEventArg(options, ctx, prop.arg, true, false);
-            yield `) }${common_1.endOfLine}`;
-            yield `${eventVar} = { `;
-            if (prop.arg.loc.source.startsWith('[') && prop.arg.loc.source.endsWith(']')) {
-                yield `[(`;
-                yield* (0, interpolation_1.generateInterpolation)(options, ctx, prop.arg.loc.source.slice(1, -1), prop.arg.loc, prop.arg.loc.start.offset + 1, ctx.codeFeatures.all, '', '');
-                yield `)!]`;
+            && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+            && !prop.arg.loc.source.startsWith('[')
+            && !prop.arg.loc.source.endsWith(']')) {
+            usedComponentEventsVar = true;
+            if (!propsVar) {
+                propsVar = ctx.getInternalVariable();
+                yield `let ${propsVar}!: __VLS_FunctionalComponentProps<typeof ${componentVar}, typeof ${componentInstanceVar}>${common_1.endOfLine}`;
+            }
+            const originalPropName = (0, shared_1.camelize)('on-' + prop.arg.loc.source);
+            const originalPropNameObjectKey = common_1.variableNameRegex.test(originalPropName)
+                ? originalPropName
+                : `'${originalPropName}'`;
+            yield `const ${ctx.getInternalVariable()}: `;
+            if (!options.vueCompilerOptions.strictTemplates) {
+                yield `Record<string, unknown> & `;
             }
-            else {
-                yield* (0, objectProperty_1.generateObjectProperty)(options, ctx, prop.arg.loc.source, prop.arg.loc.start.offset, ctx.codeFeatures.withoutHighlightAndCompletionAndNavigation, prop.arg.loc);
+            yield `(`;
+            yield `__VLS_IsAny<__VLS_AsFunctionOrAny<typeof ${propsVar}['${originalPropName}']>> extends false${common_1.newLine}`;
+            yield `? typeof ${propsVar}${common_1.newLine}`;
+            yield `: __VLS_IsAny<typeof ${eventsVar}['${prop.arg.loc.source}']> extends false${common_1.newLine}`;
+            yield `? {${common_1.newLine}`;
+            yield `/**__VLS_emit,${emitVar},${prop.arg.loc.source}*/${common_1.newLine}`;
+            yield `${originalPropNameObjectKey}?: typeof ${eventsVar}['${prop.arg.loc.source}']${common_1.newLine}`;
+            yield `}${common_1.newLine}`;
+            if (prop.arg.loc.source !== (0, shared_1.camelize)(prop.arg.loc.source)) {
+                yield `: __VLS_IsAny<typeof ${eventsVar}['${(0, shared_1.camelize)(prop.arg.loc.source)}']> extends false${common_1.newLine}`;
+                yield `? {${common_1.newLine}`;
+                yield `/**__VLS_emit,${emitVar},${(0, shared_1.camelize)(prop.arg.loc.source)}*/${common_1.newLine}`;
+                yield `${originalPropNameObjectKey}?: typeof ${eventsVar}['${(0, shared_1.camelize)(prop.arg.loc.source)}']${common_1.newLine}`;
+                yield `}${common_1.newLine}`;
             }
+            yield `: typeof ${propsVar}${common_1.newLine}`;
+            yield `) = {${common_1.newLine}`;
+            yield* generateEventArg(ctx, prop.arg, true);
             yield `: `;
             yield* generateEventExpression(options, ctx, prop);
-            yield common_1.newLine;
             yield `}${common_1.endOfLine}`;
         }
-        else if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
-            && prop.name === 'on'
-            && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-            // for vue 2 nameless event
-            // https://github.com/johnsoncodehk/vue-tsc/issues/67
-            yield* (0, interpolation_1.generateInterpolation)(options, ctx, prop.exp.content, prop.exp.loc, prop.exp.loc.start.offset, ctx.codeFeatures.all, '$event => {(', ')}');
-            yield common_1.endOfLine;
-        }
     }
+    return usedComponentEventsVar;
 }
 exports.generateElementEvents = generateElementEvents;
 const eventArgFeatures = {
@@ -63,34 +71,20 @@ const eventArgFeatures = {
         },
     },
 };
-function* generateEventArg(options, ctx, arg, access, enableHover) {
+function* generateEventArg(ctx, arg, enableHover) {
     const features = enableHover
         ? {
             ...ctx.codeFeatures.withoutHighlightAndCompletion,
             ...eventArgFeatures,
         }
         : eventArgFeatures;
-    if (arg.loc.source.startsWith('[') && arg.loc.source.endsWith(']')) {
-        yield `[`;
-        yield* (0, interpolation_1.generateInterpolation)(options, ctx, arg.loc.source.slice(1, -1), arg.loc, arg.loc.start.offset + 1, ctx.codeFeatures.all, '', '');
-        yield `]`;
-    }
-    else if (common_1.variableNameRegex.test((0, shared_1.camelize)(arg.loc.source))) {
-        if (access) {
-            yield `.`;
-        }
+    if (common_1.variableNameRegex.test((0, shared_1.camelize)(arg.loc.source))) {
         yield ['', 'template', arg.loc.start.offset, features];
         yield `on`;
         yield* (0, camelized_1.generateCamelized)((0, shared_1.capitalize)(arg.loc.source), arg.loc.start.offset, common_1.combineLastMapping);
     }
     else {
-        if (access) {
-            yield `[`;
-        }
         yield* (0, common_1.wrapWith)(arg.loc.start.offset, arg.loc.end.offset, features, `'`, ['', 'template', arg.loc.start.offset, common_1.combineLastMapping], 'on', ...(0, camelized_1.generateCamelized)((0, shared_1.capitalize)(arg.loc.source), arg.loc.start.offset, common_1.combineLastMapping), `'`);
-        if (access) {
-            yield `]`;
-        }
     }
 }
 exports.generateEventArg = generateEventArg;
@@ -102,7 +96,7 @@ function* generateEventExpression(options, ctx, prop) {
         const ast = (0, common_1.createTsAst)(options.ts, prop.exp, prop.exp.content);
         const _isCompoundExpression = isCompoundExpression(options.ts, ast);
         if (_isCompoundExpression) {
-            yield `$event => {${common_1.newLine}`;
+            yield `(...[$event]) => {${common_1.newLine}`;
             ctx.addLocalVariable('$event');
             prefix = '';
             suffix = '';

package/lib/codegen/template/elementProps.d.ts

@@ -2,4 +2,8 @@ import * as CompilerDOM from '@vue/compiler-dom';
 import type { Code } from '../../types';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
-export declare function generateElementProps(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, props: CompilerDOM.ElementNode['props'], enableCodeFeatures: boolean, propsFailedExps?: CompilerDOM.SimpleExpressionNode[]): Generator<Code>;
+export declare function generateElementProps(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, props: CompilerDOM.ElementNode['props'], enableCodeFeatures: boolean, propsFailedExps?: {
+    node: CompilerDOM.SimpleExpressionNode;
+    prefix: string;
+    suffix: string;
+}[]): Generator<Code>;

package/lib/codegen/template/elementProps.js

@@ -12,86 +12,72 @@ const objectProperty_1 = require("./objectProperty");
 const language_core_1 = require("@volar/language-core");
 const elementEvents_1 = require("./elementEvents");
 function* generateElementProps(options, ctx, node, props, enableCodeFeatures, propsFailedExps) {
-    let styleAttrNum = 0;
-    let classAttrNum = 0;
     const isIntrinsicElement = node.tagType === CompilerDOM.ElementTypes.ELEMENT || node.tagType === CompilerDOM.ElementTypes.TEMPLATE;
     const canCamelize = node.tagType === CompilerDOM.ElementTypes.COMPONENT;
-    if (props.some(prop => prop.type === CompilerDOM.NodeTypes.DIRECTIVE
-        && prop.name === 'bind'
-        && !prop.arg
-        && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION)) {
-        // fix https://github.com/vuejs/language-tools/issues/2166
-        styleAttrNum++;
-        classAttrNum++;
-    }
-    if (isIntrinsicElement) {
-        for (const prop of props) {
-            if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
-                && prop.name === 'on') {
-                if (prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-                    yield* (0, elementEvents_1.generateEventArg)(options, ctx, prop.arg, false, true);
+    for (const prop of props) {
+        if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
+            && prop.name === 'on') {
+            if (prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+                && !prop.arg.loc.source.startsWith('[')
+                && !prop.arg.loc.source.endsWith(']')) {
+                if (isIntrinsicElement) {
+                    yield `...{ `;
+                    yield* (0, elementEvents_1.generateEventArg)(ctx, prop.arg, true);
                     yield `: `;
                     yield* (0, elementEvents_1.generateEventExpression)(options, ctx, prop);
-                    yield `,${common_1.newLine}`;
+                    yield `}, `;
                 }
-                else if (prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-                    propsFailedExps?.push(prop.exp);
+                else {
+                    yield `...{ '${(0, shared_1.camelize)('on-' + prop.arg.loc.source)}': {} as any }, `;
                 }
             }
-        }
-    }
-    else {
-        let generatedEvent = false;
-        for (const prop of props) {
-            if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
-                && prop.name === 'on'
-                && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-                if (prop.arg.loc.source.startsWith('[') && prop.arg.loc.source.endsWith(']')) {
-                    continue;
-                }
-                if (!generatedEvent) {
-                    yield `...{ `;
-                    generatedEvent = true;
-                }
-                yield `'${(0, shared_1.camelize)('on-' + prop.arg.loc.source)}': {} as any, `;
+            else if (prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+                && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+                && prop.arg.loc.source.startsWith('[')
+                && prop.arg.loc.source.endsWith(']')) {
+                propsFailedExps?.push({ node: prop.arg, prefix: '(', suffix: ')' });
+                propsFailedExps?.push({ node: prop.exp, prefix: '() => {', suffix: '}' });
+            }
+            else if (!prop.arg
+                && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
+                propsFailedExps?.push({ node: prop.exp, prefix: '(', suffix: ')' });
             }
-        }
-        if (generatedEvent) {
-            yield `}, `;
         }
     }
     for (const prop of props) {
         if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
-            && (prop.name === 'bind' || prop.name === 'model')
-            && (prop.name === 'model' || prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION)
+            && ((prop.name === 'bind' && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION)
+                || prop.name === 'model')
             && (!prop.exp || prop.exp.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION)) {
-            let propName = prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
-                ? prop.arg.constType === CompilerDOM.ConstantTypes.CAN_STRINGIFY
+            let propName;
+            if (prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
+                propName = prop.arg.constType === CompilerDOM.ConstantTypes.CAN_STRINGIFY
                     ? prop.arg.content
-                    : prop.arg.loc.source
-                : getModelValuePropName(node, options.vueCompilerOptions.target, options.vueCompilerOptions);
-            if (prop.modifiers.some(m => m === 'prop' || m === 'attr')) {
-                propName = propName?.substring(1);
+                    : prop.arg.loc.source;
+            }
+            else {
+                propName = getModelValuePropName(node, options.vueCompilerOptions.target, options.vueCompilerOptions);
             }
             if (propName === undefined
-                || options.vueCompilerOptions.dataAttributes.some(pattern => (0, minimatch_1.minimatch)(propName, pattern))
-                || (propName === 'style' && ++styleAttrNum >= 2)
-                || (propName === 'class' && ++classAttrNum >= 2)
-                || (propName === 'name' && node.tagType === CompilerDOM.ElementTypes.SLOT) // #2308
-            ) {
+                || options.vueCompilerOptions.dataAttributes.some(pattern => (0, minimatch_1.minimatch)(propName, pattern))) {
                 if (prop.exp && prop.exp.constType !== CompilerDOM.ConstantTypes.CAN_STRINGIFY) {
-                    propsFailedExps?.push(prop.exp);
+                    propsFailedExps?.push({ node: prop.exp, prefix: '(', suffix: ')' });
                 }
                 continue;
             }
+            if (prop.modifiers.some(m => m === 'prop' || m === 'attr')) {
+                propName = propName.substring(1);
+            }
+            const shouldSpread = propName === 'style' || propName === 'class';
             const shouldCamelize = canCamelize
                 && (!prop.arg || (prop.arg.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION && prop.arg.isStatic)) // isStatic
                 && (0, shared_2.hyphenateAttr)(propName) === propName
                 && !options.vueCompilerOptions.htmlAttributes.some(pattern => (0, minimatch_1.minimatch)(propName, pattern));
-            const codes = (0, common_1.wrapWith)(prop.loc.start.offset, prop.loc.end.offset, ctx.codeFeatures.verification, ...(0, objectProperty_1.generateObjectProperty)(options, ctx, propName, prop.arg
-                ? prop.arg.loc.start.offset
-                : prop.loc.start.offset, prop.arg
-                ? {
+            if (shouldSpread) {
+                yield `...{ `;
+            }
+            const codes = (0, common_1.wrapWith)(prop.loc.start.offset, prop.loc.end.offset, ctx.codeFeatures.verification, ...(prop.arg
+                ? (0, objectProperty_1.generateObjectProperty)(options, ctx, propName, prop.arg.loc.start.offset, {
                     ...ctx.codeFeatures.withoutHighlightAndCompletion,
                     navigation: ctx.codeFeatures.withoutHighlightAndCompletion.navigation
                         ? {
@@ -99,33 +85,34 @@ function* generateElementProps(options, ctx, node, props, enableCodeFeatures, pr
                             resolveRenameEditText: shouldCamelize ? shared_2.hyphenateAttr : undefined,
                         }
                         : false,
-                }
-                : ctx.codeFeatures.withoutHighlightAndCompletion, prop.loc.name_2 ?? (prop.loc.name_2 = {}), shouldCamelize), `: (`, ...genereatePropExp(options, ctx, prop.exp, ctx.codeFeatures.all, prop.arg?.loc.start.offset === prop.exp?.loc.start.offset, enableCodeFeatures), `)`);
+                }, prop.loc.name_2 ?? (prop.loc.name_2 = {}), shouldCamelize)
+                : [propName]), `: (`, ...genereatePropExp(options, ctx, prop.exp, ctx.codeFeatures.all, prop.arg?.loc.start.offset === prop.exp?.loc.start.offset, enableCodeFeatures), `)`);
             if (!enableCodeFeatures) {
                 yield (0, language_core_1.toString)([...codes]);
             }
             else {
                 yield* codes;
             }
+            if (shouldSpread) {
+                yield ` }`;
+            }
             yield `, `;
         }
         else if (prop.type === CompilerDOM.NodeTypes.ATTRIBUTE) {
             if (options.vueCompilerOptions.dataAttributes.some(pattern => (0, minimatch_1.minimatch)(prop.name, pattern))
-                || (prop.name === 'style' && ++styleAttrNum >= 2)
-                || (prop.name === 'class' && ++classAttrNum >= 2)
-                || (prop.name === 'name' && node.tagType === CompilerDOM.ElementTypes.SLOT) // #2308
-            ) {
-                continue;
-            }
-            if (options.vueCompilerOptions.target < 3
-                && prop.name === 'persisted'
-                && node.tag.toLowerCase() === 'transition') {
                 // Vue 2 Transition doesn't support "persisted" property but `@vue/compiler-dom always adds it (#3881)
+                || (options.vueCompilerOptions.target < 3
+                    && prop.name === 'persisted'
+                    && node.tag.toLowerCase() === 'transition')) {
                 continue;
             }
+            const shouldSpread = prop.name === 'style' || prop.name === 'class';
             const shouldCamelize = canCamelize
                 && (0, shared_2.hyphenateAttr)(prop.name) === prop.name
                 && !options.vueCompilerOptions.htmlAttributes.some(pattern => (0, minimatch_1.minimatch)(prop.name, pattern));
+            if (shouldSpread) {
+                yield `...{ `;
+            }
             const codes = (0, common_1.conditionWrapWith)(enableCodeFeatures, prop.loc.start.offset, prop.loc.end.offset, ctx.codeFeatures.verification, ...(0, objectProperty_1.generateObjectProperty)(options, ctx, prop.name, prop.loc.start.offset, shouldCamelize
                 ? {
                     ...ctx.codeFeatures.withoutHighlightAndCompletion,
@@ -145,6 +132,9 @@ function* generateElementProps(options, ctx, node, props, enableCodeFeatures, pr
             else {
                 yield* codes;
             }
+            if (shouldSpread) {
+                yield ` }`;
+            }
             yield `, `;
         }
         else if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE

package/lib/codegen/template/index.d.ts

@@ -15,4 +15,3 @@ export interface TemplateCodegenOptions {
 }
 export declare function generateTemplate(options: TemplateCodegenOptions): Generator<Code, TemplateCodegenContext>;
 export declare function forEachElementNode(node: CompilerDOM.RootNode | CompilerDOM.TemplateChildNode): Generator<CompilerDOM.ElementNode>;
-export declare function isFragment(node: CompilerDOM.IfNode | CompilerDOM.ForNode): boolean | undefined;

package/lib/codegen/template/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isFragment = exports.forEachElementNode = exports.generateTemplate = void 0;
+exports.forEachElementNode = exports.generateTemplate = void 0;
 const CompilerDOM = require("@vue/compiler-dom");
 const common_1 = require("../common");
 const context_1 = require("./context");
@@ -138,8 +138,4 @@ function* forEachElementNode(node) {
     }
 }
 exports.forEachElementNode = forEachElementNode;
-function isFragment(node) {
-    return node.codegenNode && 'consequent' in node.codegenNode && 'tag' in node.codegenNode.consequent && node.codegenNode.consequent.tag === CompilerDOM.FRAGMENT;
-}
-exports.isFragment = isFragment;
 //# sourceMappingURL=index.js.map

package/lib/codegen/template/vFor.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.parseVForNode = exports.generateVFor = void 0;
 const CompilerDOM = require("@vue/compiler-dom");
 const common_1 = require("../common");
-const index_1 = require("./index");
 const interpolation_1 = require("./interpolation");
 const templateChild_1 = require("./templateChild");
 function* generateVFor(options, ctx, node, currentComponent, componentCtxVar) {
@@ -31,12 +30,30 @@ function* generateVFor(options, ctx, node, currentComponent, componentCtxVar) {
         yield `{} as any`;
     }
     yield `) {${common_1.newLine}`;
-    if ((0, index_1.isFragment)(node)) {
-        yield* ctx.resetDirectiveComments('end of v-for start');
-    }
     for (const varName of forBlockVars) {
         ctx.addLocalVariable(varName);
     }
+    let isFragment = true;
+    for (const argument of node.codegenNode?.children.arguments ?? []) {
+        if (argument.type === CompilerDOM.NodeTypes.JS_FUNCTION_EXPRESSION
+            && argument.returns.type === CompilerDOM.NodeTypes.VNODE_CALL
+            && argument.returns.props?.type === CompilerDOM.NodeTypes.JS_OBJECT_EXPRESSION) {
+            if (argument.returns.tag !== CompilerDOM.FRAGMENT) {
+                isFragment = false;
+                continue;
+            }
+            for (const prop of argument.returns.props.properties) {
+                if (prop.value.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+                    && !prop.value.isStatic) {
+                    yield* (0, interpolation_1.generateInterpolation)(options, ctx, prop.value.content, prop.value.loc, prop.value.loc.start.offset, ctx.codeFeatures.all, '(', ')');
+                    yield common_1.endOfLine;
+                }
+            }
+        }
+    }
+    if (isFragment) {
+        yield* ctx.resetDirectiveComments('end of v-for start');
+    }
     let prev;
     for (const childNode of node.children) {
         yield* (0, templateChild_1.generateTemplateChild)(options, ctx, childNode, currentComponent, prev, componentCtxVar);

package/lib/codegen/template/vIf.js

@@ -4,7 +4,6 @@ exports.generateVIf = void 0;
 const language_core_1 = require("@volar/language-core");
 const CompilerDOM = require("@vue/compiler-dom");
 const common_1 = require("../common");
-const index_1 = require("./index");
 const interpolation_1 = require("./interpolation");
 const templateChild_1 = require("./templateChild");
 function* generateVIf(options, ctx, node, currentComponent, componentCtxVar) {
@@ -33,7 +32,7 @@ function* generateVIf(options, ctx, node, currentComponent, componentCtxVar) {
             yield ` `;
         }
         yield `{${common_1.newLine}`;
-        if ((0, index_1.isFragment)(node)) {
+        if (isFragment(node)) {
             yield* ctx.resetDirectiveComments('end of v-if start');
         }
         let prev;
@@ -50,4 +49,10 @@ function* generateVIf(options, ctx, node, currentComponent, componentCtxVar) {
     ctx.blockConditions.length = originalBlockConditionsLength;
 }
 exports.generateVIf = generateVIf;
+function isFragment(node) {
+    return node.codegenNode
+        && 'consequent' in node.codegenNode
+        && 'tag' in node.codegenNode.consequent
+        && node.codegenNode.consequent.tag === CompilerDOM.FRAGMENT;
+}
 //# sourceMappingURL=vIf.js.map

package/lib/plugins/file-md.js

@@ -42,6 +42,7 @@ const plugin = () => {
             const file2VueSourceMap = new language_core_1.SourceMap((0, language_core_1.buildMappings)(codes));
             const sfc = (0, parseSfc_1.parse)((0, language_core_1.toString)(codes));
             if (sfc.descriptor.template) {
+                sfc.descriptor.template.lang = 'md';
                 transformRange(sfc.descriptor.template);
             }
             if (sfc.descriptor.script) {

package/lib/plugins/vue-script-js.d.ts

@@ -0,0 +1,3 @@
+import type { VueLanguagePlugin } from '../types';
+declare const plugin: VueLanguagePlugin;
+export default plugin;

package/lib/plugins/vue-script-js.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const plugin = ({ modules }) => {
+    return {
+        version: 2,
+        compileSFCScript(lang, script) {
+            if (lang === 'js' || lang === 'ts' || lang === 'jsx' || lang === 'tsx') {
+                const ts = modules.typescript;
+                return ts.createSourceFile('test.' + lang, script, 99);
+            }
+        },
+    };
+};
+exports.default = plugin;
+//# sourceMappingURL=vue-script-js.js.map

package/lib/plugins/vue-template-html.js

@@ -4,7 +4,7 @@ const plugin = ({ modules }) => {
     return {
         version: 2,
         compileSFCTemplate(lang, template, options) {
-            if (lang === 'html') {
+            if (lang === 'html' || lang === 'md') {
                 const compiler = modules['@vue/compiler-dom'];
                 return compiler.compile(template, {
                     ...options,

package/lib/plugins.d.ts

@@ -12,6 +12,7 @@ export declare function getBasePlugins(pluginContext: Parameters<VueLanguagePlug
         newText: string;
     }): import("@vue/compiler-sfc").SFCParseResult | undefined;
     resolveTemplateCompilerOptions?(options: import("@vue/compiler-dom").CompilerOptions): import("@vue/compiler-dom").CompilerOptions;
+    compileSFCScript?(lang: string, script: string): import("typescript").SourceFile | undefined;
     compileSFCTemplate?(lang: string, template: string, options: import("@vue/compiler-dom").CompilerOptions): import("@vue/compiler-dom").CodegenResult | undefined;
     updateSFCTemplate?(oldResult: import("@vue/compiler-dom").CodegenResult, textChange: {
         start: number;

package/lib/plugins.js

@@ -19,6 +19,7 @@ const vue_sfc_customblocks_1 = require("./plugins/vue-sfc-customblocks");
 const vue_sfc_scripts_1 = require("./plugins/vue-sfc-scripts");
 const vue_sfc_styles_1 = require("./plugins/vue-sfc-styles");
 const vue_sfc_template_1 = require("./plugins/vue-sfc-template");
+const vue_script_js_1 = require("./plugins/vue-script-js");
 const vue_template_html_1 = require("./plugins/vue-template-html");
 const vue_template_inline_css_1 = require("./plugins/vue-template-inline-css");
 const vue_template_inline_ts_1 = require("./plugins/vue-template-inline-ts");
@@ -27,6 +28,7 @@ const types_1 = require("./types");
 __exportStar(require("./plugins/shared"), exports);
 function getBasePlugins(pluginContext) {
     const plugins = [
+        vue_script_js_1.default,
         vue_template_html_1.default,
         vue_template_inline_css_1.default,
         vue_template_inline_ts_1.default,

package/lib/types.d.ts

@@ -68,6 +68,7 @@ export type VueLanguagePlugin = (ctx: {
         newText: string;
     }): SFCParseResult | undefined;
     resolveTemplateCompilerOptions?(options: CompilerDOM.CompilerOptions): CompilerDOM.CompilerOptions;
+    compileSFCScript?(lang: string, script: string): ts.SourceFile | undefined;
     compileSFCTemplate?(lang: string, template: string, options: CompilerDOM.CompilerOptions): CompilerDOM.CodegenResult | undefined;
     updateSFCTemplate?(oldResult: CompilerDOM.CodegenResult, textChange: {
         start: number;

package/lib/virtualFile/computedSfc.js

@@ -25,7 +25,16 @@ function computedSfc(ts, plugins, fileName, snapshot, parsed) {
             const _src = src();
             return _src ? untrackedSnapshot().getText(0, base.startTagEnd).lastIndexOf(_src) - base.startTagEnd : -1;
         });
-        const ast = (0, computeds_1.computed)(() => ts.createSourceFile(fileName + '.' + base.lang, base.content, 99));
+        const ast = (0, computeds_1.computed)(() => {
+            for (const plugin of plugins) {
+                const ast = plugin.compileSFCScript?.(base.lang, base.content);
+                if (ast) {
+                    return ast;
+                    ;
+                }
+            }
+            return ts.createSourceFile(fileName + '.' + base.lang, '', 99);
+        });
         return mergeObject(base, {
             get src() { return src(); },
             get srcOffset() { return srcOffset(); },
@@ -41,7 +50,16 @@ function computedSfc(ts, plugins, fileName, snapshot, parsed) {
             const _generic = generic();
             return _generic !== undefined ? untrackedSnapshot().getText(0, base.startTagEnd).lastIndexOf(_generic) - base.startTagEnd : -1;
         });
-        const ast = (0, computeds_1.computed)(() => ts.createSourceFile(fileName + '.' + base.lang, base.content, 99));
+        const ast = (0, computeds_1.computed)(() => {
+            for (const plugin of plugins) {
+                const ast = plugin.compileSFCScript?.(base.lang, base.content);
+                if (ast) {
+                    return ast;
+                    ;
+                }
+            }
+            return ts.createSourceFile(fileName + '.' + base.lang, '', 99);
+        });
         return mergeObject(base, {
             get generic() { return generic(); },
             get genericOffset() { return genericOffset(); },

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@vue/language-core",
-	"version": "2.0.17",
+	"version": "2.0.19",
 	"license": "MIT",
 	"files": [
 		"**/*.js",
@@ -12,7 +12,7 @@
 		"directory": "packages/language-core"
 	},
 	"dependencies": {
-		"@volar/language-core": "~2.2.2",
+		"@volar/language-core": "~2.2.4",
 		"@vue/compiler-dom": "^3.4.0",
 		"@vue/shared": "^3.4.0",
 		"computeds": "^0.0.1",
@@ -34,5 +34,5 @@
 			"optional": true
 		}
 	},
-	"gitHead": "968039cbb07961f318b4bf122bfa8e3e4a824277"
+	"gitHead": "a9fae154ad1efc4359866cfd10251d53e4b0faed"
 }