@vue/typescript-plugin 3.1.5 → 3.1.7

package/README.md

@@ -24,4 +24,5 @@ The `languages` field must specify file-types for which the plug-in will be enab
 
 - For neovim, see the [details on configuring `tsserver`][nvim].
 
-[nvim]: https://github.com/neovim/nvim-lspconfig/blob/master/doc/server_configurations.md#vue-support
+[nvim]: https://github.com/neovim/nvim-lspconfig/blob/master/doc/configs.md#vue-support
+  

package/index.js

@@ -1,4 +1,5 @@
 "use strict";
+const transform_js_1 = require("@volar/typescript/lib/node/transform.js");
 const createLanguageServicePlugin_1 = require("@volar/typescript/lib/quickstart/createLanguageServicePlugin");
 const core = require("@vue/language-core");
 const common_1 = require("./lib/common");
@@ -13,15 +14,20 @@ const getElementNames_1 = require("./lib/requests/getElementNames");
 const getImportPathForFile_1 = require("./lib/requests/getImportPathForFile");
 const isRefAtPosition_1 = require("./lib/requests/isRefAtPosition");
 const resolveModuleName_1 = require("./lib/requests/resolveModuleName");
+const projectToOriginalLanguageService = new WeakMap();
 module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)((ts, info) => {
+    projectToOriginalLanguageService.set(info.project, info.languageService);
     const vueOptions = getVueCompilerOptions();
     const languagePlugin = core.createVueLanguagePlugin(ts, info.languageServiceHost.getCompilationSettings(), vueOptions, id => id);
     vueOptions.globalTypesPath = core.createGlobalTypesWriter(vueOptions, ts.sys.writeFile);
     addVueCommands();
+    let _language;
+    (0, common_1.preprocessLanguageService)(info.languageService, () => _language);
     return {
         languagePlugins: [languagePlugin],
         setup: language => {
-            info.languageService = (0, common_1.createVueLanguageServiceProxy)(ts, language, info.languageService, vueOptions, fileName => fileName);
+            _language = language;
+            info.languageService = (0, common_1.postprocessLanguageService)(ts, language, info.languageService, vueOptions, fileName => fileName);
             info.project.__vue__ = { language };
         },
     };
@@ -76,6 +82,75 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
             const { project } = getProject(fileName);
             return createResponse((0, getImportPathForFile_1.getImportPathForFile)(ts, project, project.getLanguageService().getProgram(), fileName, incomingFileName, preferences));
         });
