@vue/language-core 3.1.5 → 3.1.7

package/lib/plugins/vue-tsx.d.ts

@@ -1,6 +1,5 @@
 import type { Sfc, VueLanguagePlugin } from '../types';
 export declare const tsCodegen: WeakMap<Sfc, {
-    getLang: () => string;
     getScriptRanges: () => {
         exportDefault: (import("../types").TextRange & {
             expression: import("../types").TextRange;
@@ -15,22 +14,14 @@ export declare const tsCodegen: WeakMap<Sfc, {
             name: import("../types").TextRange | undefined;
             inheritAttrs: string | undefined;
         } | undefined;
-        bindings: {
-            range: import("../types").TextRange;
-            moduleName?: string;
-            isDefaultImport?: boolean;
-            isNamespace?: boolean;
-        }[];
+        bindings: import("../types").TextRange[];
+        components: import("../types").TextRange[];
     } | undefined;
     getScriptSetupRanges: () => {
         leadingCommentEndOffset: number;
         importSectionEndOffset: number;
-        bindings: {
-            range: import("../types").TextRange;
-            moduleName?: string;
-            isDefaultImport?: boolean;
-            isNamespace?: boolean;
-        }[];
+        bindings: import("../types").TextRange[];
+        components: import("../types").TextRange[];
         defineModel: {
             localName?: import("../types").TextRange;
             name?: import("../types").TextRange;
@@ -121,14 +112,11 @@ export declare const tsCodegen: WeakMap<Sfc, {
     getSetupSlotsAssignName: () => string | undefined;
     getGeneratedScript: () => {
         codes: import("../types").Code[];
-        generatedTemplate: boolean;
-        generatedPropsType: boolean;
-        bypassDefineComponent: boolean;
-        bindingNames: Set<string>;
+        generatedTypes: Set<string>;
         localTypes: {
             generate: () => Generator<string, void, unknown>;
             readonly PrettifyLocal: string;
-            readonly WithDefaultsLocal: string;
+            readonly WithDefaults: string;
             readonly WithSlots: string;
             readonly PropsChildren: string;
             readonly TypePropsToOption: string;
@@ -138,6 +126,7 @@ export declare const tsCodegen: WeakMap<Sfc, {
     };
     getGeneratedTemplate: () => {
         codes: import("../types").Code[];
+        generatedTypes: Set<string>;
         currentInfo: {
             ignoreError?: boolean;
             expectError?: {
@@ -150,7 +139,6 @@ export declare const tsCodegen: WeakMap<Sfc, {
             };
         };
         resolveCodeFeatures: (features: import("../types").VueCodeInformation) => import("../types").VueCodeInformation;
-        inlineTsAsts: Map<string, import("typescript").SourceFile> | undefined;
         inVFor: boolean;
         slots: {
             name: string;
@@ -164,16 +152,9 @@ export declare const tsCodegen: WeakMap<Sfc, {
             propsVar: string;
         }[];
         dollarVars: Set<string>;
-        accessExternalVariables: Map<string, Set<number>>;
+        componentAccessMap: Map<string, Map<string, Set<number>>>;
         blockConditions: string[];
-        scopedClasses: {
-            source: string;
-            className: string;
-            offset: number;
-        }[];
-        emptyClassOffsets: number[];
         inlayHints: import("../codegen/inlayHints").InlayHintInfo[];
-        bindingAttrLocs: import("@vue/compiler-dom").SourceLocation[];
         inheritedAttrVars: Set<string>;
         templateRefs: Map<string, {
             typeExp: string;
@@ -186,18 +167,19 @@ export declare const tsCodegen: WeakMap<Sfc, {
         singleRootElTypes: Set<string>;
         singleRootNodes: Set<import("@vue/compiler-dom").ElementNode | null>;
         addTemplateRef(name: string, typeExp: string, offset: number): void;
-        accessExternalVariable(name: string, offset?: number): void;
-        hasLocalVariable(name: string): boolean;
-        addLocalVariable(name: string): void;
-        removeLocalVariable(name: string): void;
+        recordComponentAccess(source: string, name: string, offset?: number): void;
+        scopes: Set<string>[];
+        declare(...varNames: string[]): void;
+        startScope(): () => Generator<import("../types").Code, any, any>;
         getInternalVariable(): string;
         getHoistVariable(originalVar: string): string;
         generateHoistVariables(): Generator<string, void, unknown>;
         generateConditionGuards(): Generator<string, void, unknown>;
-        generateAutoImportCompletion(): Generator<import("../types").Code>;
         enter(node: import("@vue/compiler-dom").RootNode | import("@vue/compiler-dom").TemplateChildNode | import("@vue/compiler-dom").SimpleExpressionNode): boolean;
         exit(): Generator<import("../types").Code>;
     } | undefined;
+    getImportComponentNames: () => Set<string>;
+    getSetupExposed: () => Set<string>;
 }>;
 declare const plugin: VueLanguagePlugin;
 export default plugin;

package/lib/plugins/vue-tsx.js

@@ -5,6 +5,7 @@ const shared_1 = require("@vue/shared");
 const alien_signals_1 = require("alien-signals");
 const path = require("path-browserify");
 const script_1 = require("../codegen/script");
+const style_1 = require("../codegen/style");
 const template_1 = require("../codegen/template");
 const compilerOptions_1 = require("../compilerOptions");
 const scriptRanges_1 = require("../parsers/scriptRanges");
@@ -16,52 +17,40 @@ const validLangs = new Set(['js', 'jsx', 'ts', 'tsx']);
 const plugin = ctx => {
     return {
         version: 2.2,
-        requiredCompilerOptions: [
-            'noPropertyAccessFromIndexSignature',
-        ],
-        getEmbeddedCodes(fileName, sfc) {
-            const codegen = useCodegen(fileName, sfc);
-            return [{
-                    id: 'script_' + codegen.getLang(),
-                    lang: codegen.getLang(),
-                }];
+        getEmbeddedCodes(_fileName, sfc) {
+            const lang = computeLang(sfc);
+            return [{ lang, id: 'script_' + lang }];
         },
         resolveEmbeddedCode(fileName, sfc, embeddedFile) {
             if (/script_(js|jsx|ts|tsx)/.test(embeddedFile.id)) {
-                const codegen = useCodegen(fileName, sfc);
-                const tsx = codegen.getGeneratedScript();
-                embeddedFile.content = [...tsx.codes];
+                let codegen = exports.tsCodegen.get(sfc);
+                if (!codegen) {
+                    exports.tsCodegen.set(sfc, codegen = useCodegen(fileName, sfc, ctx));
+                }
+                const generatedScript = codegen.getGeneratedScript();
+                embeddedFile.content = [...generatedScript.codes];
             }
         },
     };
-    function useCodegen(fileName, sfc) {
-        if (!exports.tsCodegen.has(sfc)) {
-            exports.tsCodegen.set(sfc, createTsx(fileName, sfc, ctx));
-        }
-        return exports.tsCodegen.get(sfc);
-    }
-};
-exports.default = plugin;
-function createTsx(fileName, sfc, ctx) {
-    const ts = ctx.modules.typescript;
-    const getRawLang = (0, alien_signals_1.computed)(() => {
+    function computeLang(sfc) {
+        let lang = sfc.scriptSetup?.lang ?? sfc.script?.lang;
         if (sfc.script && sfc.scriptSetup) {
             if (sfc.scriptSetup.lang !== 'js') {
-                return sfc.scriptSetup.lang;
+                lang = sfc.scriptSetup.lang;
             }
             else {
-                return sfc.script.lang;
+                lang = sfc.script.lang;
             }
         }
-        return sfc.scriptSetup?.lang ?? sfc.script?.lang;
-    });
-    const getLang = (0, alien_signals_1.computed)(() => {
-        const rawLang = getRawLang();
-        if (rawLang && validLangs.has(rawLang)) {
-            return rawLang;
+        if (lang && validLangs.has(lang)) {
+            return lang;
         }
         return 'ts';
-    });
+    }
+};
+exports.default = plugin;
+function useCodegen(fileName, sfc, ctx) {
+    const ts = ctx.modules.typescript;
     const getResolvedOptions = (0, alien_signals_1.computed)(() => {
         const options = (0, vueCompilerOptions_1.parseVueCompilerOptions)(sfc.comments);
         if (options) {
@@ -72,51 +61,46 @@ function createTsx(fileName, sfc, ctx) {
         return ctx.vueCompilerOptions;
     });
     const getScriptRanges = (0, alien_signals_1.computed)(() => sfc.script && validLangs.has(sfc.script.lang)
-        ? (0, scriptRanges_1.parseScriptRanges)(ts, sfc.script.ast, !!sfc.scriptSetup)
+        ? (0, scriptRanges_1.parseScriptRanges)(ts, sfc.script.ast, getResolvedOptions())
         : undefined);
     const getScriptSetupRanges = (0, alien_signals_1.computed)(() => sfc.scriptSetup && validLangs.has(sfc.scriptSetup.lang)
         ? (0, scriptSetupRanges_1.parseScriptSetupRanges)(ts, sfc.scriptSetup.ast, getResolvedOptions())
         : undefined);
-    const getSetupBindingNames = (0, signals_1.computedSet)(() => {
-        const newNames = new Set();
-        const bindings = getScriptSetupRanges()?.bindings;
-        if (sfc.scriptSetup && bindings) {
-            for (const { range } of bindings) {
-                newNames.add(sfc.scriptSetup.content.slice(range.start, range.end));
+    const getImportComponentNames = (0, signals_1.computedSet)(() => {
+        const names = new Set();
+        const scriptSetupRanges = getScriptSetupRanges();
+        if (sfc.scriptSetup && scriptSetupRanges) {
+            for (const range of scriptSetupRanges.components) {
+                names.add(sfc.scriptSetup.content.slice(range.start, range.end));
             }
-        }
-        return newNames;
-    });
-    const getSetupImportComponentNames = (0, signals_1.computedSet)(() => {
-        const newNames = new Set();
-        const bindings = getScriptSetupRanges()?.bindings;
-        if (sfc.scriptSetup && bindings) {
-            for (const { range, moduleName, isDefaultImport, isNamespace } of bindings) {
-                if (moduleName
-                    && isDefaultImport
-                    && !isNamespace
-                    && ctx.vueCompilerOptions.extensions.some(ext => moduleName.endsWith(ext))) {
-                    newNames.add(sfc.scriptSetup.content.slice(range.start, range.end));
+            const scriptRange = getScriptRanges();
+            if (sfc.script && scriptRange) {
+                for (const range of scriptRange.components) {
+                    names.add(sfc.script.content.slice(range.start, range.end));
                 }
             }
         }
-        return newNames;
+        return names;
     });
-    const getSetupDestructuredPropNames = (0, signals_1.computedSet)(() => {
-        const newNames = new Set(getScriptSetupRanges()?.defineProps?.destructured?.keys());
-        const rest = getScriptSetupRanges()?.defineProps?.destructuredRest;
+    const getSetupConsts = (0, signals_1.computedSet)(() => {
+        const scriptSetupRanges = getScriptSetupRanges();
+        const names = new Set([
+            ...scriptSetupRanges?.defineProps?.destructured?.keys() ?? [],
+            ...getImportComponentNames(),
+        ]);
+        const rest = scriptSetupRanges?.defineProps?.destructuredRest;
         if (rest) {
-            newNames.add(rest);
+            names.add(rest);
         }
-        return newNames;
+        return names;
     });
-    const getSetupTemplateRefNames = (0, signals_1.computedSet)(() => {
+    const getSetupRefs = (0, signals_1.computedSet)(() => {
         const newNames = new Set(getScriptSetupRanges()?.useTemplateRef
             .map(({ name }) => name)
             .filter(name => name !== undefined));
         return newNames;
     });
-    const setupHasDefineSlots = (0, alien_signals_1.computed)(() => !!getScriptSetupRanges()?.defineSlots);
+    const hasDefineSlots = (0, alien_signals_1.computed)(() => !!getScriptSetupRanges()?.defineSlots);
     const getSetupPropsAssignName = (0, alien_signals_1.computed)(() => getScriptSetupRanges()?.defineProps?.name);
     const getSetupSlotsAssignName = (0, alien_signals_1.computed)(() => getScriptSetupRanges()?.defineSlots?.name);
     const getSetupInheritAttrs = (0, alien_signals_1.computed)(() => {
@@ -148,42 +132,100 @@ function createTsx(fileName, sfc, ctx) {
         }
         return (0, template_1.generateTemplate)({
             ts,
-            compilerOptions: ctx.compilerOptions,
             vueCompilerOptions: getResolvedOptions(),
             template: sfc.template,
-            scriptSetupBindingNames: getSetupBindingNames(),
-            scriptSetupImportComponentNames: getSetupImportComponentNames(),
-            destructuredPropNames: getSetupDestructuredPropNames(),
-            templateRefNames: getSetupTemplateRefNames(),
-            hasDefineSlots: setupHasDefineSlots(),
+            setupConsts: getSetupConsts(),
+            setupRefs: getSetupRefs(),
+            hasDefineSlots: hasDefineSlots(),
             propsAssignName: getSetupPropsAssignName(),
             slotsAssignName: getSetupSlotsAssignName(),
             inheritAttrs: getSetupInheritAttrs(),
             selfComponentName: getComponentSelfName(),
         });
     });
+    const getGeneratedStyle = (0, alien_signals_1.computed)(() => {
+        if (!sfc.styles.length) {
+            return;
+        }
+        return (0, style_1.generateStyle)({
+            ts,
+            vueCompilerOptions: getResolvedOptions(),
+            styles: sfc.styles,
+            setupConsts: getSetupConsts(),
+            setupRefs: getSetupRefs(),
+        });
+    });
+    const getTemplateStartTagOffset = (0, alien_signals_1.computed)(() => {
+        if (sfc.template) {
+            return sfc.template.start - sfc.template.startTagEnd;
+        }
+    });
+    const getSetupExposed = (0, signals_1.computedSet)(() => {
+        const allVars = new Set();
+        const scriptSetupRanges = getScriptSetupRanges();
+        if (!sfc.scriptSetup || !scriptSetupRanges) {
+            return allVars;
+        }
+        for (const range of scriptSetupRanges.bindings) {
+            const name = sfc.scriptSetup.content.slice(range.start, range.end);
+            allVars.add(name);
+        }
+        const scriptRanges = getScriptRanges();
+        if (sfc.script && scriptRanges) {
+            for (const range of scriptRanges.bindings) {
+                const name = sfc.script.content.slice(range.start, range.end);
+                allVars.add(name);
+            }
+        }
+        if (!allVars.size) {
+            return allVars;
+        }
+        const exposedNames = new Set();
+        const generatedTemplate = getGeneratedTemplate();
+        const generatedStyle = getGeneratedStyle();
+        for (const [name] of generatedTemplate?.componentAccessMap ?? []) {
+            if (allVars.has(name)) {
+                exposedNames.add(name);
+            }
+        }
+        for (const [name] of generatedStyle?.componentAccessMap ?? []) {
+            if (allVars.has(name)) {
+                exposedNames.add(name);
+            }
+        }
+        for (const component of sfc.template?.ast?.components ?? []) {
+            const testNames = new Set([(0, shared_1.camelize)(component), (0, shared_1.capitalize)((0, shared_1.camelize)(component))]);
+            for (const testName of testNames) {
+                if (allVars.has(testName)) {
+                    exposedNames.add(testName);
+                }
+            }
+        }
+        return exposedNames;
+    });
     const getGeneratedScript = (0, alien_signals_1.computed)(() => {
         return (0, script_1.generateScript)({
             ts,
-            compilerOptions: ctx.compilerOptions,
             vueCompilerOptions: getResolvedOptions(),
-            sfc,
+            script: sfc.script,
+            scriptSetup: sfc.scriptSetup,
+            setupExposed: getSetupExposed(),
             fileName,
-            lang: getLang(),
             scriptRanges: getScriptRanges(),
             scriptSetupRanges: getScriptSetupRanges(),
             templateCodegen: getGeneratedTemplate(),
-            destructuredPropNames: getSetupDestructuredPropNames(),
-            templateRefNames: getSetupTemplateRefNames(),
+            templateStartTagOffset: getTemplateStartTagOffset(),
+            styleCodegen: getGeneratedStyle(),
         });
     });
     return {
-        getLang,
         getScriptRanges,
         getScriptSetupRanges,
         getSetupSlotsAssignName,
         getGeneratedScript,
         getGeneratedTemplate,
+        getImportComponentNames,
+        getSetupExposed,
     };
 }
 //# sourceMappingURL=vue-tsx.js.map

package/lib/plugins.js

@@ -37,6 +37,7 @@ function createPlugins(pluginContext) {
         file_md_1.default,
         file_html_1.default,
         vue_root_tags_1.default,
+        vue_tsx_1.default,
         vue_script_js_1.default,
         vue_style_css_1.default,
         vue_template_html_1.default,
@@ -46,7 +47,6 @@ function createPlugins(pluginContext) {
         vue_sfc_customblocks_1.default,
         vue_sfc_scripts_1.default,
         vue_sfc_template_1.default,
-        vue_tsx_1.default,
         ...pluginContext.vueCompilerOptions.plugins,
     ];
     const pluginInstances = plugins

package/lib/types.d.ts

@@ -3,7 +3,7 @@ import type * as CompilerDOM from '@vue/compiler-dom';
 import type { SFCParseResult } from '@vue/compiler-sfc';
 import type { Segment } from 'muggle-string';
 import type * as ts from 'typescript';
-import type { VueEmbeddedCode } from './virtualFile/embeddedFile';
+import type { VueEmbeddedCode } from './virtualCode/embeddedCodes';
 export type { SFCParseResult } from '@vue/compiler-sfc';
 export { VueEmbeddedCode };
 export type RawVueCompilerOptions = Partial<Omit<VueCompilerOptions, 'target' | 'globalTypesPath' | 'plugins'>> & {
@@ -13,7 +13,8 @@ export type RawVueCompilerOptions = Partial<Omit<VueCompilerOptions, 'target' |
     plugins?: string[];
 };
 export interface VueCodeInformation extends CodeInformation {
-    __combineOffset?: number;
+    __importCompletion?: boolean;
+    __combineToken?: symbol;
     __linkedToken?: symbol;
 }
 export type Code = Segment<VueCodeInformation>;
@@ -64,7 +65,7 @@ export interface VueCompilerOptions {
     experimentalModelPropName: Record<string, Record<string, boolean | Record<string, string> | Record<string, string>[]>>;
 }
 export declare const validVersions: readonly [2, 2.1, 2.2];
-export type VueLanguagePluginReturn = {
+export interface VueLanguagePluginReturn {
     version: typeof validVersions[number];
     name?: string;
     order?: number;
@@ -92,7 +93,7 @@ export type VueLanguagePluginReturn = {
         lang: string;
     }[];
     resolveEmbeddedCode?(fileName: string, sfc: Sfc, embeddedFile: VueEmbeddedCode): void;
-};
+}
 export type VueLanguagePlugin = (ctx: {
     modules: {
         typescript: typeof ts;

package/lib/utils/parseSfc.js

@@ -109,7 +109,11 @@ function createBlock(node, source) {
                 block.__src = parseAttr(p, node);
             }
             else if (isScriptBlock(block)) {
-                if (p.name === 'setup' || p.name === 'vapor') {
+                if (p.name === 'vapor') {
+                    block.setup ??= attrs[p.name];
+                    block.__generic ??= true;
+                }
+                else if (p.name === 'setup') {
                     block.setup = attrs[p.name];
                 }
                 else if (p.name === 'generic') {
@@ -138,9 +142,9 @@ function parseAttr(p, node) {
     if (!p.value) {
         return true;
     }
-    const offset = (0, shared_1.getAttributeValueOffset)(p.value);
+    const [content, offset] = (0, shared_1.normalizeAttributeValue)(p.value);
     return {
-        text: p.value.content,
+        text: content,
         offset: offset - node.loc.start.offset,
         quotes: offset > p.value.loc.start.offset,
     };

package/lib/utils/shared.d.ts

@@ -3,7 +3,7 @@ import type * as ts from 'typescript';
 import type { Sfc, TextRange } from '../types';
 export { hyphenate as hyphenateTag } from '@vue/shared';
 export declare function hyphenateAttr(str: string): string;
-export declare function getAttributeValueOffset(node: CompilerDOM.TextNode): number;
+export declare function normalizeAttributeValue(node: CompilerDOM.TextNode): readonly [string, number];
 export declare function getElementTagOffsets(node: CompilerDOM.ElementNode, template: NonNullable<Sfc['template']>): [number] | [number, number];
 export declare function getStartEnd(ts: typeof import('typescript'), node: ts.Node, ast: ts.SourceFile): TextRange;
 export declare function getNodeText(ts: typeof import('typescript'), node: ts.Node, ast: ts.SourceFile): string;

package/lib/utils/shared.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.hyphenateTag = void 0;
 exports.hyphenateAttr = hyphenateAttr;
-exports.getAttributeValueOffset = getAttributeValueOffset;
+exports.normalizeAttributeValue = normalizeAttributeValue;
 exports.getElementTagOffsets = getElementTagOffsets;
 exports.getStartEnd = getStartEnd;
 exports.getNodeText = getNodeText;
@@ -17,12 +17,13 @@ function hyphenateAttr(str) {
     }
     return hyphencase;
 }
-function getAttributeValueOffset(node) {
-    let offset = node.loc.start.offset;
-    if (node.loc.source.startsWith('"') || node.loc.source.startsWith("'")) {
-        offset++;
+function normalizeAttributeValue(node) {
+    const { source, start } = node.loc;
+    if ((source.startsWith('"') && source.endsWith('"'))
+        || (source.startsWith("'") && source.endsWith("'"))) {
+        return [source.slice(1, -1), start.offset + 1];
     }
-    return offset;
+    return [source, start.offset];
 }
 function getElementTagOffsets(node, template) {
     const tagOffsets = [

package/lib/utils/signals.d.ts

@@ -1,3 +1,3 @@
-export declare function computedArray<I, O>(arr: () => I[], getGetter: (item: () => I, index: number) => () => O): readonly Readonly<O>[];
+export declare function reactiveArray<I, O>(getArr: () => I[], getGetter: (item: () => I, index: number) => () => O): readonly Readonly<O>[];
 export declare function computedSet<T>(source: () => Set<T>): () => Set<T>;
-export declare function computedItems<T>(source: () => T[], compareFn: (oldItem: T, newItem: T) => boolean): () => T[];
+export declare function computedArray<T>(source: () => T[], compareFn?: (oldItem: T, newItem: T) => boolean): () => T[];

package/lib/utils/signals.js

@@ -1,14 +1,16 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.computedArray = computedArray;
+exports.reactiveArray = reactiveArray;
 exports.computedSet = computedSet;
-exports.computedItems = computedItems;
+exports.computedArray = computedArray;
 const alien_signals_1 = require("alien-signals");
-function computedArray(arr, getGetter) {
+function reactiveArray(getArr, getGetter) {
+    const arr = (0, alien_signals_1.computed)(getArr);
     const length = (0, alien_signals_1.computed)(() => arr().length);
     const keys = (0, alien_signals_1.computed)(() => {
-        const keys = [];
-        for (let i = 0; i < length(); i++) {
+        const l = length();
+        const keys = new Array(l);
+        for (let i = 0; i < l; i++) {
             keys.push(String(i));
         }
         return keys;
@@ -52,7 +54,7 @@ function computedSet(source) {
         return newValue;
     });
 }
-function computedItems(source, compareFn) {
+function computedArray(source, compareFn = (oldItem, newItem) => oldItem === newItem) {
     return (0, alien_signals_1.computed)(oldArr => {
         oldArr ??= [];
         const newArr = source();

package/lib/virtualCode/embeddedCodes.d.ts

@@ -0,0 +1,12 @@
+import type { Mapping, VirtualCode } from '@volar/language-core';
+import type { Code, Sfc, VueLanguagePluginReturn } from '../types';
+export declare class VueEmbeddedCode {
+    id: string;
+    lang: string;
+    content: Code[];
+    parentCodeId?: string;
+    linkedCodeMappings: Mapping[];
+    embeddedCodes: VueEmbeddedCode[];
+    constructor(id: string, lang: string, content: Code[]);
+}
+export declare function useEmbeddedCodes(plugins: VueLanguagePluginReturn[], fileName: string, sfc: Sfc): () => VirtualCode[];