feat: signature for tuple types! (disabled by default, but recommended)

Author: zardoy

src/configurationType.ts

@@ -224,6 +224,17 @@ export type Configuration = {
      * @default false
      */
     'jsxEmmet.dotOverride': string | false
+    /**
+     * Wether to provide signature help when destructuring tuples e.g.:
+     *
+     * ```ts
+     * declare const foo: [x: number, y: number]
+     * const [] = foo
+     * ```
+     * @recommended
+     * @default false
+     */
+    tupleHelpSignature: boolean
     /**
      * We already change sorting of suggestions, but enabling this option will also make:
      * - removing `id` from input suggestions

typescript/src/completionEntryDetails.ts

@@ -23,7 +23,7 @@ export default function completionEntryDetails(
             displayParts: typeof documentationOverride === 'string' ? [{ kind: 'text', text: documentationOverride }] : documentationOverride,
         }
     }
-    const prior = languageService.getCompletionEntryDetails(
+    let prior = languageService.getCompletionEntryDetails(
         fileName,
         position,
         prevCompletionsMap[entryName]?.originalName || entryName,
@@ -32,6 +32,15 @@ export default function completionEntryDetails(
         preferences,
         data,
     )
+    if (detailPrepend) {
+        prior ??= {
+            name: entryName,
+            kind: ts.ScriptElementKind.alias,
+            kindModifiers: '',
+            displayParts: [],
+        }
+        prior.displayParts = [{ kind: 'text', text: detailPrepend }, ...prior.displayParts]
+    }
     if (!prior) return
     if (source) {
         const namespaceImport = namespaceAutoImports(
@@ -62,9 +71,6 @@ export default function completionEntryDetails(
             ]
         }
     }
-    if (detailPrepend) {
-        prior.displayParts = [{ kind: 'text', text: detailPrepend }, ...prior.displayParts]
-    }
     if (documentationAppend) {
         prior.documentation = [...(prior.documentation ?? []), { kind: 'text', text: documentationAppend }]
     }

typescript/src/completionsAtPosition.ts

@@ -28,6 +28,7 @@ import { sharedCompletionContext } from './completions/sharedContext'
 import displayImportedInfo from './completions/displayImportedInfo'
 import changeKindToFunction from './completions/changeKindToFunction'
 import functionPropsAndMethods from './completions/functionPropsAndMethods'
+import { getTupleSignature } from './tupleSignature'
 
 export type PrevCompletionMap = Record<
     string,
@@ -106,6 +107,7 @@ export const getCompletionsAtPosition = (
     }
     const hasSuggestions = prior && prior.entries.filter(({ kind }) => kind !== ts.ScriptElementKind.warning).length !== 0
     const node = findChildContainingPosition(ts, sourceFile, position)
+
     /** node that is one character behind
      * useful as in most cases we work with node that is behind the cursor */
     const leftNode = findChildContainingPosition(ts, sourceFile, position - 1)
@@ -147,6 +149,24 @@ export const getCompletionsAtPosition = (
 
     if (!prior) return
 
+    if (c('tupleHelpSignature') && node) {
+        const tupleSignature = getTupleSignature(node, program.getTypeChecker()!)
+        if (tupleSignature) {
+            const { currentHasLabel, currentMember, tupleMembers } = tupleSignature
+            const tupleCurrentItem = tupleMembers[currentMember]
+            if (currentHasLabel && tupleCurrentItem) {
+                const name = tupleCurrentItem.split(':', 1)[0]!
+                prior.entries.push({
+                    name,
+                    kind: ts.ScriptElementKind.warning,
+                    sortText: '07',
+                })
+                prevCompletionsMap[name] ??= {}
+                prevCompletionsMap[name]!.detailPrepend = `[${currentMember}]: ${tupleCurrentItem.slice(tupleCurrentItem.indexOf(':') + 2)}`
+            }
+        }
+    }
+
     if (c('caseSensitiveCompletions')) {
         const fullText = sourceFile.getFullText()
         const currentWord = fullText.slice(0, position).match(/[\w\d]+$/)

typescript/src/decorateProxy.ts

@@ -13,7 +13,6 @@ import { GetConfig } from './types'
 import lodashGet from 'lodash.get'
 import decorateWorkspaceSymbolSearch from './workspaceSymbolSearch'
 import decorateFormatFeatures from './decorateFormatFeatures'
-import namespaceAutoImports from './namespaceAutoImports'
 import libDomPatching from './libDomPatching'
 import decorateSignatureHelp from './decorateSignatureHelp'
 

typescript/src/decorateSignatureHelp.ts

@@ -1,14 +1,49 @@
+import { getTupleSignature } from './tupleSignature'
 import { GetConfig } from './types'
 import { findChildContainingExactPosition } from './utils'
 
 export default (proxy: ts.LanguageService, languageService: ts.LanguageService, languageServiceHost: ts.LanguageServiceHost, c: GetConfig) => {
     proxy.getSignatureHelpItems = (fileName, position, options) => {
+        const program = languageService.getProgram()!
+        const sourceFile = program.getSourceFile(fileName)!
+        let node: ts.Node | undefined
+
+        if (c('tupleHelpSignature')) {
+            node ??= findChildContainingExactPosition(sourceFile, position)
+            const tupleSignature = node && getTupleSignature(node, program.getTypeChecker()!)
+            if (tupleSignature && node) {
+                const { tupleMembers, currentMember } = tupleSignature
+                const nodeStart = node.getLeadingTriviaWidth() + node.pos
+                return {
+                    argumentCount: tupleMembers.length,
+                    argumentIndex: currentMember,
+                    selectedItemIndex: 0,
+                    applicableSpan: ts.createTextSpanFromBounds(nodeStart, node.end),
+                    items: [
+                        {
+                            isVariadic: false,
+                            tags: [],
+                            prefixDisplayParts: [{ kind: 'text', text: '[' }],
+                            suffixDisplayParts: [{ kind: 'text', text: ']' }],
+                            documentation: [],
+                            separatorDisplayParts: [{ kind: 'text', text: ', ' }],
+                            parameters: tupleMembers.map(tupleMember => ({
+                                name: '',
+                                displayParts: [{ kind: 'text', text: tupleMember }],
+                                documentation: [],
+                                isOptional: false,
+                            })),
+                        },
+                    ] as ts.SignatureHelpItem[],
+                } as ts.SignatureHelpItems
+            }
+        }
+
         if (!c('signatureHelp.excludeBlockScope') || options?.triggerReason?.kind !== 'invoked') {
             return languageService.getSignatureHelpItems(fileName, position, options)
         }
 
-        const sourceFile = languageService.getProgram()!.getSourceFile(fileName)!
-        const node = findChildContainingExactPosition(sourceFile, position)
+        node ??= findChildContainingExactPosition(sourceFile, position)
         const returnStatement =
             ts.findAncestor(node, node => {
                 return ts.isBlock(node) ? 'quit' : ts.isReturnStatement(node)

typescript/src/tupleSignature.ts

@@ -0,0 +1,64 @@
+import { compact } from '@zardoy/utils'
+
+export const getTupleSignature = (node: ts.Node, typeChecker: ts.TypeChecker) => {
+    const originalNode = node
+
+    let i = -1
+    let targetNode: ts.Node | undefined
+
+    const setIndex = (elements: ts.NodeArray<any>) => {
+        i = elements.indexOf(originalNode)
+        if (i === -1) i = elements.length
+    }
+
+    if (ts.isIdentifier(node)) node = node.parent
+    if (ts.isOmittedExpression(node)) node = node.parent
+    if (ts.isArrayBindingPattern(node)) {
+        if (node.parent.name === node) {
+            targetNode = node
+            setIndex(node.parent.name.elements)
+        }
+        //     if (ts.isVariableDeclaration(node.parent) && ts.isVariableDeclarationList(node.parent.parent) && ts.isForOfStatement(node.parent.parent.parent)) {
+        //         const expr = node.parent.parent.parent.expression
+        //         targetNode = expr
+        //         setIndex((node.parent.name as ts.ArrayBindingPattern).elements)
+        //     }
+        //     if (ts.isVariableDeclaration(node.parent) && node.parent.initializer) {
+        //         targetNode = node.parent.initializer
+        //         setIndex((node.parent.name as ts.ArrayBindingPattern).elements)
+        //     }
+        //     if (ts.isParameter(node.parent)) {
+        //         targetNode = node.parent
+        //         setIndex((node.parent.name as ts.ArrayBindingPattern).elements)
+        //     }
+    } else if (ts.isArrayLiteralExpression(node)) {
+        if (ts.isBinaryExpression(node.parent) && node.parent.operatorToken.kind === ts.SyntaxKind.EqualsToken) {
+            targetNode = node.parent.left
+            setIndex(node.elements)
+        }
+    }
+
+    if (!targetNode) return
+
+    const type = typeChecker.getTypeAtLocation(targetNode)
+    const properties = type.getProperties()
+    // simple detect that not a tuple
+    if (!properties.some(property => property.name === '0')) return
+    const currentMember = properties.findIndex(property => property.name === i.toString())
+    let currentHasLabel = false
+    const tupleMembers = compact(
+        properties.map((property, i) => {
+            if (!property.name.match(/^\d+$/)) return
+            const type = typeChecker.getTypeOfSymbolAtLocation(property, targetNode!)
+            let displayString = typeChecker.typeToString(type)
+            const tupleLabelDeclaration: ts.NamedTupleMember | undefined = property['target']?.['tupleLabelDeclaration']
+            const tupleLabel = tupleLabelDeclaration?.name.text
+            if (tupleLabel) {
+                displayString = `${tupleLabel}: ${displayString}`
+                if (i === currentMember) currentHasLabel = true
+            }
+            return displayString
+        }),
+    )
+    return { tupleMembers, currentMember, currentHasLabel }
+}