@vue/language-core 2.0.13 → 2.0.15

package/lib/codegen/template/elementProps.js

@@ -0,0 +1,275 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateElementProps = void 0;
+const CompilerDOM = require("@vue/compiler-dom");
+const shared_1 = require("@vue/shared");
+const minimatch_1 = require("minimatch");
+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");
+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) {
+        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, `;
+            }
+        }
+        if (generatedEvent) {
+            yield `}, `;
+        }
+    }
+    else {
+        for (const prop of props) {
+            if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
+                && prop.name === 'on'
+                && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
+                yield* (0, elementEvents_1.generateEventArg)(options, ctx, prop.arg, false);
+                yield `: `;
+                yield* (0, elementEvents_1.generateEventExpression)(options, ctx, prop);
+                yield `,${common_1.newLine}`;
+            }
+        }
+    }
+    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.exp || prop.exp.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION)) {
+            let propName = prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
+                ? 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);
+            }
+            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
+            ) {
+                if (prop.exp && prop.exp.constType !== CompilerDOM.ConstantTypes.CAN_STRINGIFY) {
+                    propsFailedExps?.push(prop.exp);
+                }
+                continue;
+            }
+            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
+                ? {
+                    ...ctx.codeFeatures.withoutHighlightAndCompletion,
+                    navigation: ctx.codeFeatures.withoutHighlightAndCompletion.navigation
+                        ? {
+                            resolveRenameNewName: shared_1.camelize,
+                            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), `)`);
+            if (!enableCodeFeatures) {
+                yield (0, language_core_1.toString)([...codes]);
+            }
+            else {
+                yield* codes;
+            }
+            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)
+                continue;
+            }
+            const shouldCamelize = canCamelize
+                && (0, shared_2.hyphenateAttr)(prop.name) === prop.name
+                && !options.vueCompilerOptions.htmlAttributes.some(pattern => (0, minimatch_1.minimatch)(prop.name, pattern));
+            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,
+                    navigation: ctx.codeFeatures.withoutHighlightAndCompletion.navigation
+                        ? {
+                            resolveRenameNewName: shared_1.camelize,
+                            resolveRenameEditText: shared_2.hyphenateAttr,
+                        }
+                        : false,
+                }
+                : ctx.codeFeatures.withoutHighlightAndCompletion, prop.loc.name_1 ?? (prop.loc.name_1 = {}), shouldCamelize), `: (`, ...(prop.value
+                ? generateAttrValue(prop.value, ctx.codeFeatures.all)
+                : [`true`]), `)`);
+            if (!enableCodeFeatures) {
+                yield (0, language_core_1.toString)([...codes]);
+            }
+            else {
+                yield* codes;
+            }
+            yield `, `;
+        }
+        else if (prop.type === CompilerDOM.NodeTypes.DIRECTIVE
+            && prop.name === 'bind'
+            && !prop.arg
+            && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
+            const codes = (0, common_1.conditionWrapWith)(enableCodeFeatures, prop.exp.loc.start.offset, prop.exp.loc.end.offset, ctx.codeFeatures.verification, `...`, ...(0, interpolation_1.generateInterpolation)(options, ctx, prop.exp.content, prop.exp.loc, prop.exp.loc.start.offset, ctx.codeFeatures.all, '(', ')'));
+            if (!enableCodeFeatures) {
+                yield (0, language_core_1.toString)([...codes]);
+            }
+            else {
+                yield* codes;
+            }
+            yield `, `;
+        }
+        else {
+            // comment this line to avoid affecting comments in prop expressions
+            // tsCodeGen.addText("/* " + [prop.type, prop.name, prop.arg?.loc.source, prop.exp?.loc.source, prop.loc.source].join(", ") + " */ ");
+        }
+    }
+}
+exports.generateElementProps = generateElementProps;
+function* genereatePropExp(options, ctx, exp, features, isShorthand, inlayHints) {
+    if (exp && exp.constType !== CompilerDOM.ConstantTypes.CAN_STRINGIFY) { // style='z-index: 2' will compile to {'z-index':'2'}
+        if (!isShorthand) { // vue 3.4+
+            yield* (0, interpolation_1.generateInterpolation)(options, ctx, exp.loc.source, exp.loc, exp.loc.start.offset, features, '(', ')');
+        }
+        else {
+            const propVariableName = (0, shared_1.camelize)(exp.loc.source);
+            if (common_1.variableNameRegex.test(propVariableName)) {
+                if (!ctx.hasLocalVariable(propVariableName)) {
+                    ctx.accessGlobalVariable(propVariableName, exp.loc.start.offset);
+                    yield `__VLS_ctx.`;
+                }
+                yield* (0, camelized_1.generateCamelized)(exp.loc.source, exp.loc.start.offset, features);
+                if (inlayHints) {
+                    yield [
+                        '',
+                        'template',
+                        exp.loc.end.offset,
+                        {
+                            __hint: {
+                                setting: 'vue.inlayHints.vBindShorthand',
+                                label: `="${propVariableName}"`,
+                                tooltip: [
+                                    `This is a shorthand for \`${exp.loc.source}="${propVariableName}"\`.`,
+                                    'To hide this hint, set `vue.inlayHints.vBindShorthand` to `false` in IDE settings.',
+                                    '[More info](https://github.com/vuejs/core/pull/9451)',
+                                ].join('\n\n'),
+                            },
+                        },
+                    ];
+                }
+            }
+        }
+    }
+    else {
+        yield `{}`;
+    }
+}
+function* generateAttrValue(attrNode, features) {
+    const char = attrNode.loc.source.startsWith("'") ? "'" : '"';
+    yield char;
+    let start = attrNode.loc.start.offset;
+    let end = attrNode.loc.end.offset;
+    let content = attrNode.loc.source;
+    if ((content.startsWith('"') && content.endsWith('"'))
+        || (content.startsWith("'") && content.endsWith("'"))) {
+        start++;
+        end--;
+        content = content.slice(1, -1);
+    }
+    if (needToUnicode(content)) {
+        yield* (0, common_1.wrapWith)(start, end, features, toUnicode(content));
+    }
+    else {
+        yield [content, 'template', start, features];
+    }
+    yield char;
+}
+function needToUnicode(str) {
+    return str.includes('\\') || str.includes('\n');
+}
+function toUnicode(str) {
+    return str.split('').map(value => {
+        const temp = value.charCodeAt(0).toString(16).padStart(4, '0');
+        if (temp.length > 2) {
+            return '\\u' + temp;
+        }
+        return value;
+    }).join('');
+}
+function getModelValuePropName(node, vueVersion, vueCompilerOptions) {
+    for (const modelName in vueCompilerOptions.experimentalModelPropName) {
+        const tags = vueCompilerOptions.experimentalModelPropName[modelName];
+        for (const tag in tags) {
+            if (node.tag === tag || node.tag === (0, shared_2.hyphenateTag)(tag)) {
+                const v = tags[tag];
+                if (typeof v === 'object') {
+                    const arr = Array.isArray(v) ? v : [v];
+                    for (const attrs of arr) {
+                        let failed = false;
+                        for (const attr in attrs) {
+                            const attrNode = node.props.find(prop => prop.type === CompilerDOM.NodeTypes.ATTRIBUTE && prop.name === attr);
+                            if (!attrNode || attrNode.value?.content !== attrs[attr]) {
+                                failed = true;
+                                break;
+                            }
+                        }
+                        if (!failed) {
+                            // all match
+                            return modelName || undefined;
+                        }
+                    }
+                }
+            }
+        }
+    }
+    for (const modelName in vueCompilerOptions.experimentalModelPropName) {
+        const tags = vueCompilerOptions.experimentalModelPropName[modelName];
+        for (const tag in tags) {
+            if (node.tag === tag || node.tag === (0, shared_2.hyphenateTag)(tag)) {
+                const attrs = tags[tag];
+                if (attrs === true) {
+                    return modelName || undefined;
+                }
+            }
+        }
+    }
+    return vueVersion < 3 ? 'value' : 'modelValue';
+}
+//# sourceMappingURL=elementProps.js.map

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

