From 5a23709e39ab584755c648fa049f5a94e6ee5fb9 Mon Sep 17 00:00:00 2001 From: Pine Wu Date: Fri, 10 Jan 2020 15:34:17 +0100 Subject: [PATCH] WIP for #39441 --- .../client/src/cssMain.ts | 15 ++++++++- src/vs/editor/common/config/editorOptions.ts | 13 +++++++- .../editor/contrib/suggest/media/suggest.css | 31 ++++++++++++++++--- src/vs/editor/contrib/suggest/suggest.ts | 2 +- .../contrib/suggest/suggestController.ts | 2 +- .../editor/contrib/suggest/suggestWidget.ts | 9 +++++- .../suggest/test/completionModel.test.ts | 1 + src/vs/monaco.d.ts | 4 +++ 8 files changed, 68 insertions(+), 9 deletions(-) diff --git a/extensions/css-language-features/client/src/cssMain.ts b/extensions/css-language-features/client/src/cssMain.ts index 936176e9103fb..bc8bbdc9ff720 100644 --- a/extensions/css-language-features/client/src/cssMain.ts +++ b/extensions/css-language-features/client/src/cssMain.ts @@ -45,8 +45,8 @@ export function activate(context: ExtensionContext) { dataPaths }, middleware: { - // testing the replace / insert mode provideCompletionItem(document: TextDocument, position: Position, context: CompletionContext, token: CancellationToken, next: ProvideCompletionItemsSignature): ProviderResult { + // testing the replace / insert mode function updateRanges(item: CompletionItem) { const range = item.range; if (range && range.end.isAfter(position) && range.start.isBeforeOrEqual(position)) { @@ -54,10 +54,23 @@ export function activate(context: ExtensionContext) { item.range = undefined; } } + function updateProposals(r: CompletionItem[] | CompletionList | null | undefined): CompletionItem[] | CompletionList | null | undefined { if (r) { (Array.isArray(r) ? r : r.items).forEach(updateRanges); + + if (!Array.isArray(r)) { + r.isDetailsResolved = true; + r.items.forEach(i => { + if (i.kind === CompletionItemKind.Color) { + i.detail = i.documentation?.toString(); + } else { + i.detail = i.label; + } + }); + } } + return r; } const isThenable = (obj: ProviderResult): obj is Thenable => obj && (obj)['then']; diff --git a/src/vs/editor/common/config/editorOptions.ts b/src/vs/editor/common/config/editorOptions.ts index 94af6b10d1b55..feb5327143136 100644 --- a/src/vs/editor/common/config/editorOptions.ts +++ b/src/vs/editor/common/config/editorOptions.ts @@ -2495,6 +2495,10 @@ export interface ISuggestOptions { * Max suggestions to show in suggestions. Defaults to 12. */ maxVisibleSuggestions?: number; + /** + * Always show inline details + */ + alwaysRevealInlineDetails?: boolean; /** * Show method-suggestions. */ @@ -2614,6 +2618,7 @@ class EditorSuggest extends BaseEditorOption .contents > .main > .readMore, +/** Inline type Label (details) **/ + .monaco-editor .suggest-widget .monaco-list .monaco-list-row > .contents > .main > .type-label, +.monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row.focused > .contents > .main > .type-label { + display: none; +} + +.monaco-editor .suggest-widget.always-reveal-inline-details .monaco-list .monaco-list-row > .contents > .main > .type-label, +.monaco-editor .suggest-widget.always-reveal-inline-details.docs-side .monaco-list .monaco-list-row.focused > .contents > .main > .type-label { + display: inline; +} + +.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused > .contents > .main > .type-label { + display: inline; +} + +/** readMore icon **/ + +.monaco-editor .suggest-widget .monaco-list .monaco-list-row > .contents > .main > .readMore, .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row.focused > .contents > .main > .readMore, -.monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row.focused > .contents > .main > .type-label, .monaco-editor .suggest-widget.docs-below .monaco-list .monaco-list-row.focused > .contents > .main > .readMore { display: none; } -.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused > .contents > .main > .readMore, -.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused > .contents > .main > .type-label { +.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused > .contents > .main > .readMore { + display: inline; +} +.monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.focused) > .contents > .main > .readMore { + display: inline; + visibility: hidden; +} + +.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused > .contents > .main > .readMore { display: inline; } diff --git a/src/vs/editor/contrib/suggest/suggest.ts b/src/vs/editor/contrib/suggest/suggest.ts index c2d3185ce7d52..f408f88ec12b6 100644 --- a/src/vs/editor/contrib/suggest/suggest.ts +++ b/src/vs/editor/contrib/suggest/suggest.ts @@ -47,7 +47,7 @@ export class CompletionItem { idx?: number; word?: string; - // + // all details resolved, we can show them all readonly isDetailsResolved: boolean; constructor( diff --git a/src/vs/editor/contrib/suggest/suggestController.ts b/src/vs/editor/contrib/suggest/suggestController.ts index cdf2e4f41efa3..a4330d1d43897 100644 --- a/src/vs/editor/contrib/suggest/suggestController.ts +++ b/src/vs/editor/contrib/suggest/suggestController.ts @@ -43,7 +43,7 @@ import { SuggestRangeHighlighter } from 'vs/editor/contrib/suggest/suggestRangeH * Stop suggest widget from disappearing when clicking into other areas * For development purpose only */ -const _sticky = false; +const _sticky = true; class LineSuffix { diff --git a/src/vs/editor/contrib/suggest/suggestWidget.ts b/src/vs/editor/contrib/suggest/suggestWidget.ts index 85358ea708fb5..24bb13a304322 100644 --- a/src/vs/editor/contrib/suggest/suggestWidget.ts +++ b/src/vs/editor/contrib/suggest/suggestWidget.ts @@ -517,7 +517,9 @@ export class SuggestWidget implements IContentWidget, IListVirtualDelegate toggleClass(this.element, 'no-icons', !this.editor.getOption(EditorOption.suggest).showIcons); + const applyAlwaysRevealInlineDetailsStyle = () => toggleClass(this.element, 'always-reveal-inline-details', this.editor.getOption(EditorOption.suggest).alwaysRevealInlineDetails); applyIconStyle(); + applyAlwaysRevealInlineDetailsStyle(); let renderer = instantiationService.createInstance(Renderer, this, this.editor, triggerKeybindingLabel); @@ -538,7 +540,12 @@ export class SuggestWidget implements IContentWidget, IListVirtualDelegate this.onListSelection(e))); this.toDispose.add(this.list.onFocusChange(e => this.onListFocus(e))); this.toDispose.add(this.editor.onDidChangeCursorSelection(() => this.onCursorSelectionChanged())); - this.toDispose.add(this.editor.onDidChangeConfiguration(e => e.hasChanged(EditorOption.suggest) && applyIconStyle())); + this.toDispose.add(this.editor.onDidChangeConfiguration(e => { + if (e.hasChanged(EditorOption.suggest)) { + applyIconStyle(); + applyAlwaysRevealInlineDetailsStyle(); + } + })); this.suggestWidgetVisible = SuggestContext.Visible.bindTo(contextKeyService); this.suggestWidgetMultipleSuggestions = SuggestContext.MultipleSuggestions.bindTo(contextKeyService); diff --git a/src/vs/editor/contrib/suggest/test/completionModel.test.ts b/src/vs/editor/contrib/suggest/test/completionModel.test.ts index 6a26c5fd58498..c3bd3d7610074 100644 --- a/src/vs/editor/contrib/suggest/test/completionModel.test.ts +++ b/src/vs/editor/contrib/suggest/test/completionModel.test.ts @@ -41,6 +41,7 @@ suite('CompletionModel', function () { shareSuggestSelections: false, showIcons: true, maxVisibleSuggestions: 12, + alwaysRevealInlineDetails: false, showMethods: true, showFunctions: true, showConstructors: true, diff --git a/src/vs/monaco.d.ts b/src/vs/monaco.d.ts index ace85852ace2c..ba478dbc33ac0 100644 --- a/src/vs/monaco.d.ts +++ b/src/vs/monaco.d.ts @@ -3381,6 +3381,10 @@ declare namespace monaco.editor { * Max suggestions to show in suggestions. Defaults to 12. */ maxVisibleSuggestions?: number; + /** + * Always show inline details + */ + alwaysRevealInlineDetails?: boolean; /** * Show method-suggestions. */