development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-08-27 04:49:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

editor - update style and behaviour of message widget (#186480)

Browse source
This commit is contained in:
Benjamin Pasero 2023-06-28 13:05:02 +02:00 committed by GitHub
parent fb1d79215e
commit 93b9d0a51a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/vs/editor/contrib/message/browser/messageController.css
View file

@ -31,10 +31,11 @@
}
.monaco-editor .monaco-editor-overlaymessage .message {
padding: 1px 4px;
color: var(--vscode-inputValidation-infoForeground);
background-color: var(--vscode-inputValidation-infoBackground);
padding: 2px 4px;
color: var(--vscode-editorHoverWidget-foreground);
background-color: var(--vscode-editorHoverWidget-background);
border: 1px solid var(--vscode-inputValidation-infoBorder);
border-radius: 3px;
}
.monaco-editor .monaco-editor-overlaymessage .message p {
@ -42,8 +43,11 @@
}
.monaco-editor .monaco-editor-overlaymessage .message a {
font-weight: bold;
color: var(--vscode-inputValidation-infoForeground);
color: var(--vscode-textLink-foreground);
}
.monaco-editor .monaco-editor-overlaymessage .message a:hover {
color: var(--vscode-textLink-activeForeground);
}
.monaco-editor.hc-black .monaco-editor-overlaymessage .message,
@ -59,6 +63,7 @@
z-index: 1000;
border-width: 8px;
position: absolute;
left: 2px;
}
.monaco-editor .monaco-editor-overlaymessage .anchor.top {

25
src/vs/editor/contrib/message/browser/messageController.ts
View file

@ -5,7 +5,7 @@
import { renderMarkdown } from 'vs/base/browser/markdownRenderer';
import { alert } from 'vs/base/browser/ui/aria/aria';
import { TimeoutTimer } from 'vs/base/common/async';
import { Event } from 'vs/base/common/event';
import { IMarkdownString, isMarkdownString } from 'vs/base/common/htmlContent';
import { KeyCode } from 'vs/base/common/keyCodes';
import { DisposableStore, IDisposable, MutableDisposable } from 'vs/base/common/lifecycle';
@ -38,7 +38,7 @@ export class MessageController implements IEditorContribution {
private readonly _messageWidget = new MutableDisposable<MessageWidget>();
private readonly _messageListeners = new DisposableStore();
private _message: { element: HTMLElement; dispose: () => void } | undefined;
private _focus: boolean = false;
private _mouseOverMessage: boolean = false;
constructor(
editor: ICodeEditor,
@ -76,21 +76,24 @@ export class MessageController implements IEditorContribution {
}) : undefined;
this._messageWidget.value = new MessageWidget(this._editor, position, typeof message === 'string' ? message : this._message!.element);
// close on blur, cursor, model change, dispose
this._messageListeners.add(this._editor.onDidBlurEditorText(() => {
if (!this._focus) {
this.closeMessage();
// close on blur (debounced to allow to tab into the message), cursor, model change, dispose
this._messageListeners.add(Event.debounce(this._editor.onDidBlurEditorText, (last, event) => event, 0)(() => {
if (this._mouseOverMessage) {
return; // override when mouse over message
}
if (this._messageWidget.value && dom.isAncestor(document.activeElement, this._messageWidget.value.getDomNode())) {
return; // override when focus is inside the message
}
this.closeMessage();
}
));
this._messageListeners.add(this._editor.onDidChangeCursorPosition(() => this.closeMessage()));
this._messageListeners.add(this._editor.onDidDispose(() => this.closeMessage()));
this._messageListeners.add(this._editor.onDidChangeModel(() => this.closeMessage()));
this._messageListeners.add(dom.addDisposableListener(this._messageWidget.value.getDomNode(), dom.EventType.MOUSE_ENTER, () => this._focus = true, true));
this._messageListeners.add(dom.addDisposableListener(this._messageWidget.value.getDomNode(), dom.EventType.MOUSE_LEAVE, () => this._focus = false, true));
// 3sec
this._messageListeners.add(new TimeoutTimer(() => this.closeMessage(), 3000));
this._messageListeners.add(dom.addDisposableListener(this._messageWidget.value.getDomNode(), dom.EventType.MOUSE_ENTER, () => this._mouseOverMessage = true, true));
this._messageListeners.add(dom.addDisposableListener(this._messageWidget.value.getDomNode(), dom.EventType.MOUSE_LEAVE, () => this._mouseOverMessage = false, true));
// close on mouse move
let bounds: Range;