+        session.addProtocolHandler('_vue:getAutoImportSuggestions', request => {
+            const [fileName, position, preferences, formatOptions] = request.arguments;
+            const { project, language, sourceScript, virtualCode } = getProjectAndVirtualCode(fileName);
+            const tsLanguageService = projectToOriginalLanguageService.get(project);
+            if (!tsLanguageService) {
+                return createResponse(undefined);
+            }
+            for (const code of core.forEachEmbeddedCode(virtualCode)) {
+                if (!code.id.startsWith('script_')) {
+                    continue;
+                }
+                const map = language.maps.get(code, sourceScript);
+                for (const [tsPosition, mapping] of map.toGeneratedLocation(position)) {
+                    if (!mapping.data.__importCompletion) {
+                        continue;
+                    }
+                    const tsPosition2 = tsPosition + sourceScript.snapshot.getLength();
+                    const result = tsLanguageService.getCompletionsAtPosition(fileName, tsPosition2, preferences, formatOptions);
+                    if (result) {
+                        (0, common_1.resolveCompletionResult)(ts, language, fileName => fileName, vueOptions, fileName, position, result);
+                        result.entries = result.entries.filter((entry) => entry.data?.__isComponentAutoImport || entry.data?.__isAutoImport);
+                        for (const entry of result.entries) {
+                            entry.data.__getAutoImportSuggestions = {
+                                fileName,
+                                position: tsPosition + sourceScript.snapshot.getLength(),
+                                entryName: entry.data.__isComponentAutoImport?.oldName ?? entry.name,
+                                source: entry.source,
+                            };
+                        }
+                    }
+                    return createResponse(result);
+                }
+                const result = tsLanguageService.getCompletionsAtPosition(fileName, 0, preferences, formatOptions);
+                if (result) {
+                    (0, common_1.resolveCompletionResult)(ts, language, fileName => fileName, vueOptions, fileName, position, result);
+                    result.entries = result.entries.filter((entry) => entry.data?.__isComponentAutoImport || entry.data?.__isAutoImport);
+                    for (const entry of result.entries) {
+                        entry.data.__getAutoImportSuggestions = {
+                            fileName,
+                            position: 0,
+                            entryName: entry.data.__isComponentAutoImport?.oldName ?? entry.name,
+                            source: entry.source,
+                        };
+                    }
+                    return createResponse(result);
+                }
+            }
+            return createResponse(undefined);
+        });
+        session.addProtocolHandler('_vue:resolveAutoImportCompletionEntry', request => {
+            const [data, preferences, formatOptions] = request.arguments;
+            if (!data.__getAutoImportSuggestions) {
+                return createResponse(undefined);
+            }
+            const { fileName, position, entryName, source } = data.__getAutoImportSuggestions;
+            const { project, language } = getProject(fileName);
+            const tsLanguageService = projectToOriginalLanguageService.get(project);
+            if (!tsLanguageService) {
+                return createResponse(undefined);
+            }
+            const details = tsLanguageService.getCompletionEntryDetails(fileName, position, entryName, formatOptions, source, preferences, data);
+            if (details) {
+                for (const codeAction of details.codeActions ?? []) {
+                    codeAction.changes = (0, transform_js_1.transformFileTextChanges)(language, codeAction.changes, false, core.isCompletionEnabled);
+                }
+                (0, common_1.resolveCompletionEntryDetails)(language, details, data);
+            }
+            return createResponse(details);
+        });
         session.addProtocolHandler('_vue:isRefAtPosition', request => {
             const [fileName, position] = request.arguments;
             const { project, language, sourceScript, virtualCode } = getProjectAndVirtualCode(fileName);
@@ -88,18 +163,18 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
         });
         session.addProtocolHandler('_vue:getComponentEvents', request => {
             const [fileName, tag] = request.arguments;
-            const { project } = getProject(fileName);
-            return createResponse((0, getComponentEvents_1.getComponentEvents)(ts, project.getLanguageService().getProgram(), fileName, tag));
+            const { project, virtualCode } = getProjectAndVirtualCode(fileName);
+            return createResponse((0, getComponentEvents_1.getComponentEvents)(ts, project.getLanguageService().getProgram(), virtualCode, tag));
         });
         session.addProtocolHandler('_vue:getComponentNames', request => {
             const [fileName] = request.arguments;
-            const { project } = getProject(fileName);
-            return createResponse((0, getComponentNames_1.getComponentNames)(ts, project.getLanguageService().getProgram(), fileName));
+            const { project, virtualCode } = getProjectAndVirtualCode(fileName);
+            return createResponse((0, getComponentNames_1.getComponentNames)(ts, project.getLanguageService().getProgram(), virtualCode));
         });
         session.addProtocolHandler('_vue:getComponentProps', request => {
             const [fileName, tag] = request.arguments;
-            const { project } = getProject(fileName);
-            return createResponse((0, getComponentProps_1.getComponentProps)(ts, project.getLanguageService().getProgram(), fileName, tag));
+            const { project, virtualCode } = getProjectAndVirtualCode(fileName);
+            return createResponse((0, getComponentProps_1.getComponentProps)(ts, project.getLanguageService().getProgram(), virtualCode, tag));
         });
         session.addProtocolHandler('_vue:getComponentSlots', request => {
             const [fileName] = request.arguments;

package/lib/common.d.ts

@@ -1,3 +1,6 @@
 import { type Language, type VueCompilerOptions } from '@vue/language-core';
 import type * as ts from 'typescript';
-export declare function createVueLanguageServiceProxy<T>(ts: typeof import('typescript'), language: Language<T>, languageService: ts.LanguageService, vueOptions: VueCompilerOptions, asScriptId: (fileName: string) => T): ts.LanguageService;
+export declare function preprocessLanguageService(languageService: ts.LanguageService, getLanguage: () => Language<any> | undefined): void;
+export declare function postprocessLanguageService<T>(ts: typeof import('typescript'), language: Language<T>, languageService: ts.LanguageService, vueOptions: VueCompilerOptions, asScriptId: (fileName: string) => T): ts.LanguageService;
+export declare function resolveCompletionResult<T>(ts: typeof import('typescript'), language: Language<T>, asScriptId: (fileName: string) => T, vueOptions: VueCompilerOptions, fileName: string, position: number, result: ts.CompletionInfo): void;
+export declare function resolveCompletionEntryDetails(language: Language<any>, details: ts.CompletionEntryDetails, data: any): void;

package/lib/common.js

@@ -1,21 +1,114 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createVueLanguageServiceProxy = createVueLanguageServiceProxy;
+exports.preprocessLanguageService = preprocessLanguageService;
+exports.postprocessLanguageService = postprocessLanguageService;
+exports.resolveCompletionResult = resolveCompletionResult;
+exports.resolveCompletionEntryDetails = resolveCompletionEntryDetails;
+const transform_1 = require("@volar/typescript/lib/node/transform");
+const utils_1 = require("@volar/typescript/lib/node/utils");
 const language_core_1 = require("@vue/language-core");
 const shared_1 = require("@vue/shared");
 const windowsPathReg = /\\/g;
-function createVueLanguageServiceProxy(ts, language, languageService, vueOptions, asScriptId) {
+function preprocessLanguageService(languageService, getLanguage) {
+    const { getQuickInfoAtPosition, getSuggestionDiagnostics, getCompletionsAtPosition, getCodeFixesAtPosition, } = languageService;
+    languageService.getQuickInfoAtPosition = (fileName, position, maximumLength) => {
+        let result = getQuickInfoAtPosition(fileName, position, maximumLength);
+        const language = getLanguage();
+        if (result && language) {
+            const [serviceScript, targetScript, sourceScript] = (0, utils_1.getServiceScript)(language, fileName);
+            if (serviceScript && sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
+                for (const sourceOffset of (0, transform_1.toSourceOffsets)(sourceScript, language, serviceScript, position, () => true)) {
+                    const generatedOffset2 = (0, transform_1.toGeneratedOffset)(language, serviceScript, sourceScript, sourceOffset[1], (data) => !!data.__importCompletion);
+                    if (generatedOffset2 !== undefined) {
+                        const extraInfo = getQuickInfoAtPosition(targetScript.id, generatedOffset2, maximumLength);
+                        if (extraInfo) {
+                            result.tags ??= [];
+                            result.tags.push(...extraInfo.tags ?? []);
+                        }
+                    }
+                }
+            }
+        }
+        return result;
+    };
+    languageService.getSuggestionDiagnostics = fileName => {
+        const diagnostics = getSuggestionDiagnostics(fileName);
+        const language = getLanguage();
+        if (language) {
+            const [serviceScript, _targetScript, sourceScript] = (0, utils_1.getServiceScript)(language, fileName);
+            if (serviceScript && sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
+                for (const diagnostic of diagnostics) {
+                    for (const sourceRange of (0, transform_1.toSourceRanges)(sourceScript, language, serviceScript, diagnostic.start, diagnostic.start + diagnostic.length, true, (data) => !!data.__importCompletion)) {
+                        const generateRange2 = (0, transform_1.toGeneratedRange)(language, serviceScript, sourceScript, sourceRange[1], sourceRange[2], (data) => !data.__importCompletion);
+                        if (generateRange2 !== undefined) {
+                            diagnostic.start = generateRange2[0];
+                            diagnostic.length = generateRange2[1] - generateRange2[0];
+                            break;
+                        }
+                    }
+                }
+            }
+        }
+        return diagnostics;
+    };
+    languageService.getCompletionsAtPosition = (fileName, position, preferences, formatOptions) => {
+        let result = getCompletionsAtPosition(fileName, position, preferences, formatOptions);
+        const language = getLanguage();
+        if (language) {
+            const [serviceScript, targetScript, sourceScript] = (0, utils_1.getServiceScript)(language, fileName);
+            if (serviceScript && sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
+                for (const sourceOffset of (0, transform_1.toSourceOffsets)(sourceScript, language, serviceScript, position, () => true)) {
+                    const generatedOffset2 = (0, transform_1.toGeneratedOffset)(language, serviceScript, sourceScript, sourceOffset[1], (data) => !!data.__importCompletion);
+                    if (generatedOffset2 !== undefined) {
+                        const completion2 = getCompletionsAtPosition(targetScript.id, generatedOffset2, preferences, formatOptions);
+                        if (completion2) {
+                            const existingNames = new Set(result?.entries.map(entry => entry.name));
+                            for (const entry of completion2.entries) {
+                                if (!existingNames.has(entry.name)) {
+                                    result?.entries.push(entry);
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        return result;
+    };
+    languageService.getCodeFixesAtPosition = (fileName, start, end, errorCodes, formatOptions, preferences) => {
+        let fixes = getCodeFixesAtPosition(fileName, start, end, errorCodes, formatOptions, preferences);
+        const language = getLanguage();
+        if (language
+            && errorCodes.includes(2339) // Property 'xxx' does not exist on type 'yyy'.ts(2339)
+        ) {
+            const [serviceScript, targetScript, sourceScript] = (0, utils_1.getServiceScript)(language, fileName);
+            if (serviceScript && sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
+                for (const sourceRange of (0, transform_1.toSourceRanges)(sourceScript, language, serviceScript, start, end, true, () => true)) {
+                    const generateRange2 = (0, transform_1.toGeneratedRange)(language, serviceScript, sourceScript, sourceRange[1], sourceRange[2], (data) => !!data.__importCompletion);
+                    if (generateRange2 !== undefined) {
+                        let importFixes = getCodeFixesAtPosition(targetScript.id, generateRange2[0], generateRange2[1], [2304], // Cannot find name 'xxx'.ts(2304)
+                        formatOptions, preferences);
+                        importFixes = importFixes.filter(fix => fix.fixName === 'import');
+                        fixes = fixes.concat(importFixes);
+                    }
+                }
+            }
+        }
+        return fixes;
+    };
+}
+function postprocessLanguageService(ts, language, languageService, vueOptions, asScriptId) {
     const proxyCache = new Map();
     const getProxyMethod = (target, p) => {
         switch (p) {
             case 'getCompletionsAtPosition':
-                return getCompletionsAtPosition(ts, language, asScriptId, vueOptions, target[p]);
+                return getCompletionsAtPosition(target[p]);
             case 'getCompletionEntryDetails':
-                return getCompletionEntryDetails(language, target[p]);
+                return getCompletionEntryDetails(target[p]);
             case 'getCodeFixesAtPosition':
                 return getCodeFixesAtPosition(target[p]);
             case 'getDefinitionAndBoundSpan':
-                return getDefinitionAndBoundSpan(ts, language, asScriptId, target[p]);
+                return getDefinitionAndBoundSpan(target[p]);
         }
     };
     return new Proxy(languageService, {
@@ -33,174 +126,221 @@ function createVueLanguageServiceProxy(ts, language, languageService, vueOptions
             return Reflect.set(target, p, value, receiver);
         },
     });
-}
-function getCompletionsAtPosition(ts, language, asScriptId, vueOptions, getCompletionsAtPosition) {
-    return (filePath, position, options, formattingSettings) => {
-        const fileName = filePath.replace(windowsPathReg, '/');
-        const result = getCompletionsAtPosition(fileName, position, options, formattingSettings);
-        if (result) {
+    function getCompletionsAtPosition(getCompletionsAtPosition) {
+        return (filePath, position, options, formattingSettings) => {
+            const fileName = filePath.replace(windowsPathReg, '/');
+            const result = getCompletionsAtPosition(fileName, position, options, formattingSettings);
+            if (result) {
+                resolveCompletionResult(ts, language, asScriptId, vueOptions, fileName, position, result);
+            }
+            return result;
+        };
+    }
+    function getCompletionEntryDetails(getCompletionEntryDetails) {
+        return (...args) => {
+            const details = getCompletionEntryDetails(...args);
+            if (details) {
+                resolveCompletionEntryDetails(language, details, args[6]);
+            }
+            return details;
+        };
+    }
+    function getCodeFixesAtPosition(getCodeFixesAtPosition) {
+        return (...args) => {
+            let result = getCodeFixesAtPosition(...args);
             // filter __VLS_
-            result.entries = result.entries.filter(entry => !entry.name.includes('__VLS_')
-                && !entry.labelDetails?.description?.includes('__VLS_'));
-            // filter global variables in template and styles
+            result = result.filter(entry => !entry.description.includes('__VLS_'));
+            return result;
+        };
+    }
+    function getDefinitionAndBoundSpan(getDefinitionAndBoundSpan) {
+        return (fileName, position) => {
+            const result = getDefinitionAndBoundSpan(fileName, position);
+            const program = languageService.getProgram();
             const sourceScript = language.scripts.get(asScriptId(fileName));
             const root = sourceScript?.generated?.root;
-            if (root instanceof language_core_1.VueVirtualCode) {
-                const blocks = [
-                    root.sfc.template,
-                    ...root.sfc.styles,
-                ];
-                const ranges = blocks.filter(Boolean).map(block => [
-                    block.startTagEnd,
-                    block.endTagStart,
-                ]);
-                if (ranges.some(([start, end]) => position >= start && position <= end)) {
-                    const globalKinds = new Set(['var', 'function', 'module']);
-                    const globalsOrKeywords = ts.Completions.SortText.GlobalsOrKeywords;
-                    const sortTexts = new Set([
-                        globalsOrKeywords,
-                        'z' + globalsOrKeywords,
-                        globalsOrKeywords + '1',
-                    ]);
-                    result.entries = result.entries.filter(entry => !(entry.kind === 'const' && entry.name in vueOptions.macros) && (!globalKinds.has(entry.kind)
-                        || !sortTexts.has(entry.sortText)
-                        || (0, shared_1.isGloballyAllowed)(entry.name)));
-                }
-            }
-            // modify label
-            for (const item of result.entries) {
-                if (item.source) {
-                    const originalName = item.name;
-                    for (const vueExt of vueOptions.extensions) {
-                        const suffix = (0, shared_1.capitalize)(vueExt.slice(1)); // .vue -> Vue
-                        if (item.source.endsWith(vueExt) && item.name.endsWith(suffix)) {
-                            item.name = (0, shared_1.capitalize)(item.name.slice(0, -suffix.length));
-                            if (item.insertText) {
-                                // #2286
-                                item.insertText = item.insertText.replace(`${suffix}$1`, '$1');
-                            }
-                            if (item.data) {
-                                // @ts-expect-error
-                                item.data.__isComponentAutoImport = {
-                                    ext: vueExt,
-                                    suffix,
-                                    originalName,
-                                    newName: item.insertText,
-                                };
-                            }
-                            break;
-                        }
-                    }
-                    if (item.data) {
-                        // @ts-expect-error
-                        item.data.__isAutoImport = {
-                            fileName,
+            if (!(root instanceof language_core_1.VueVirtualCode)) {
+                return result;
+            }
+            if (!result?.definitions?.length) {
+                const { template } = root.sfc;
+                if (template) {
+                    const textSpan = {
+                        start: template.start + 1,
+                        length: 'template'.length,
+                    };
+                    if (position >= textSpan.start && position <= textSpan.start + textSpan.length) {
+                        return {
+                            textSpan,
+                            definitions: [{
+                                    fileName,
+                                    textSpan,
+                                    kind: ts.ScriptElementKind.scriptElement,
+                                    name: fileName,
+                                    containerKind: ts.ScriptElementKind.unknown,
+                                    containerName: '',
+                                }],
                         };
                     }
                 }
+                return;
             }
-        }
-        return result;
-    };
-}
-function getCompletionEntryDetails(language, getCompletionEntryDetails) {
-    return (...args) => {
-        const details = getCompletionEntryDetails(...args);
-        // modify import statement
-        // @ts-expect-error
-        if (args[6]?.__isComponentAutoImport) {
-            // @ts-expect-error
-            const { originalName, newName } = args[6].__isComponentAutoImport;
-            for (const codeAction of details?.codeActions ?? []) {
-                for (const change of codeAction.changes) {
-                    for (const textChange of change.textChanges) {
-                        textChange.newText = textChange.newText.replace('import ' + originalName + ' from ', 'import ' + newName + ' from ');
+            if (!root.sfc.template
+                || position < root.sfc.template.startTagEnd
+                || position > root.sfc.template.endTagStart) {
+                return result;
+            }
+            const definitions = new Set(result.definitions);
+            const skippedDefinitions = [];
+            // #5275
+            if (result.definitions.length >= 2) {
+                for (const definition of result.definitions) {
+                    if (root.sfc.content[definition.textSpan.start - 1] === '@'
+                        || root.sfc.content.slice(definition.textSpan.start - 5, definition.textSpan.start) === 'v-on:') {
+                        definitions.delete(definition);
                     }
                 }
             }
-        }
-        // @ts-expect-error
-        if (args[6]?.__isAutoImport) {
-            // @ts-expect-error
-            const { fileName } = args[6].__isAutoImport;
-            const sourceScript = language.scripts.get(fileName);
-            if (sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
-                const { vueSfc } = sourceScript.generated.root;
-                if (!vueSfc?.descriptor.script && !vueSfc?.descriptor.scriptSetup) {
-                    for (const codeAction of details?.codeActions ?? []) {
-                        for (const change of codeAction.changes) {
-                            for (const textChange of change.textChanges) {
-                                textChange.newText = `<script setup lang="ts">${textChange.newText}</script>\n\n`;
-                                break;
-                            }
-                            break;
-                        }
-                        break;
+            for (const definition of result.definitions) {
+                if (vueOptions.extensions.some(ext => definition.fileName.endsWith(ext))) {
+                    continue;
+                }
+                const sourceFile = program.getSourceFile(definition.fileName);
+                if (!sourceFile) {
+                    continue;
+                }
+                visit(sourceFile, definition, sourceFile);
+            }
+            for (const definition of skippedDefinitions) {
+                definitions.delete(definition);
+            }
+            return {
+                definitions: [...definitions],
+                textSpan: result.textSpan,
+            };
+            function visit(node, definition, sourceFile) {
+                if (ts.isPropertySignature(node) && node.type) {
+                    proxy(node.name, node.type, definition, sourceFile);
+                }
+                else if (ts.isVariableDeclaration(node) && ts.isIdentifier(node.name) && node.type && !node.initializer) {
+                    proxy(node.name, node.type, definition, sourceFile);
+                }
+                else {
+                    ts.forEachChild(node, child => visit(child, definition, sourceFile));
+                }
+            }
+            function proxy(name, type, definition, sourceFile) {
+                const { textSpan, fileName } = definition;
+                const start = name.getStart(sourceFile);
+                const end = name.getEnd();
+                if (start !== textSpan.start || end - start !== textSpan.length) {
+                    return;
+                }
+                if (!ts.isIndexedAccessTypeNode(type)) {
+                    return;
+                }
+                const pos = type.indexType.getStart(sourceFile);
+                const res = getDefinitionAndBoundSpan(fileName, pos);
+                if (res?.definitions?.length) {
+                    for (const definition of res.definitions) {
+                        definitions.add(definition);
                     }
+                    skippedDefinitions.push(definition);
                 }
             }
-        }
-        return details;
-    };
-}
-function getCodeFixesAtPosition(getCodeFixesAtPosition) {
-    return (...args) => {
-        let result = getCodeFixesAtPosition(...args);
-        // filter __VLS_
-        result = result.filter(entry => !entry.description.includes('__VLS_'));
-        return result;
-    };
+        };
+    }
 }
-function getDefinitionAndBoundSpan(ts, language, asScriptId, getDefinitionAndBoundSpan) {
-    return (fileName, position) => {
-        const result = getDefinitionAndBoundSpan(fileName, position);
-        const sourceScript = language.scripts.get(asScriptId(fileName));
-        const root = sourceScript?.generated?.root;
-        if (!(root instanceof language_core_1.VueVirtualCode)) {
-            return result;
+function resolveCompletionResult(ts, language, asScriptId, vueOptions, fileName, position, result) {
+    // filter __VLS_
+    result.entries = result.entries.filter(entry => !entry.name.includes('__VLS_')
+        && !entry.labelDetails?.description?.includes('__VLS_'));
+    // filter global variables in template and styles
+    const sourceScript = language.scripts.get(asScriptId(fileName));
+    const root = sourceScript?.generated?.root;
+    if (root instanceof language_core_1.VueVirtualCode) {
+        const blocks = [
+            root.sfc.template,
+            ...root.sfc.styles,
+        ];
+        const ranges = blocks.filter(Boolean).map(block => [
+            block.startTagEnd,
+            block.endTagStart,
+        ]);
+        if (ranges.some(([start, end]) => position >= start && position <= end)) {
+            const globalKinds = new Set(['var', 'function', 'module']);
+            const globalsOrKeywords = ts.Completions.SortText.GlobalsOrKeywords;
+            const sortTexts = new Set([
+                globalsOrKeywords,
+                'z' + globalsOrKeywords,
+                globalsOrKeywords + '1',
+            ]);
+            result.entries = result.entries.filter(entry => !(entry.kind === 'const' && entry.name in vueOptions.macros) && (!globalKinds.has(entry.kind)
+                || !sortTexts.has(entry.sortText)
+                || (0, shared_1.isGloballyAllowed)(entry.name)));
         }
-        if (!result?.definitions?.length) {
-            const { template } = root.sfc;
-            if (template) {
-                const textSpan = {
-                    start: template.start + 1,
-                    length: 'template'.length,
-                };
-                if (position >= textSpan.start && position <= textSpan.start + textSpan.length) {
-                    return {
-                        textSpan,
-                        definitions: [{
-                                fileName,
-                                textSpan,
-                                kind: ts.ScriptElementKind.scriptElement,
-                                name: fileName,
-                                containerKind: ts.ScriptElementKind.unknown,
-                                containerName: '',
-                            }],
-                    };
+    }
+    // modify label
+    for (const item of result.entries) {
+        if (item.source) {
+            const oldName = item.name;
+            for (const vueExt of vueOptions.extensions) {
+                const suffix = (0, shared_1.capitalize)(vueExt.slice(1)); // .vue -> Vue
+                if (item.source.endsWith(vueExt) && item.name.endsWith(suffix)) {
+                    item.name = (0, shared_1.capitalize)(item.name.slice(0, -suffix.length));
+                    if (item.insertText) {
+                        // #2286
+                        item.insertText = item.insertText.replace(`${suffix}$1`, '$1');
+                    }
+                    if (item.data) {
+                        // @ts-expect-error
+                        item.data.__isComponentAutoImport = {
+                            oldName,
+                            newName: item.name,
+                        };
+                    }
+                    break;
                 }
             }
-            return;
+            if (item.data) {
+                // @ts-expect-error
+                item.data.__isAutoImport = {
+                    fileName,
+                };
+            }
         }
-        if (!root.sfc.template
-            || position < root.sfc.template.startTagEnd
-            || position > root.sfc.template.endTagStart) {
-            return result;
+    }
+}
+function resolveCompletionEntryDetails(language, details, data) {
+    // modify import statement
+    if (data.__isComponentAutoImport) {
+        const { oldName, newName } = data.__isComponentAutoImport;
+        for (const codeAction of details?.codeActions ?? []) {
+            for (const change of codeAction.changes) {
+                for (const textChange of change.textChanges) {
+                    textChange.newText = textChange.newText.replace('import ' + oldName + ' from ', 'import ' + newName + ' from ');
+                }
+            }
         }
-        const definitions = new Set(result.definitions);
-        // #5275
-        if (result.definitions.length >= 2) {
-            for (const definition of result.definitions) {
-                if (root.sfc.content[definition.textSpan.start - 1] === '@'
-                    || root.sfc.content.slice(definition.textSpan.start - 5, definition.textSpan.start) === 'v-on:') {
-                    definitions.delete(definition);
+    }
+    if (data.__isAutoImport) {
+        const { fileName } = data.__isAutoImport;
+        const sourceScript = language.scripts.get(fileName);
+        if (sourceScript?.generated?.root instanceof language_core_1.VueVirtualCode) {
+            const { vueSfc } = sourceScript.generated.root;
+            if (!vueSfc?.descriptor.script && !vueSfc?.descriptor.scriptSetup) {
+                for (const codeAction of details?.codeActions ?? []) {
+                    for (const change of codeAction.changes) {
+                        for (const textChange of change.textChanges) {
+                            textChange.newText = `<script setup lang="ts">${textChange.newText}</script>\n\n`;
+                            break;
+                        }
+                        break;
+                    }
+                    break;
                 }
             }
         }
-        return {
-            definitions: [...definitions],
-            textSpan: result.textSpan,
-        };
-    };
+    }
 }
 //# sourceMappingURL=common.js.map

package/lib/requests/collectExtractProps.js

@@ -12,7 +12,7 @@ function collectExtractProps(ts, language, program, sourceScript, virtualCode, t
     sourceFile.forEachChild(function visit(node) {
         if (ts.isPropertyAccessExpression(node)
             && ts.isIdentifier(node.expression)
-            && node.expression.text === '__VLS_ctx'
+            && node.expression.text === language_core_1.names.ctx
             && ts.isIdentifier(node.name)) {
             const { name } = node;
             for (const map of maps) {

package/lib/requests/getComponentDirectives.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentDirectives = getComponentDirectives;
+const language_core_1 = require("@vue/language-core");
 const utils_1 = require("./utils");
 const builtInDirectives = new Set([
     'vBind',
@@ -11,7 +12,12 @@ const builtInDirectives = new Set([
     'vSlot',
 ]);
 function getComponentDirectives(ts, program, fileName) {
-    const directives = (0, utils_1.getVariableType)(ts, program, fileName, '__VLS_directives');
+    const sourceFile = program.getSourceFile(fileName);
+    if (!sourceFile) {
+        return [];
+    }
+    const checker = program.getTypeChecker();
+    const directives = (0, utils_1.getVariableType)(ts, checker, sourceFile, language_core_1.names.directives);
     if (!directives) {
         return [];
     }

package/lib/requests/getComponentEvents.d.ts

@@ -1,2 +1,3 @@
+import type { VueVirtualCode } from '@vue/language-core';
 import type * as ts from 'typescript';
-export declare function getComponentEvents(ts: typeof import('typescript'), program: ts.Program, fileName: string, tag: string): string[];
+export declare function getComponentEvents(ts: typeof import('typescript'), program: ts.Program, virtualCode: VueVirtualCode, tag: string): string[];

package/lib/requests/getComponentEvents.js

@@ -2,13 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentEvents = getComponentEvents;
 const utils_1 = require("./utils");
-function getComponentEvents(ts, program, fileName, tag) {
-    const checker = program.getTypeChecker();
-    const components = (0, utils_1.getVariableType)(ts, program, fileName, '__VLS_components');
-    if (!components) {
+function getComponentEvents(ts, program, virtualCode, tag) {
+    const sourceFile = program.getSourceFile(virtualCode.fileName);
+    if (!sourceFile) {
         return [];
     }
-    const componentType = (0, utils_1.getComponentType)(ts, program, fileName, components, tag);
+    const checker = program.getTypeChecker();
+    const componentType = (0, utils_1.getComponentType)(ts, checker, sourceFile, virtualCode, tag);
     if (!componentType) {
         return [];
     }
@@ -19,15 +19,15 @@ function getComponentEvents(ts, program, fileName, tag) {
     // 		// TODO
     // 	}
     // }
-    for (const sig of componentType.getConstructSignatures()) {
+    for (const sig of componentType.type.getConstructSignatures()) {
         const instanceType = sig.getReturnType();
         const emitSymbol = instanceType.getProperty('$emit');
         if (emitSymbol) {
-            const emitType = checker.getTypeOfSymbolAtLocation(emitSymbol, components.node);
+            const emitType = checker.getTypeOfSymbolAtLocation(emitSymbol, componentType.node);
             for (const call of emitType.getCallSignatures()) {
                 if (call.parameters.length) {
                     const eventNameParamSymbol = call.parameters[0];
-                    const eventNameParamType = checker.getTypeOfSymbolAtLocation(eventNameParamSymbol, components.node);
+                    const eventNameParamType = checker.getTypeOfSymbolAtLocation(eventNameParamSymbol, componentType.node);
                     if (eventNameParamType.isStringLiteral()) {
                         result.add(eventNameParamType.value);
                     }

package/lib/requests/getComponentNames.d.ts

@@ -1,2 +1,3 @@
+import { type VueVirtualCode } from '@vue/language-core';
 import type * as ts from 'typescript';
-export declare function getComponentNames(ts: typeof import('typescript'), program: ts.Program, fileName: string): string[];
+export declare function getComponentNames(ts: typeof import('typescript'), program: ts.Program, { fileName, sfc }: VueVirtualCode): string[];

package/lib/requests/getComponentNames.js

@@ -1,15 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentNames = getComponentNames;
+const language_core_1 = require("@vue/language-core");
 const utils_1 = require("./utils");
-function getComponentNames(ts, program, fileName) {
-    const names = (0, utils_1.getVariableType)(ts, program, fileName, '__VLS_components')
+function getComponentNames(ts, program, { fileName, sfc }) {
+    const sourceFile = program.getSourceFile(fileName);
+    if (!sourceFile) {
+        return [];
+    }
+    const checker = program.getTypeChecker();
+    const componentNames = (0, utils_1.getVariableType)(ts, checker, sourceFile, language_core_1.names.components)
         ?.type
         .getProperties()
         .map(c => c.name)
         .filter(entry => !entry.includes('$') && !entry.startsWith('_'))
         ?? [];
-    names.push((0, utils_1.getSelfComponentName)(fileName));
-    return names;
+    componentNames.push((0, utils_1.getSelfComponentName)(fileName));
+    componentNames.push(...language_core_1.tsCodegen.get(sfc)?.getImportComponentNames() ?? []);
+    return [...new Set(componentNames)];
 }
 //# sourceMappingURL=getComponentNames.js.map

package/lib/requests/getComponentProps.d.ts

@@ -1,3 +1,4 @@
+import type { VueVirtualCode } from '@vue/language-core';
 import type * as ts from 'typescript';
 export interface ComponentPropInfo {
     name: string;
@@ -7,4 +8,4 @@ export interface ComponentPropInfo {
     documentation?: string;
     values?: string[];
 }
-export declare function getComponentProps(ts: typeof import('typescript'), program: ts.Program, fileName: string, tag: string): ComponentPropInfo[];
+export declare function getComponentProps(ts: typeof import('typescript'), program: ts.Program, virtualCode: VueVirtualCode, tag: string): ComponentPropInfo[];

package/lib/requests/getComponentProps.js

@@ -2,32 +2,32 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentProps = getComponentProps;
 const utils_1 = require("./utils");
-function getComponentProps(ts, program, fileName, tag) {
-    const components = (0, utils_1.getVariableType)(ts, program, fileName, '__VLS_components');
-    if (!components) {
+function getComponentProps(ts, program, virtualCode, tag) {
+    const sourceFile = program.getSourceFile(virtualCode.fileName);
+    if (!sourceFile) {
         return [];
     }
-    const componentType = (0, utils_1.getComponentType)(ts, program, fileName, components, tag);
+    const checker = program.getTypeChecker();
+    const componentType = (0, utils_1.getComponentType)(ts, checker, sourceFile, virtualCode, tag);
     if (!componentType) {
         return [];
     }
     const result = new Map();
-    const checker = program.getTypeChecker();
-    for (const sig of componentType.getCallSignatures()) {
+    for (const sig of componentType.type.getCallSignatures()) {
         if (sig.parameters.length) {
             const propParam = sig.parameters[0];
-            const propsType = checker.getTypeOfSymbolAtLocation(propParam, components.node);
+            const propsType = checker.getTypeOfSymbolAtLocation(propParam, componentType.node);
             const props = propsType.getProperties();
             for (const prop of props) {
                 handlePropSymbol(prop);
             }
         }
     }
-    for (const sig of componentType.getConstructSignatures()) {
+    for (const sig of componentType.type.getConstructSignatures()) {
         const instanceType = sig.getReturnType();
         const propsSymbol = instanceType.getProperty('$props');
         if (propsSymbol) {
-            const propsType = checker.getTypeOfSymbolAtLocation(propsSymbol, components.node);
+            const propsType = checker.getTypeOfSymbolAtLocation(propsSymbol, componentType.node);
             const props = propsType.getProperties();
             for (const prop of props) {
                 handlePropSymbol(prop);

package/lib/requests/getComponentSlots.js

@@ -8,8 +8,13 @@ function getComponentSlots(ts, program, virtualCode) {
     if (!codegen) {
         return [];
     }
-    const assignName = codegen.getSetupSlotsAssignName() ?? `__VLS_slots`;
-    const slots = (0, utils_1.getVariableType)(ts, program, virtualCode.fileName, assignName);
+    const sourceFile = program.getSourceFile(virtualCode.fileName);
+    if (!sourceFile) {
+        return [];
+    }
+    const checker = program.getTypeChecker();
+    const assignName = codegen.getSetupSlotsAssignName() ?? language_core_1.names.slots;
+    const slots = (0, utils_1.getVariableType)(ts, checker, sourceFile, assignName);
     if (!slots) {
         return [];
     }

package/lib/requests/getElementAttrs.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getElementAttrs = getElementAttrs;
+const language_core_1 = require("@vue/language-core");
 function getElementAttrs(ts, program, tag) {
     const checker = program.getTypeChecker();
-    const elements = checker.resolveName('__VLS_intrinsics', undefined, ts.SymbolFlags.Variable, false);
+    const elements = checker.resolveName(language_core_1.names.intrinsics, undefined, ts.SymbolFlags.Variable, false);
     if (!elements) {
         return [];
     }

package/lib/requests/getElementNames.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getElementNames = getElementNames;
+const language_core_1 = require("@vue/language-core");
 function getElementNames(ts, program) {
     const checker = program.getTypeChecker();
-    const elements = checker.resolveName('__VLS_intrinsics', undefined, ts.SymbolFlags.Variable, false);
+    const elements = checker.resolveName(language_core_1.names.intrinsics, undefined, ts.SymbolFlags.Variable, false);
     if (!elements) {
         return [];
     }

package/lib/requests/index.d.ts

@@ -15,5 +15,7 @@ export interface Requests {
     getDocumentHighlights(fileName: string, position: number): Response<ts.DocumentHighlights[]>;
     getEncodedSemanticClassifications(fileName: string, span: ts.TextSpan): Response<ts.Classifications>;
     getQuickInfoAtPosition(fileName: string, position: ts.LineAndCharacter): Response<string>;
+    getAutoImportSuggestions(fileName: string, position: number, preferences: ts.UserPreferences, formatOptions: ts.FormatCodeSettings): Response<ts.CompletionInfo>;
+    resolveAutoImportCompletionEntry(data: ts.CompletionEntryData, preferences: ts.UserPreferences, formatOptions: ts.FormatCodeSettings): Response<ts.CompletionEntryDetails>;
 }
 export {};

package/lib/requests/utils.d.ts

@@ -1,7 +1,11 @@
+import { type VueVirtualCode } from '@vue/language-core';
 import type * as ts from 'typescript';
-export declare function getComponentType(ts: typeof import('typescript'), program: ts.Program, fileName: string, components: NonNullable<ReturnType<typeof getVariableType>>, tag: string): ts.Type | undefined;
+export declare function getComponentType(ts: typeof import('typescript'), checker: ts.TypeChecker, sourceFile: ts.SourceFile, { fileName, sfc }: VueVirtualCode, tag: string): {
+    node: ts.Node;
+    type: ts.Type;
+} | undefined;
 export declare function getSelfComponentName(fileName: string): Capitalize<string>;
-export declare function getVariableType(ts: typeof import('typescript'), program: ts.Program, fileName: string, name: string): {
+export declare function getVariableType(ts: typeof import('typescript'), checker: ts.TypeChecker, sourceFile: ts.SourceFile, name: string): {
     node: ts.Node;
     type: ts.Type;
 } | undefined;

package/lib/requests/utils.js

@@ -3,47 +3,72 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentType = getComponentType;
 exports.getSelfComponentName = getSelfComponentName;
 exports.getVariableType = getVariableType;
+const language_core_1 = require("@vue/language-core");
 const shared_1 = require("@vue/shared");
 const path = require("path-browserify");
-function getComponentType(ts, program, fileName, components, tag) {
-    const checker = program.getTypeChecker();
-    const name = tag.split('.');
-    let componentSymbol = components.type.getProperty(name[0])
-        ?? components.type.getProperty((0, shared_1.camelize)(name[0]))
-        ?? components.type.getProperty((0, shared_1.capitalize)((0, shared_1.camelize)(name[0])));
-    let componentType;
-    if (!componentSymbol) {
-        const name = getSelfComponentName(fileName);
-        if (name === (0, shared_1.capitalize)((0, shared_1.camelize)(tag))) {
-            componentType = getVariableType(ts, program, fileName, '__VLS_export')?.type;
+function getComponentType(ts, checker, sourceFile, { fileName, sfc }, tag) {
+    const testNames = new Set([
+        tag,
+        (0, shared_1.camelize)(tag),
+        (0, shared_1.capitalize)((0, shared_1.camelize)(tag)),
+    ]);
+    const codegen = language_core_1.tsCodegen.get(sfc);
+    for (const importedName of codegen?.getImportComponentNames() ?? []) {
+        if (testNames.has(importedName)) {
+            const node = searchDefaultImportIdentifier(ts, sourceFile, importedName);
+            if (node) {
+                return {
+                    node,
+                    type: checker.getTypeAtLocation(node),
+                };
+            }
         }
     }
-    else {
-        componentType = checker.getTypeOfSymbolAtLocation(componentSymbol, components.node);
-        for (let i = 1; i < name.length; i++) {
-            componentSymbol = componentType.getProperty(name[i]);
-            if (componentSymbol) {
-                componentType = checker.getTypeOfSymbolAtLocation(componentSymbol, components.node);
+    const components = getVariableType(ts, checker, sourceFile, language_core_1.names.components);
+    if (components) {
+        const nameParts = tag.split('.');
+        let componentSymbol = components.type.getProperty(nameParts[0])
+            ?? components.type.getProperty((0, shared_1.camelize)(nameParts[0]))
+            ?? components.type.getProperty((0, shared_1.capitalize)((0, shared_1.camelize)(nameParts[0])));
+        let componentType;
+        if (!componentSymbol) {
+            const name = getSelfComponentName(fileName);
+            if (name === (0, shared_1.capitalize)((0, shared_1.camelize)(tag))) {
+                componentType = getVariableType(ts, checker, sourceFile, language_core_1.names._export)?.type;
+            }
+        }
+        else {
+            componentType = checker.getTypeOfSymbolAtLocation(componentSymbol, components.node);
+            for (let i = 1; i < nameParts.length; i++) {
+                componentSymbol = componentType.getProperty(nameParts[i]);
+                if (componentSymbol) {
+                    componentType = checker.getTypeOfSymbolAtLocation(componentSymbol, components.node);
+                }
             }
         }
+        if (componentType) {
+            return {
+                node: components.node,
+                type: componentType,
+            };
+        }
+    }
+    const selfName = getSelfComponentName(fileName);
+    if (testNames.has(selfName)) {
+        return getVariableType(ts, checker, sourceFile, language_core_1.names._export);
     }
-    return componentType;
 }
 function getSelfComponentName(fileName) {
     const baseName = path.basename(fileName);
     return (0, shared_1.capitalize)((0, shared_1.camelize)(baseName.slice(0, baseName.lastIndexOf('.'))));
 }
-function getVariableType(ts, program, fileName, name) {
-    const tsSourceFile = program.getSourceFile(fileName);
-    if (tsSourceFile) {
-        const checker = program.getTypeChecker();
-        const node = searchVariableDeclarationNode(ts, tsSourceFile, name);
-        if (node) {
-            return {
-                node: node,
-                type: checker.getTypeAtLocation(node),
-            };
-        }
+function getVariableType(ts, checker, sourceFile, name) {
+    const node = searchVariableDeclarationNode(ts, sourceFile, name);
+    if (node) {
+        return {
+            node: node,
+            type: checker.getTypeAtLocation(node),
+        };
     }
 }
 function searchVariableDeclarationNode(ts, sourceFile, name) {
@@ -62,4 +87,21 @@ function searchVariableDeclarationNode(ts, sourceFile, name) {
         }
     }
 }
+function searchDefaultImportIdentifier(ts, sourceFile, name) {
+    let result;
+    walk(sourceFile);
+    return result;
+    function walk(node) {
+        if (result) {
+            return;
+        }
+        else if (ts.isImportDeclaration(node)
+            && node.importClause?.name?.text === name) {
+            result = node.importClause.name;
+        }
+        else {
+            node.forEachChild(walk);
+        }
+    }
+}
 //# sourceMappingURL=utils.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@vue/typescript-plugin",
-	"version": "3.1.5",
+	"version": "3.1.7",
 	"license": "MIT",
 	"files": [
 		"**/*.js",
@@ -13,8 +13,8 @@
 		"directory": "packages/typescript-plugin"
 	},
 	"dependencies": {
-		"@volar/typescript": "2.4.23",
-		"@vue/language-core": "3.1.5",
+		"@volar/typescript": "2.4.26",
+		"@vue/language-core": "3.1.7",
 		"@vue/shared": "^3.5.0",
 		"path-browserify": "^1.0.1"
 	},
@@ -22,5 +22,5 @@
 		"@types/node": "^22.10.4",
 		"@types/path-browserify": "^1.0.1"
 	},
-	"gitHead": "d124a88fbf169e793c39ae4248da2092098de92d"
+	"gitHead": "20dcd47c0cb4ce30e2c5e3ef1986ce297c218a06"
 }