refactor(language-core): overload wrapWith to use in more sources

Author: KazariEX

packages/language-core/lib/codegen/script/scriptSetup.ts

@@ -2,8 +2,9 @@ import { camelize } from '@vue/shared';
 import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges';
 import type { Code, Sfc, TextRange } from '../../types';
 import { codeFeatures } from '../codeFeatures';
-import { combineLastMapping, endOfLine, generateSfcBlockSection, newLine } from '../utils';
+import { endOfLine, generateSfcBlockSection, newLine } from '../utils';
 import { generateCamelized } from '../utils/camelized';
+import { wrapWith } from '../utils/wrapWith';
 import { generateComponent, generateEmitsOption } from './component';
 import { generateComponentSelf } from './componentSelf';
 import type { ScriptCodegenContext } from './context';
@@ -215,9 +216,13 @@ function* generateSetupFunction(
 				`])`
 			] : [
 				` as __VLS_StyleModules[`,
-				['', scriptSetup.name, exp.start, codeFeatures.verification],
-				`'$style'`,
-				['', scriptSetup.name, exp.end, combineLastMapping],
+				...wrapWith(
+					exp.start,
+					exp.end,
+					scriptSetup.name,
+					codeFeatures.verification,
+					`'$style'`
+				),
 				`])`
 			],
 			callExp.end,

packages/language-core/lib/codegen/style/classProperty.ts

@@ -1,6 +1,7 @@
 import type { Code } from '../../types';
 import { codeFeatures } from '../codeFeatures';
-import { newLine } from '../utils';
+import { combineLastMapping, newLine } from '../utils';
+import { wrapWith } from '../utils/wrapWith';
 
 export function* generateClassProperty(
 	styleIndex: number,
@@ -9,26 +10,20 @@ export function* generateClassProperty(
 	propertyType: string
 ): Generator<Code> {
 	yield `${newLine} & { `;
-	yield [
-		'',
-		'style_' + styleIndex,
+	yield* wrapWith(
 		offset,
-		codeFeatures.navigation,
-	];
-	yield `'`;
-	yield [
-		classNameWithDot.slice(1),
-		'style_' + styleIndex,
-		offset + 1,
-		codeFeatures.navigation,
-	];
-	yield `'`;
-	yield [
-		'',
-		'style_' + styleIndex,
 		offset + classNameWithDot.length,
+		'style_' + styleIndex,
 		codeFeatures.navigation,
-	];
+		`'`,
+		[
+			classNameWithDot.slice(1),
+			'style_' + styleIndex,
+			offset + 1,
+			combineLastMapping
+		],
+		`'`
+	);
 	yield `: ${propertyType}`;
 	yield ` }`;
 }

packages/language-core/lib/codegen/template/context.ts

@@ -2,7 +2,8 @@ import type * as CompilerDOM from '@vue/compiler-dom';
 import type { Code, VueCodeInformation } from '../../types';
 import { codeFeatures } from '../codeFeatures';
 import { InlayHintInfo } from '../inlayHints';
-import { endOfLine, newLine, wrapWith } from '../utils';
+import { endOfLine, newLine } from '../utils';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenOptions } from './index';
 
 export type TemplateCodegenContext = ReturnType<typeof createTemplateCodegenContext>;

packages/language-core/lib/codegen/template/element.ts

@@ -3,8 +3,9 @@ import { camelize, capitalize } from '@vue/shared';
 import type { Code, VueCodeInformation } from '../../types';
 import { getSlotsPropertyName, hyphenateTag } from '../../utils/shared';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
-import { endOfLine, identifierRegex, newLine, normalizeAttributeValue, wrapWith } from '../utils';
+import { endOfLine, identifierRegex, newLine, normalizeAttributeValue } from '../utils';
 import { generateCamelized } from '../utils/camelized';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import { generateElementChildren } from './elementChildren';
 import { generateElementDirectives } from './elementDirectives';

packages/language-core/lib/codegen/template/elementDirectives.ts

@@ -3,9 +3,10 @@ import { camelize } from '@vue/shared';
 import type { Code } from '../../types';
 import { hyphenateAttr } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
-import { endOfLine, wrapWith } from '../utils';
+import { endOfLine } from '../utils';
 import { generateCamelized } from '../utils/camelized';
 import { generateStringLiteralKey } from '../utils/stringLiteralKey';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import { generatePropExp } from './elementProps';
 import type { TemplateCodegenOptions } from './index';

packages/language-core/lib/codegen/template/elementEvents.ts

@@ -2,8 +2,9 @@ import * as CompilerDOM from '@vue/compiler-dom';
 import { camelize, capitalize } from '@vue/shared';
 import type * as ts from 'typescript';
 import type { Code } from '../../types';
