diff --git a/src/vs/base/browser/dom.ts b/src/vs/base/browser/dom.ts index 18e56736dd2..c5fea2d0c7b 100644 --- a/src/vs/base/browser/dom.ts +++ b/src/vs/base/browser/dom.ts @@ -927,6 +927,38 @@ export function isGlobalStylesheet(node: Node): boolean { return globalStylesheets.has(node as HTMLStyleElement); } +/** + * A version of createStyleSheet which has a unified API to initialize/set the style content. + */ +export function createStyleSheet2(): WrappedStyleElement { + return new WrappedStyleElement(); +} + +class WrappedStyleElement { + private _currentCssStyle = ''; + private _styleSheet: HTMLStyleElement | undefined = undefined; + + public setStyle(cssStyle: string): void { + if (cssStyle !== this._currentCssStyle) { + return; + } + this._currentCssStyle = cssStyle; + + if (!this._styleSheet) { + this._styleSheet = createStyleSheet(mainWindow.document.head, (s) => s.innerText = cssStyle); + } else { + this._styleSheet.innerText = cssStyle; + } + } + + public dispose(): void { + if (this._styleSheet) { + clearNode(this._styleSheet); + this._styleSheet = undefined; + } + } +} + export function createStyleSheet(container: HTMLElement = mainWindow.document.head, beforeAppend?: (style: HTMLStyleElement) => void, disposableStore?: DisposableStore): HTMLStyleElement { const style = document.createElement('style'); style.type = 'text/css'; diff --git a/src/vs/editor/common/config/editorOptions.ts b/src/vs/editor/common/config/editorOptions.ts index 2890c08e763..944041b7fc3 100644 --- a/src/vs/editor/common/config/editorOptions.ts +++ b/src/vs/editor/common/config/editorOptions.ts @@ -3993,6 +3993,11 @@ export interface IInlineSuggestOptions { * Does not clear active inline suggestions when the editor loses focus. */ keepOnBlur?: boolean; + + /** + * Font family for inline suggestions. + */ + fontFamily?: string | 'default'; } /** @@ -4011,6 +4016,7 @@ class InlineEditorSuggest extends BaseEditorOption this.editor.getOption(EditorOption.inlineSuggest).enabled); + private readonly _fontFamily = observableFromEvent(this.editor.onDidChangeConfiguration, () => this.editor.getOption(EditorOption.inlineSuggest).fontFamily); private _ghostTextWidget = this._register(this._instantiationService.createInstance(GhostTextWidget, this.editor, { ghostText: this.model.map((v, reader) => /** ghostText */ v?.ghostText.read(reader)), @@ -112,6 +114,17 @@ export class InlineCompletionsController extends Disposable { }); })); + const styleElement = this._register(createStyleSheet2()); + this._register(autorun(reader => { + const fontFamily = this._fontFamily.read(reader); + styleElement.setStyle(fontFamily === '' || fontFamily === 'default' ? `` : ` +.monaco-editor .ghost-text-decoration, +.monaco-editor .ghost-text-decoration-preview, +.monaco-editor .ghost-text { + font-family: ${fontFamily}; +}`); + })); + const getReason = (e: IModelContentChangedEvent): VersionIdChangeReason => { if (e.isUndoing) { return VersionIdChangeReason.Undo; } if (e.isRedoing) { return VersionIdChangeReason.Redo; } diff --git a/src/vs/monaco.d.ts b/src/vs/monaco.d.ts index 51a4fa5d458..cea289bcfda 100644 --- a/src/vs/monaco.d.ts +++ b/src/vs/monaco.d.ts @@ -4502,6 +4502,10 @@ declare namespace monaco.editor { * Does not clear active inline suggestions when the editor loses focus. */ keepOnBlur?: boolean; + /** + * Font family for inline suggestions. + */ + fontFamily?: string | 'default'; } export interface IBracketPairColorizationOptions {