Merge branch 'v1'

CHANGELOG.md

@@ -1,13 +1,12 @@
 # Changelog
 
-## 1.6.2 (2023/5/1)
+## 1.6.3 (2023/5/2)
 
-- fix: consume required props for events ([#2468](https://github.com/johnsoncodehk/volar/issues/2468))
-- fix: support infer v-for types for generic ([#2758](https://github.com/johnsoncodehk/volar/issues/2758))
-- fix: slot missing props don't report error
-- fix: cannot assign generic component to components option of defineComponent
-- fix: "TS1002: Unterminated string literal" in slots edge case ([#2710](https://github.com/johnsoncodehk/volar/issues/2710))
-- fix: generic component prop with default type incorrect ([#2754](https://github.com/johnsoncodehk/volar/issues/2754))
+- feat: expose custom blocks attrs ([#3099](https://github.com/johnsoncodehk/volar/issues/3099))
+- fix: event "@update:" syntax causes TS error ([#3100](https://github.com/johnsoncodehk/volar/issues/3100))
+- fix: generic attr unexpectedly trimmed when formatting if attr value includes "<" ([#3101](https://github.com/johnsoncodehk/volar/issues/3101))
+- fix: required event props always shows in missing props hint
+- fix: exclude null / undefined from `v-for` source type ([#3102](https://github.com/johnsoncodehk/volar/issues/3102))
 
 ---
 
@@ -45,6 +44,15 @@
 	</h5>
 </p>
 
+## 1.6.2 (2023/5/1)
+
+- fix: consume required props for events ([#2468](https://github.com/johnsoncodehk/volar/issues/2468))
+- fix: support infer v-for types for generic ([#2758](https://github.com/johnsoncodehk/volar/issues/2758))
+- fix: slot missing props don't report error
+- fix: cannot assign generic component to components option of defineComponent
+- fix: "TS1002: Unterminated string literal" in slots edge case ([#2710](https://github.com/johnsoncodehk/volar/issues/2710))
+- fix: generic component prop with default type incorrect ([#2754](https://github.com/johnsoncodehk/volar/issues/2754))
+
 ## 1.6.1 (2023/4/28)
 
 - feat: support for specify vue library name by `vueCompilerOptions.lib` option ([#2722](https://github.com/johnsoncodehk/volar/issues/2722))

lerna.json

@@ -4,5 +4,5 @@
 	"packages": [
 		"packages/*"
 	],
-	"version": "1.6.2"
+	"version": "1.6.3"
 }

packages/typescript-vue-plugin/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "typescript-vue-plugin",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [
@@ -13,7 +13,7 @@
 		"directory": "packages/typescript-vue-plugin"
 	},
 	"dependencies": {
-		"@volar/vue-language-core": "1.6.2",
-		"@volar/vue-typescript": "1.6.2"
+		"@volar/vue-language-core": "1.6.3",
+		"@volar/vue-typescript": "1.6.3"
 	}
 }

packages/vscode-typescript-vue-plugin/package.json

@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "vscode-typescript-vue-plugin",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/vuejs/language-tools.git",
@@ -41,7 +41,7 @@
 	},
 	"devDependencies": {
 		"esbuild": "0.15.18",
-		"typescript-vue-plugin": "1.6.2",
+		"typescript-vue-plugin": "1.6.3",
 		"vsce": "latest"
 	}
 }

packages/vscode-vue/package.json

@@ -1,7 +1,7 @@
 {
 	"private": true,
 	"name": "volar",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/vuejs/language-tools.git",
@@ -743,8 +743,8 @@
 		"@types/vscode": "1.67.0",
 		"@volar/source-map": "1.5.0",
 		"@volar/vscode": "1.5.0",
-		"@volar/vue-language-core": "1.6.2",
-		"@volar/vue-language-server": "1.6.2",
+		"@volar/vue-language-core": "1.6.3",
+		"@volar/vue-language-server": "1.6.3",
 		"esbuild": "0.15.18",
 		"esbuild-plugin-copy": "latest",
 		"esbuild-visualizer": "latest",

packages/vue-component-meta/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vue-component-meta",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [
@@ -14,9 +14,9 @@
 	},
 	"dependencies": {
 		"@volar/language-core": "1.5.0",
-		"@volar/vue-language-core": "1.6.2",
+		"@volar/vue-language-core": "1.6.3",
 		"typesafe-path": "^0.2.2",
-		"vue-component-type-helpers": "1.6.2"
+		"vue-component-type-helpers": "1.6.3"
 	},
 	"peerDependencies": {
 		"typescript": "*"

packages/vue-component-type-helpers/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vue-component-type-helpers",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"license": "MIT",
 	"files": [
 		"*.js",

packages/vue-language-core/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@volar/vue-language-core",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [

packages/vue-language-core/src/generators/script.ts

@@ -51,6 +51,7 @@ export function generate(
 			endTagStart: 0,
 			generic: undefined,
 			genericOffset: 0,
+			attrs: {},
 		};
 		scriptSetupRanges = {
 			bindings: [],

packages/vue-language-core/src/generators/template.ts

@@ -464,6 +464,7 @@ export function generate(
 		codes.push(`] of (await import('${sharedTypesImport}')).getVForSourceType`);
 		if (source.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
 			codes.push(
+				'(',
 				...createInterpolationCode(
 					source.content,
 					source.loc,
@@ -472,6 +473,7 @@ export function generate(
 					'(',
 					')',
 				),
+				'!)', // #3102
 				') {\n',
 			);
 
@@ -989,7 +991,7 @@ export function generate(
 				&& prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
 			) {
 				codes.push(
-					camelize('on-' + prop.arg.loc.source),
+					...createObjectPropertyCode(camelize('on-' + prop.arg.loc.source)),
 					': {} as any, ',
 				);
 			}
@@ -1679,12 +1681,12 @@ export function generate(
 		];
 	}
 
-	function createObjectPropertyCode(a: Code, astHolder: any): Code[] {
+	function createObjectPropertyCode(a: Code, astHolder?: any): Code[] {
 		const aStr = typeof a === 'string' ? a : a[0];
 		if (validTsVar.test(aStr)) {
 			return [a];
 		}
-		else if (aStr.startsWith('[') && aStr.endsWith(']')) {
+		else if (aStr.startsWith('[') && aStr.endsWith(']') && astHolder) {
 			const range = typeof a === 'object' ? a[2] : undefined;
 			const data = typeof a === 'object' ? a[3] : undefined;
 			return createInterpolationCode(

packages/vue-language-core/src/sourceFile.ts

@@ -468,12 +468,13 @@ export class VueFile implements VirtualFile {
 
 		const newData: Sfc['template'] | null = block ? {
 			name: 'template',
-			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<'),
+			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<' + block.type),
 			end: block.loc.end.offset + this.snapshot.getText(block.loc.end.offset, this.snapshot.getLength()).indexOf('>') + 1,
 			startTagEnd: block.loc.start.offset,
 			endTagStart: block.loc.end.offset,
 			content: block.content,
 			lang: block.lang ?? 'html',
+			attrs: block.attrs,
 		} : null;
 
 		if (this.sfc.template && newData) {
@@ -488,14 +489,15 @@ export class VueFile implements VirtualFile {
 
 		const newData: Sfc['script'] | null = block ? {
 			name: 'script',
-			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<'),
+			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<' + block.type),
 			end: block.loc.end.offset + this.snapshot.getText(block.loc.end.offset, this.snapshot.getLength()).indexOf('>') + 1,
 			startTagEnd: block.loc.start.offset,
 			endTagStart: block.loc.end.offset,
 			content: block.content,
 			lang: block.lang ?? 'js',
 			src: block.src,
 			srcOffset: block.src ? this.snapshot.getText(0, block.loc.start.offset).lastIndexOf(block.src) - block.loc.start.offset : -1,
+			attrs: block.attrs,
 		} : null;
 
 		if (this.sfc.script && newData) {
@@ -510,14 +512,15 @@ export class VueFile implements VirtualFile {
 
 		const newData: Sfc['scriptSetup'] | null = block ? {
 			name: 'scriptSetup',
-			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<'),
+			start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<' + block.type),
 			end: block.loc.end.offset + this.snapshot.getText(block.loc.end.offset, this.snapshot.getLength()).indexOf('>') + 1,
 			startTagEnd: block.loc.start.offset,
 			endTagStart: block.loc.end.offset,
 			content: block.content,
 			lang: block.lang ?? 'js',
 			generic: typeof block.attrs.generic === 'string' ? block.attrs.generic : undefined,
 			genericOffset: typeof block.attrs.generic === 'string' ? this.snapshot.getText(0, block.loc.start.offset).lastIndexOf(block.attrs.generic) - block.loc.start.offset : -1,
+			attrs: block.attrs,
 		} : null;
 
 		if (this.sfc.scriptSetup && newData) {
@@ -534,14 +537,15 @@ export class VueFile implements VirtualFile {
 			const block = blocks[i];
 			const newData: Sfc['styles'][number] = {
 				name: 'style_' + i,
-				start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<'),
+				start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<' + block.type),
 				end: block.loc.end.offset + this.snapshot.getText(block.loc.end.offset, this.snapshot.getLength()).indexOf('>') + 1,
 				startTagEnd: block.loc.start.offset,
 				endTagStart: block.loc.end.offset,
 				content: block.content,
 				lang: block.lang ?? 'css',
 				module: typeof block.module === 'string' ? block.module : block.module ? '$style' : undefined,
 				scoped: !!block.scoped,
+				attrs: block.attrs,
 			};
 
 			if (this.sfc.styles.length > i) {
@@ -562,13 +566,14 @@ export class VueFile implements VirtualFile {
 			const block = blocks[i];
 			const newData: Sfc['customBlocks'][number] = {
 				name: 'customBlock_' + i,
-				start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<'),
+				start: this.snapshot.getText(0, block.loc.start.offset).lastIndexOf('<' + block.type),
 				end: block.loc.end.offset + this.snapshot.getText(block.loc.end.offset, this.snapshot.getLength()).indexOf('>') + 1,
 				startTagEnd: block.loc.start.offset,
 				endTagStart: block.loc.end.offset,
 				content: block.content,
 				lang: block.lang ?? 'txt',
 				type: block.type,
+				attrs: block.attrs,
 			};
 
 			if (this.sfc.customBlocks.length > i) {
@@ -583,9 +588,19 @@ export class VueFile implements VirtualFile {
 		}
 	}
 
-	updateBlock<T>(oldBlock: T, newBlock: T) {
-		for (let key in newBlock) {
-			oldBlock[key] = newBlock[key];
+	updateBlock<T extends object>(oldBlock: T, newBlock: T) {
+		for (const key in newBlock) {
+			if (typeof oldBlock[key] === 'object' && typeof newBlock[key] === 'object') {
+				this.updateBlock(oldBlock[key] as object, newBlock[key] as object);
+			}
+			else {
+				oldBlock[key] = newBlock[key];
+			}
+		}
+		for (const key in oldBlock) {
+			if (!(key in newBlock)) {
+				delete oldBlock[key];
+			}
 		}
 	}
 }

packages/vue-language-core/src/types.ts

@@ -72,6 +72,7 @@ export interface SfcBlock {
 	endTagStart: number;
 	lang: string;
 	content: string;
+	attrs: Record<string, string | true>;
 }
 
 export interface Sfc {

packages/vue-language-plugin-pug/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@volar/vue-language-plugin-pug",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [
@@ -13,7 +13,7 @@
 		"directory": "packages/vue-language-plugin-pug"
 	},
 	"devDependencies": {
-		"@volar/vue-language-core": "1.6.2"
+		"@volar/vue-language-core": "1.6.3"
 	},
 	"dependencies": {
 		"@volar/language-service": "1.5.0",

packages/vue-language-server/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@volar/vue-language-server",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [
@@ -18,9 +18,9 @@
 	"dependencies": {
 		"@volar/language-core": "1.5.0",
 		"@volar/language-server": "1.5.0",
-		"@volar/vue-language-core": "1.6.2",
-		"@volar/vue-language-service": "1.6.2",
+		"@volar/vue-language-core": "1.6.3",
+		"@volar/vue-language-service": "1.6.3",
 		"vscode-languageserver-protocol": "^3.17.3",
-		"vue-component-meta": "1.6.2"
+		"vue-component-meta": "1.6.3"
 	}
 }

packages/vue-language-service/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@volar/vue-language-service",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"main": "out/index.js",
 	"license": "MIT",
 	"files": [
@@ -20,7 +20,7 @@
 		"@volar/language-core": "1.5.0",
 		"@volar/language-service": "1.5.0",
 		"@volar/source-map": "1.5.0",
-		"@volar/vue-language-core": "1.6.2",
+		"@volar/vue-language-core": "1.6.3",
 		"@vue/compiler-dom": "^3.3.0-beta.3",
 		"@vue/reactivity": "^3.3.0-beta.3",
 		"@vue/shared": "^3.3.0-beta.3",

packages/vue-language-service/src/plugins/vue-template.ts

@@ -168,6 +168,9 @@ export default function useVueTemplateLanguagePlugin<T extends ReturnType<typeof
 										else if (attrText === 'v-model') {
 											attrText = options.vueCompilerOptions.target >= 3 ? 'modelValue' : 'value'; // TODO: support for experimentalModelPropName?
 										}
+										else if (attrText.startsWith('@')) {
+											attrText = 'on-' + hyphenate(attrText.substring('@'.length));
+										}
 
 										current.unburnedRequiredProps = current.unburnedRequiredProps.filter(propName => {
 											return attrText !== propName

packages/vue-test-workspace/format/#3101/input.vue

@@ -0,0 +1 @@
+<script lang="ts" setup generic="T extends Record<string, string>"></script>

packages/vue-test-workspace/format/#3101/output.vue

@@ -0,0 +1 @@
+<script lang="ts" setup generic="T extends Record<string, string>"></script>

packages/vue-test-workspace/package.json

@@ -1,10 +1,10 @@
 {
 	"private": true,
 	"name": "@volar/vue-test-workspace",
-	"version": "1.6.2",
+	"version": "1.6.3",
 	"license": "MIT",
 	"devDependencies": {
 		"vue": "^3.3.0-beta.3",
-		"vue-component-type-helpers": "1.6.2"
+		"vue-component-type-helpers": "1.6.3"
 	}
 }