@@ -0,0 +1,60 @@
+import * as CompilerDOM from '@vue/compiler-dom';
+import type * as ts from 'typescript';
+import type { Code, Sfc, VueCompilerOptions } from '../../types';
+export interface TemplateCodegenOptions {
+    ts: typeof ts;
+    compilerOptions: ts.CompilerOptions;
+    vueCompilerOptions: VueCompilerOptions;
+    template: NonNullable<Sfc['template']>;
+    shouldGenerateScopedClasses?: boolean;
+    stylesScopedClasses: Set<string>;
+    hasDefineSlots?: boolean;
+    slotsAssignName?: string;
+    propsAssignName?: string;
+}
+export declare function generateTemplate(options: TemplateCodegenOptions): Generator<Code, {
+    ctx: {
+        slots: {
+            name: string;
+            loc?: number | undefined;
+            tagRange: [number, number];
+            varName: string;
+            nodeLoc: any;
+        }[];
+        dynamicSlots: {
+            expVar: string;
+            varName: string;
+        }[];
+        codeFeatures: {
+            all: import("../../types").VueCodeInformation;
+            verification: import("../../types").VueCodeInformation;
+            completion: import("../../types").VueCodeInformation;
+            additionalCompletion: import("../../types").VueCodeInformation;
+            navigation: import("../../types").VueCodeInformation;
+            navigationAndCompletion: import("../../types").VueCodeInformation;
+            withoutHighlight: import("../../types").VueCodeInformation;
+            withoutHighlightAndCompletion: import("../../types").VueCodeInformation;
+            withoutHighlightAndCompletionAndNavigation: import("../../types").VueCodeInformation;
+        };
+        accessGlobalVariables: Map<string, Set<number>>;
+        hasSlotElements: Set<CompilerDOM.ElementNode>;
+        blockConditions: string[];
+        usedComponentCtxVars: Set<string>;
+        scopedClasses: {
+            className: string;
+            offset: number;
+        }[];
+        accessGlobalVariable(name: string, offset?: number | undefined): void;
+        hasLocalVariable: (name: string) => boolean;
+        addLocalVariable: (name: string) => void;
+        removeLocalVariable: (name: string) => void;
+        getInternalVariable: () => string;
+        ignoreError: () => Generator<Code, any, unknown>;
+        expectError: (prevNode: CompilerDOM.CommentNode) => Generator<Code, any, unknown>;
+        resetDirectiveComments: (endStr: string) => Generator<Code, any, unknown>;
+        generateAutoImportCompletion: () => Generator<Code, any, unknown>;
+    };
+    hasSlot: boolean;
+}, unknown>;
+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