-import { combineLastMapping, createTsAst, endOfLine, identifierRegex, newLine, wrapWith } from '../utils';
+import { combineLastMapping, createTsAst, endOfLine, identifierRegex, newLine } from '../utils';
 import { generateCamelized } from '../utils/camelized';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
 import { generateInterpolation } from './interpolation';
@@ -81,7 +82,6 @@ export function* generateEventArg(
 			start + name.length,
 			features,
 			`'`,
-			['', 'template', start, combineLastMapping],
 			directive,
 			...generateCamelized(
 				capitalize(name),

packages/language-core/lib/codegen/template/elementProps.ts

@@ -6,9 +6,10 @@ import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types';
 import { hyphenateAttr, hyphenateTag } from '../../utils/shared';
 import { codeFeatures } from '../codeFeatures';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
-import { identifierRegex, newLine, wrapWith } from '../utils';
+import { identifierRegex, newLine } from '../utils';
 import { generateCamelized } from '../utils/camelized';
 import { generateUnicode } from '../utils/unicode';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import { generateModifiers } from './elementDirectives';
 import { generateEventArg, generateEventExpression } from './elementEvents';

packages/language-core/lib/codegen/template/index.ts

@@ -2,7 +2,8 @@ import * as CompilerDOM from '@vue/compiler-dom';
 import type * as ts from 'typescript';
 import type { Code, Sfc, VueCompilerOptions } from '../../types';
 import { getSlotsPropertyName } from '../../utils/shared';
-import { endOfLine, newLine, wrapWith } from '../utils';
+import { endOfLine, newLine } from '../utils';
+import { wrapWith } from '../utils/wrapWith';
 import { TemplateCodegenContext, createTemplateCodegenContext } from './context';
 import { generateObjectProperty } from './objectProperty';
 import { generateStyleScopedClassReferences } from './styleScopedClasses';

packages/language-core/lib/codegen/template/objectProperty.ts

@@ -1,8 +1,9 @@
 import { camelize } from '@vue/shared';
 import type { Code, VueCodeInformation } from '../../types';
-import { combineLastMapping, identifierRegex, wrapWith } from '../utils';
+import { combineLastMapping, identifierRegex } from '../utils';
 import { generateCamelized } from '../utils/camelized';
 import { generateStringLiteralKey } from '../utils/stringLiteralKey';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
 import { generateInterpolation } from './interpolation';

packages/language-core/lib/codegen/template/slotOutlet.ts

@@ -1,7 +1,8 @@
 import * as CompilerDOM from '@vue/compiler-dom';
 import type { Code } from '../../types';
 import { createVBindShorthandInlayHintInfo } from '../inlayHints';
-import { endOfLine, newLine, wrapWith } from '../utils';
+import { endOfLine, newLine } from '../utils';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import { generateElementChildren } from './elementChildren';
 import { generateElementProps, generatePropExp } from './elementProps';

packages/language-core/lib/codegen/template/styleScopedClasses.ts

@@ -4,6 +4,7 @@ import { getNodeText } from '../../parsers/scriptSetupRanges';
 import type { Code } from '../../types';
 import { endOfLine, normalizeAttributeValue } from '../utils';
 import { generateEscaped } from '../utils/escaped';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
 
@@ -25,29 +26,21 @@ export function* generateStyleScopedClassReferences(
 	}
 	for (const { source, className, offset } of ctx.scopedClasses) {
 		yield `/** @type {__VLS_StyleScopedClasses[`;
-		yield [
-			'',
-			source,
+		yield* wrapWith(
 			offset - (withDot ? 1 : 0),
-			ctx.codeFeatures.navigation,
-		];
-		yield `'`;
-
-		// fix https://github.com/vuejs/language-tools/issues/4537
-		yield* generateEscaped(
-			className,
-			source,
-			offset,
-			ctx.codeFeatures.navigationAndAdditionalCompletion,
-			classNameEscapeRegex
-		);
-		yield `'`;
-		yield [
-			'',
-			source,
 			offset + className.length,
+			source,
 			ctx.codeFeatures.navigation,
-		];
+			`'`,
+			...generateEscaped(
+				className,
+				source,
+				offset,
+				ctx.codeFeatures.navigationAndAdditionalCompletion,
+				classNameEscapeRegex
+			),
+			`'`
+		)
 		yield `]} */${endOfLine}`;
 	}
 }

packages/language-core/lib/codegen/template/vSlot.ts

@@ -1,6 +1,7 @@
 import * as CompilerDOM from '@vue/compiler-dom';
 import type { Code } from '../../types';
-import { collectVars, createTsAst, endOfLine, newLine, wrapWith } from '../utils';
+import { collectVars, createTsAst, endOfLine, newLine } from '../utils';
+import { wrapWith } from '../utils/wrapWith';
 import type { TemplateCodegenContext } from './context';
 import type { TemplateCodegenOptions } from './index';
 import { generateObjectProperty } from './objectProperty';

packages/language-core/lib/codegen/utils/camelized.ts

@@ -5,9 +5,11 @@ export function* generateCamelized(
 	code: string,
 	source: string,
 	offset: number,
-	info: VueCodeInformation
+	features: VueCodeInformation
 ): Generator<Code> {
 	const parts = code.split('-');
+	const startCombineOffset = features.__combineOffset ?? 0;
+
 	for (let i = 0; i < parts.length; i++) {
 		const part = parts[i];
 		if (part !== '') {
@@ -16,15 +18,15 @@ export function* generateCamelized(
 					part,
 					source,
 					offset,
-					info,
+					features,
 				];
 			}
 			else {
 				yield [
 					capitalize(part),
 					source,
 					offset,
-					{ __combineOffset: i },
+					{ __combineOffset: startCombineOffset + i },
 				];
 			}
 		}

packages/language-core/lib/codegen/utils/escaped.ts

@@ -8,6 +8,7 @@ export function* generateEscaped(
 	escapeTarget: RegExp
 ): Generator<Code> {
 	const parts = text.split(escapeTarget);
+	const startCombineOffset = features.__combineOffset ?? 0;
 	let isEscapeTarget = false;
 
 	for (let i = 0; i < parts.length; i++) {
@@ -19,7 +20,7 @@ export function* generateEscaped(
 			part,
 			source,
 			offset,
-			i === 0 ? features : { __combineOffset: i },
+			i === 0 ? features : { __combineOffset: startCombineOffset + i },
 		];
 		offset += part.length;
 		isEscapeTarget = !isEscapeTarget;

packages/language-core/lib/codegen/utils/index.ts

@@ -8,23 +8,6 @@ export const endOfLine = `;${newLine}`;
 export const combineLastMapping: VueCodeInformation = { __combineOffset: 1 };
 export const identifierRegex = /^[a-zA-Z_$][0-9a-zA-Z_$]*$/;
 
-export function* wrapWith(
-	startOffset: number,
-	endOffset: number,
-	features: VueCodeInformation,
-	...wrapCodes: Code[]
-): Generator<Code> {
-	yield ['', 'template', startOffset, features];
-	let offset = 1;
-	for (const wrapCode of wrapCodes) {
-		if (typeof wrapCode !== 'string') {
-			offset++;
-		}
-		yield wrapCode;
-	}
-	yield ['', 'template', endOffset, { __combineOffset: offset }];
-}
-
 export function collectVars(
 	ts: typeof import('typescript'),
 	node: ts.Node,

packages/language-core/lib/codegen/utils/stringLiteralKey.ts

@@ -1,5 +1,6 @@
 import type { Code, VueCodeInformation } from '../../types';
-import { combineLastMapping, wrapWith } from './index';
+import { combineLastMapping } from './index';
+import { wrapWith } from './wrapWith';
 
 export function* generateStringLiteralKey(code: string, offset?: number, info?: VueCodeInformation): Generator<Code> {
 	if (offset === undefined || !info) {

packages/language-core/lib/codegen/utils/unicode.ts

@@ -1,5 +1,5 @@
 import type { Code, VueCodeInformation } from '../../types';
-import { wrapWith } from './index';
+import { wrapWith } from './wrapWith';
 
 export function* generateUnicode(code: string, offset: number, info: VueCodeInformation): Generator<Code> {
 	if (needToUnicode(code)) {

packages/language-core/lib/codegen/utils/wrapWith.ts

@@ -0,0 +1,42 @@
+import type { Code, VueCodeInformation } from "../../types";
+
+export function wrapWith(
+	startOffset: number,
+	endOffset: number,
+	features: VueCodeInformation,
+	...codes: Code[]
+): Generator<Code>;
+
+export function wrapWith(
+	startOffset: number,
+	endOffset: number,
+	source: string,
+	features: VueCodeInformation,
+	...codes: Code[]
+): Generator<Code>;
+
+export function* wrapWith(
+	startOffset: number,
+	endOffset: number,
+	...args: any[]
+): Generator<Code> {
+	let source = 'template';
+	let features: VueCodeInformation;
+	let codes: Code[];
+	if (typeof args[0] === 'string') {
+		[source, features, ...codes] = args;
+	}
+	else {
+		[features, ...codes] = args;
+	}
+
+	yield ['', source, startOffset, features];
+	let offset = 1;
+	for (const code of codes) {
+		if (typeof code !== 'string') {
+			offset++;
+		}
+		yield code;
+	}
+	yield ['', source, endOffset, { __combineOffset: offset }];
+}