Add CompletionItemKind.Folder (#17438)

* Add CompletionItemKind.Folder

Fixes #17435

Adds a new completion item kind for folder/directories. This is useful for path intellisense

For the icons, I copied the icons for folders into the suggestion icon set. Let me know if new ones are needed instead.

* Fix monaco.d.ts

extensions/typescript/src/features/completionItemProvider.ts

@@ -67,10 +67,11 @@ class MyCompletionItem extends CompletionItem {
 			case PConst.Kind.interface:
 				return CompletionItemKind.Interface;
 			case PConst.Kind.warning:
-			case PConst.Kind.directory:
 			case PConst.Kind.file:
 			case PConst.Kind.script:
 				return CompletionItemKind.File;
+			case PConst.Kind.directory:
+				return CompletionItemKind.Folder;
 		}
 
 		return CompletionItemKind.Property;

src/vs/editor/browser/standalone/standaloneLanguages.ts

@@ -258,7 +258,8 @@ export enum CompletionItemKind {
 	Snippet,
 	Color,
 	File,
-	Reference
+	Reference,
+	Folder
 }
 /**
  * A completion item represents a text snippet that is
@@ -377,6 +378,7 @@ function convertKind(kind: CompletionItemKind): modes.SuggestionType {
 		case CompletionItemKind.Color: return 'color';
 		case CompletionItemKind.File: return 'file';
 		case CompletionItemKind.Reference: return 'reference';
+		case CompletionItemKind.Folder: return 'folder';
 	}
 	return 'property';
 }

src/vs/editor/common/modes.ts

@@ -167,7 +167,8 @@ export type SuggestionType = 'method'
 	| 'color'
 	| 'file'
 	| 'reference'
-	| 'customcolor';
+	| 'customcolor'
+	| 'folder';
 
 /**
  * @internal

src/vs/editor/contrib/suggest/browser/Folder_16x.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><style type="text/css">.icon-canvas-transparent{opacity:0;fill:#F6F6F6;} .icon-vs-out{opacity:0;fill:#F6F6F6;} .icon-vs-fg{fill:#F0EFF1;} .icon-folder{fill:#656565;}</style><path class="icon-canvas-transparent" d="M16 16h-16v-16h16v16z" id="canvas"/><path class="icon-vs-out" d="M16 2.5v10c0 .827-.673 1.5-1.5 1.5h-11.996c-.827 0-1.5-.673-1.5-1.5v-8c0-.827.673-1.5 1.5-1.5h2.886l1-2h8.11c.827 0 1.5.673 1.5 1.5z" id="outline"/><path class="icon-folder" d="M14.5 2h-7.492l-1 2h-3.504c-.277 0-.5.224-.5.5v8c0 .276.223.5.5.5h11.996c.275 0 .5-.224.5-.5v-10c0-.276-.225-.5-.5-.5zm-.496 2h-6.496l.5-1h5.996v1z" id="iconBg"/><path class="icon-vs-fg" d="M14 3v1h-6.5l.5-1h6z" id="iconFg"/></svg>
\ No newline at end of file

src/vs/editor/contrib/suggest/browser/Folder_inverse_16x.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><style type="text/css">.icon-canvas-transparent{opacity:0;fill:#F6F6F6;} .icon-vs-out{opacity:0;fill:#F6F6F6;} .icon-vs-fg{opacity:0;fill:#F0EFF1;} .icon-folder{fill:#C5C5C5;}</style><path class="icon-canvas-transparent" d="M16 16h-16v-16h16v16z" id="canvas"/><path class="icon-vs-out" d="M16 2.5v10c0 .827-.673 1.5-1.5 1.5h-11.996c-.827 0-1.5-.673-1.5-1.5v-8c0-.827.673-1.5 1.5-1.5h2.886l1-2h8.11c.827 0 1.5.673 1.5 1.5z" id="outline"/><path class="icon-folder" d="M14.5 2h-7.492l-1 2h-3.504c-.277 0-.5.224-.5.5v8c0 .276.223.5.5.5h11.996c.275 0 .5-.224.5-.5v-10c0-.276-.225-.5-.5-.5zm-.496 2h-6.496l.5-1h5.996v1z" id="iconBg"/><path class="icon-vs-fg" d="M14 3v1h-6.5l.5-1h6z" id="iconFg"/></svg>
\ No newline at end of file

src/vs/editor/contrib/suggest/browser/suggest.css

@@ -146,6 +146,7 @@
 .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.reference { background-image: url('Enumerator_16x.svg'); }
 .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.snippet { background-image: url('Snippet_16x.svg'); }
 .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.customcolor { background-image: none; }
+.monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.folder { background-image: url('Folder_16x.svg'); }
 
 .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.customcolor .colorspan {
 	margin: 0 0 0 0.3em;
@@ -253,6 +254,7 @@
 .monaco-editor.vs-dark .suggest-widget .monaco-list .monaco-list-row .icon.reference { background-image: url('Enumerator_inverse_16x.svg'); }
 .monaco-editor.vs-dark .suggest-widget .monaco-list .monaco-list-row .icon.snippet { background-image: url('Snippet_inverse_16x.svg'); }
 .monaco-editor.vs-dark .suggest-widget .monaco-list .monaco-list-row .icon.customcolor { background-image: none; }
+.monaco-editor.vs-dark .suggest-widget .monaco-list .monaco-list-row .icon.folder { background-image: url('Folder_inverse_16x.svg'); }
 
 /* High Contrast Theming */
 .monaco-editor.hc-black .suggest-widget {

src/vs/monaco.d.ts

@@ -3954,6 +3954,7 @@ declare module monaco.languages {
         Color = 15,
         File = 16,
         Reference = 17,
+        Folder = 18,
     }
 
     /**

src/vs/vscode.d.ts

@@ -2350,7 +2350,8 @@ declare module 'vscode' {
 		Snippet = 14,
 		Color = 15,
 		File = 16,
-		Reference = 17
+		Reference = 17,
+		Folder = 18
 	}
 
 	/**

src/vs/workbench/api/node/extHostTypeConverters.ts

@@ -257,6 +257,7 @@ export const CompletionItemKind = {
 			case types.CompletionItemKind.Color: return 'color';
 			case types.CompletionItemKind.File: return 'file';
 			case types.CompletionItemKind.Reference: return 'reference';
+			case types.CompletionItemKind.Folder: return 'folder';
 		}
 		return 'property';
 	},

src/vs/workbench/api/node/extHostTypes.ts

@@ -830,7 +830,8 @@ export enum CompletionItemKind {
 	Snippet = 14,
 	Color = 15,
 	File = 16,
-	Reference = 17
+	Reference = 17,
+	Folder = 18
 }
 
 export class CompletionItem {

src/vs/workbench/parts/debug/common/debugProtocol.d.ts

@@ -1218,7 +1218,7 @@ declare module DebugProtocol {
 	}
 
 	/** Some predefined types for the CompletionItem. Please note that not all clients have specific icons for all of them. */
-	export type CompletionItemType = 'method' | 'function' | 'constructor' | 'field' | 'variable' | 'class' | 'interface' | 'module' | 'property' | 'unit' | 'value' | 'enum' | 'keyword' | 'snippet' | 'text' | 'color' | 'file' | 'reference' | 'customcolor';
+	export type CompletionItemType = 'method' | 'function' | 'constructor' | 'field' | 'variable' | 'class' | 'interface' | 'module' | 'property' | 'unit' | 'value' | 'enum' | 'keyword' | 'snippet' | 'text' | 'color' | 'file' | 'reference' | 'customcolor' | 'folder';
 
 	/** Names of checksum algorithms that may be supported by a debug adapter. */
 	export type ChecksumAlgorithm = 'MD5' | 'SHA1' | 'SHA256' | 'SHA1Normalized' | 'SHA256Normalized' | 'timestamp';