@@ -0,0 +1,130 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isFragment = exports.forEachElementNode = exports.generateTemplate = void 0;
+const CompilerDOM = require("@vue/compiler-dom");
+const common_1 = require("../common");
+const context_1 = require("./context");
+const element_1 = require("./element");
+const objectProperty_1 = require("./objectProperty");
+const stringLiteralKey_1 = require("./stringLiteralKey");
+const templateChild_1 = require("./templateChild");
+function* generateTemplate(options) {
+    const ctx = (0, context_1.createTemplateCodegenContext)();
+    let hasSlot = false;
+    if (options.slotsAssignName) {
+        ctx.addLocalVariable(options.slotsAssignName);
+    }
+    if (options.propsAssignName) {
+        ctx.addLocalVariable(options.propsAssignName);
+    }
+    yield* generatePreResolveComponents();
+    if (options.template.ast) {
+        yield* (0, templateChild_1.generateTemplateChild)(options, ctx, options.template.ast, undefined, undefined, undefined);
+    }
+    yield* generateStyleScopedClasses();
+    if (!options.hasDefineSlots) {
+        yield `var __VLS_slots!:`;
+        yield* generateSlotsType();
+        yield common_1.endOfLine;
+    }
+    yield* ctx.generateAutoImportCompletion();
+    return {
+        ctx,
+        hasSlot,
+    };
+    function* generateSlotsType() {
+        for (const { expVar, varName } of ctx.dynamicSlots) {
+            hasSlot = true;
+            yield `Partial<Record<NonNullable<typeof ${expVar}>, (_: typeof ${varName}) => any>> &${common_1.newLine}`;
+        }
+        yield `{${common_1.newLine}`;
+        for (const slot of ctx.slots) {
+            hasSlot = true;
+            if (slot.name && slot.loc !== undefined) {
+                yield* (0, objectProperty_1.generateObjectProperty)(options, ctx, slot.name, slot.loc, {
+                    ...ctx.codeFeatures.withoutHighlightAndCompletion,
+                    __referencesCodeLens: true,
+                }, slot.nodeLoc);
+            }
+            else {
+                yield* (0, common_1.wrapWith)(slot.tagRange[0], slot.tagRange[1], {
+                    ...ctx.codeFeatures.withoutHighlightAndCompletion,
+                    __referencesCodeLens: true,
+                }, `default`);
+            }
+            yield `?(_: typeof ${slot.varName}): any,${common_1.newLine}`;
+        }
+        yield `}`;
+    }
+    function* generateStyleScopedClasses() {
+        yield `if (typeof __VLS_styleScopedClasses === 'object' && !Array.isArray(__VLS_styleScopedClasses)) {${common_1.newLine}`;
+        for (const { className, offset } of ctx.scopedClasses) {
+            yield `__VLS_styleScopedClasses[`;
+            yield* (0, stringLiteralKey_1.generateStringLiteralKey)(className, offset, {
+                ...ctx.codeFeatures.navigationAndCompletion,
+                __displayWithLink: options.stylesScopedClasses.has(className),
+            });
+            yield `]${common_1.endOfLine}`;
+        }
+        yield `}${common_1.newLine}`;
+    }
+    function* generatePreResolveComponents() {
+        yield `let __VLS_resolvedLocalAndGlobalComponents!: {}`;
+        if (options.template.ast) {
+            for (const node of forEachElementNode(options.template.ast)) {
+                if (node.tagType === CompilerDOM.ElementTypes.COMPONENT
+                    && node.tag.toLowerCase() !== 'component'
+                    && !node.tag.includes('.') // namespace tag 
+                ) {
+                    yield ` & __VLS_WithComponent<'${(0, element_1.getCanonicalComponentName)(node.tag)}', typeof __VLS_localComponents, `;
+                    yield (0, element_1.getPossibleOriginalComponentNames)(node.tag, false)
+                        .map(name => `"${name}"`)
+                        .join(', ');
+                    yield `>`;
+                }
+            }
+        }
+        yield common_1.endOfLine;
+    }
+}
+exports.generateTemplate = generateTemplate;
+function* forEachElementNode(node) {
+    if (node.type === CompilerDOM.NodeTypes.ROOT) {
+        for (const child of node.children) {
+            yield* forEachElementNode(child);
+        }
+    }
+    else if (node.type === CompilerDOM.NodeTypes.ELEMENT) {
+        const patchForNode = (0, templateChild_1.getVForNode)(node);
+        if (patchForNode) {
+            yield* forEachElementNode(patchForNode);
+        }
+        else {
+            yield node;
+            for (const child of node.children) {
+                yield* forEachElementNode(child);
+            }
+        }
+    }
+    else if (node.type === CompilerDOM.NodeTypes.IF) {
+        // v-if / v-else-if / v-else
+        for (let i = 0; i < node.branches.length; i++) {
+            const branch = node.branches[i];
+            for (const childNode of branch.children) {
+                yield* forEachElementNode(childNode);
+            }
+        }
+    }
+    else if (node.type === CompilerDOM.NodeTypes.FOR) {
+        // v-for
+        for (const child of node.children) {
+            yield* forEachElementNode(child);
+        }
+    }
+}
+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/interpolation.d.ts

