From 3165a087543021230fffd8c1d018366bf2d01293 Mon Sep 17 00:00:00 2001
From: johnsoncodehk <johnsoncodehk@gmail.com>
Date: Mon, 26 Dec 2022 01:03:00 +0800
Subject: [PATCH] fix: v-slot error when `noPropertyAccessFromIndexSignature`
 is enabled

close #2236
---
 .../src/generators/template.ts                | 32 ++++++++++++++-----
 .../vue-language-core/src/plugins/vue-tsx.ts  |  1 +
 .../vue-test-workspace/vue-tsc/#2236/main.vue |  6 ++++
 .../vue-test-workspace/vue-tsc/tsconfig.json  |  3 ++
 4 files changed, 34 insertions(+), 8 deletions(-)
 create mode 100644 vue-language-tools/vue-test-workspace/vue-tsc/#2236/main.vue

diff --git a/vue-language-tools/vue-language-core/src/generators/template.ts b/vue-language-tools/vue-language-core/src/generators/template.ts
index c18f8becd..c3ccd2a28 100644
--- a/vue-language-tools/vue-language-core/src/generators/template.ts
+++ b/vue-language-tools/vue-language-core/src/generators/template.ts
@@ -47,6 +47,7 @@ const transformContext: CompilerDOM.TransformContext = {
 
 export function generate(
 	ts: typeof import('typescript/lib/tsserverlibrary'),
+	compilerOptions: ts.CompilerOptions,
 	vueCompilerOptions: ResolvedVueCompilerOptions,
 	sourceTemplate: string,
 	sourceLang: string,
@@ -1315,14 +1316,29 @@ export function generate(
 				]);
 				codeGen.push(varSlots);
 				if (isStatic) {
-					writePropertyAccess(
-						slotName,
-						argRange,
-						{
-							...capabilitiesSet.slotName,
-							completion: !!prop.arg,
-						},
-					);
+					// https://github.com/johnsoncodehk/volar/issues/2236
+					if (!compilerOptions.noPropertyAccessFromIndexSignature) {
+						writePropertyAccess(
+							slotName,
+							argRange,
+							{
+								...capabilitiesSet.slotName,
+								completion: !!prop.arg,
+							},
+						);
+					}
+					else {
+						codeGen.push(`[`);
+						writeCodeWithQuotes(
+							slotName,
+							argRange,
+							{
+								...capabilitiesSet.slotName,
+								completion: !!prop.arg,
+							},
+						);
+						codeGen.push(`]`);
+					}
 				}
 				else {
 					codeGen.push(`[`);
diff --git a/vue-language-tools/vue-language-core/src/plugins/vue-tsx.ts b/vue-language-tools/vue-language-core/src/plugins/vue-tsx.ts
index 32d4098eb..a96a2266b 100644
--- a/vue-language-tools/vue-language-core/src/plugins/vue-tsx.ts
+++ b/vue-language-tools/vue-language-core/src/plugins/vue-tsx.ts
@@ -147,6 +147,7 @@ const plugin: VueLanguagePlugin = ({ modules, vueCompilerOptions, compilerOption
 
 			return templateGen.generate(
 				ts,
+				compilerOptions,
 				vueCompilerOptions,
 				_sfc.template?.content ?? '',
 				_sfc.template?.lang ?? 'html',
diff --git a/vue-language-tools/vue-test-workspace/vue-tsc/#2236/main.vue b/vue-language-tools/vue-test-workspace/vue-tsc/#2236/main.vue
new file mode 100644
index 000000000..eb6d747d5
--- /dev/null
+++ b/vue-language-tools/vue-test-workspace/vue-tsc/#2236/main.vue
@@ -0,0 +1,6 @@
+<template>
+	<Comp>
+		<template #actions></template>
+		<template v-slot:actions></template>
+	</Comp>
+</template>
diff --git a/vue-language-tools/vue-test-workspace/vue-tsc/tsconfig.json b/vue-language-tools/vue-test-workspace/vue-tsc/tsconfig.json
index 6476d1c96..bdd4cf318 100644
--- a/vue-language-tools/vue-test-workspace/vue-tsc/tsconfig.json
+++ b/vue-language-tools/vue-test-workspace/vue-tsc/tsconfig.json
@@ -1,5 +1,8 @@
 {
 	"extends": "../tsconfig.json",
+	"compilerOptions": {
+		"noPropertyAccessFromIndexSignature": true,
+	},
 	"include": [
 		"**/*.vue",
 		"**/*.html",