@@ -0,0 +1,6 @@
+import type * as ts from 'typescript';
+import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types';
+import type { TemplateCodegenContext } from './context';
+import type { TemplateCodegenOptions } from './index';
+export declare function generateInterpolation(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, _code: string, astHolder: any, start: number | undefined, data: VueCodeInformation | (() => VueCodeInformation) | undefined, prefix: string, suffix: string): Generator<Code>;
+export declare function forEachInterpolationSegment(ts: typeof import('typescript'), vueOptions: VueCompilerOptions, ctx: TemplateCodegenContext, code: string, offset: number | undefined, ast: ts.SourceFile): Generator<[fragment: string, offset: number | undefined, isJustForErrorMapping?: boolean]>;

package/lib/{utils/transform.js → codegen/template/interpolation.js}

@@ -1,12 +1,58 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.collectVars = exports.eachInterpolationSegment = void 0;
+exports.forEachInterpolationSegment = exports.generateInterpolation = void 0;
 const shared_1 = require("@vue/shared");
-const scriptSetupRanges_1 = require("../parsers/scriptSetupRanges");
-function* eachInterpolationSegment(ts, code, ast, localVars, identifiers, vueOptions, ctxVars = []) {
+const scriptSetupRanges_1 = require("../../parsers/scriptSetupRanges");
+const common_1 = require("../common");
+function* generateInterpolation(options, ctx, _code, astHolder, start, data, prefix, suffix) {
+    const code = prefix + _code + suffix;
+    const ast = (0, common_1.createTsAst)(options.ts, astHolder, code);
+    const vars = [];
+    for (let [section, offset, onlyError] of forEachInterpolationSegment(options.ts, options.vueCompilerOptions, ctx, code, start !== undefined ? start - prefix.length : undefined, ast)) {
+        if (offset === undefined) {
+            yield section;
+        }
+        else {
+            offset -= prefix.length;
+            let addSuffix = '';
+            const overLength = offset + section.length - _code.length;
+            if (overLength > 0) {
+                addSuffix = section.substring(section.length - overLength);
+                section = section.substring(0, section.length - overLength);
+            }
+            if (offset < 0) {
+                yield section.substring(0, -offset);
+                section = section.substring(-offset);
+                offset = 0;
+            }
+            if (start !== undefined && data !== undefined) {
+                yield [
+                    section,
+                    'template',
+                    start + offset,
+                    onlyError
+                        ? ctx.codeFeatures.verification
+                        : typeof data === 'function' ? data() : data,
+                ];
+            }
+            else {
+                yield section;
+            }
+            yield addSuffix;
+        }
+    }
+    if (start !== undefined) {
+        for (const v of vars) {
+            v.offset = start + v.offset - prefix.length;
+        }
+    }
+}
+exports.generateInterpolation = generateInterpolation;
+function* forEachInterpolationSegment(ts, vueOptions, ctx, code, offset, ast) {
+    let ctxVars = [];
     const varCb = (id, isShorthand) => {
         const text = (0, scriptSetupRanges_1.getNodeText)(ts, id, ast);
-        if (localVars.get(text) ||
+        if (ctx.hasLocalVariable(text) ||
             // https://github.com/vuejs/core/blob/245230e135152900189f13a4281302de45fdcfaa/packages/compiler-core/src/transforms/transformExpression.ts#L342-L352
             (0, shared_1.isGloballyWhitelisted)(text) ||
             text === 'require' ||
@@ -19,10 +65,15 @@ function* eachInterpolationSegment(ts, code, ast, localVars, identifiers, vueOpt
                 isShorthand: isShorthand,
                 offset: (0, scriptSetupRanges_1.getStartEnd)(ts, id, ast).start,
             });
-            identifiers.add(text);
+            if (offset !== undefined) {
+                ctx.accessGlobalVariable(text, offset + (0, scriptSetupRanges_1.getStartEnd)(ts, id, ast).start);
+            }
+            else {
+                ctx.accessGlobalVariable(text);
+            }
         }
     };
-    ts.forEachChild(ast, node => walkIdentifiers(ts, node, ast, varCb, localVars));
+    ts.forEachChild(ast, node => walkIdentifiers(ts, node, ast, varCb, ctx));
     ctxVars = ctxVars.sort((a, b) => a.offset - b.offset);
     if (ctxVars.length) {
         if (ctxVars[0].isShorthand) {
@@ -87,8 +138,8 @@ function* eachInterpolationSegment(ts, code, ast, localVars, identifiers, vueOpt
         yield [code, 0];
     }
 }
-exports.eachInterpolationSegment = eachInterpolationSegment;
-function walkIdentifiers(ts, node, ast, cb, localVars, blockVars = [], isRoot = true) {
+exports.forEachInterpolationSegment = forEachInterpolationSegment;
+function walkIdentifiers(ts, node, ast, cb, ctx, blockVars = [], isRoot = true) {
     if (ts.isIdentifier(node)) {
         cb(node, false);
     }
@@ -96,31 +147,31 @@ function walkIdentifiers(ts, node, ast, cb, localVars, blockVars = [], isRoot =
         cb(node.name, true);
     }
     else if (ts.isPropertyAccessExpression(node)) {
-        walkIdentifiers(ts, node.expression, ast, cb, localVars, blockVars, false);
+        walkIdentifiers(ts, node.expression, ast, cb, ctx, blockVars, false);
     }
     else if (ts.isVariableDeclaration(node)) {
-        collectVars(ts, node.name, ast, blockVars);
+        (0, common_1.collectVars)(ts, node.name, ast, blockVars);
         for (const varName of blockVars) {
-            localVars.set(varName, (localVars.get(varName) ?? 0) + 1);
+            ctx.addLocalVariable(varName);
         }
         if (node.initializer) {
-            walkIdentifiers(ts, node.initializer, ast, cb, localVars, blockVars, false);
+            walkIdentifiers(ts, node.initializer, ast, cb, ctx, blockVars, false);
         }
     }
     else if (ts.isArrowFunction(node) || ts.isFunctionExpression(node)) {
         const functionArgs = [];
         for (const param of node.parameters) {
-            collectVars(ts, param.name, ast, functionArgs);
+            (0, common_1.collectVars)(ts, param.name, ast, functionArgs);
             if (param.type) {
-                walkIdentifiers(ts, param.type, ast, cb, localVars, blockVars, false);
+                walkIdentifiers(ts, param.type, ast, cb, ctx, blockVars, false);
             }
         }
         for (const varName of functionArgs) {
-            localVars.set(varName, (localVars.get(varName) ?? 0) + 1);
+            ctx.addLocalVariable(varName);
         }
-        walkIdentifiers(ts, node.body, ast, cb, localVars, blockVars, false);
+        walkIdentifiers(ts, node.body, ast, cb, ctx, blockVars, false);
         for (const varName of functionArgs) {
-            localVars.set(varName, localVars.get(varName) - 1);
+            ctx.removeLocalVariable(varName);
         }
     }
     else if (ts.isObjectLiteralExpression(node)) {
@@ -128,18 +179,18 @@ function walkIdentifiers(ts, node, ast, cb, localVars, blockVars = [], isRoot =
             if (ts.isPropertyAssignment(prop)) {
                 // fix https://github.com/vuejs/language-tools/issues/1176
                 if (ts.isComputedPropertyName(prop.name)) {
-                    walkIdentifiers(ts, prop.name.expression, ast, cb, localVars, blockVars, false);
+                    walkIdentifiers(ts, prop.name.expression, ast, cb, ctx, blockVars, false);
                 }
-                walkIdentifiers(ts, prop.initializer, ast, cb, localVars, blockVars, false);
+                walkIdentifiers(ts, prop.initializer, ast, cb, ctx, blockVars, false);
             }
             // fix https://github.com/vuejs/language-tools/issues/1156
             else if (ts.isShorthandPropertyAssignment(prop)) {
-                walkIdentifiers(ts, prop, ast, cb, localVars, blockVars, false);
+                walkIdentifiers(ts, prop, ast, cb, ctx, blockVars, false);
             }
             // fix https://github.com/vuejs/language-tools/issues/1148#issuecomment-1094378126
             else if (ts.isSpreadAssignment(prop)) {
                 // TODO: cannot report "Spread types may only be created from object types.ts(2698)"
-                walkIdentifiers(ts, prop.expression, ast, cb, localVars, blockVars, false);
+                walkIdentifiers(ts, prop.expression, ast, cb, ctx, blockVars, false);
             }
         }
     }
@@ -152,17 +203,17 @@ function walkIdentifiers(ts, node, ast, cb, localVars, blockVars = [], isRoot =
         if (ts.isBlock(node)) {
             blockVars = [];
         }
-        ts.forEachChild(node, node => walkIdentifiers(ts, node, ast, cb, localVars, blockVars, false));
+        ts.forEachChild(node, node => walkIdentifiers(ts, node, ast, cb, ctx, blockVars, false));
         if (ts.isBlock(node)) {
             for (const varName of blockVars) {
-                localVars.set(varName, localVars.get(varName) - 1);
+                ctx.removeLocalVariable(varName);
             }
         }
         blockVars = _blockVars;
     }
     if (isRoot) {
         for (const varName of blockVars) {
-            localVars.set(varName, localVars.get(varName) - 1);
+            ctx.removeLocalVariable(varName);
         }
     }
 }
@@ -174,25 +225,4 @@ function walkIdentifiersInTypeReference(ts, node, cb) {
         ts.forEachChild(node, node => walkIdentifiersInTypeReference(ts, node, cb));
     }
 }
-function collectVars(ts, node, ast, result) {
-    if (ts.isIdentifier(node)) {
-        result.push((0, scriptSetupRanges_1.getNodeText)(ts, node, ast));
-    }
-    else if (ts.isObjectBindingPattern(node)) {
-        for (const el of node.elements) {
-            collectVars(ts, el.name, ast, result);
-        }
-    }
-    else if (ts.isArrayBindingPattern(node)) {
-        for (const el of node.elements) {
-            if (ts.isBindingElement(el)) {
-                collectVars(ts, el.name, ast, result);
-            }
-        }
-    }
-    else {
-        ts.forEachChild(node, node => collectVars(ts, node, ast, result));
-    }
-}
-exports.collectVars = collectVars;
-//# sourceMappingURL=transform.js.map
+//# sourceMappingURL=interpolation.js.map