Inherit font from terminal for suggest

Fixes microsoft#210597

Author: Tyriar

src/vs/workbench/contrib/terminalContrib/suggest/browser/terminalSuggestAddon.ts

@@ -21,6 +21,7 @@ import type { IPromptInputModel, IPromptInputModelState } from 'vs/platform/term
 import { ShellIntegrationOscPs } from 'vs/platform/terminal/common/xterm/shellIntegrationAddon';
 import { getListStyles } from 'vs/platform/theme/browser/defaultStyles';
 import { activeContrastBorder } from 'vs/platform/theme/common/colorRegistry';
+import { ITerminalConfigurationService } from 'vs/workbench/contrib/terminal/browser/terminal';
 import type { IXtermCore } from 'vs/workbench/contrib/terminal/browser/xterm-private';
 import { TerminalStorageKeys } from 'vs/workbench/contrib/terminal/common/terminalStorageKeys';
 import { terminalSuggestConfigSection, type ITerminalSuggestConfiguration } from 'vs/workbench/contrib/terminalContrib/suggest/common/terminalSuggestConfiguration';
@@ -140,6 +141,7 @@ export class SuggestAddon extends Disposable implements ITerminalAddon, ISuggest
 		private readonly _terminalSuggestWidgetVisibleContextKey: IContextKey<boolean>,
 		@IConfigurationService private readonly _configurationService: IConfigurationService,
 		@IInstantiationService private readonly _instantiationService: IInstantiationService,
+		@ITerminalConfigurationService private readonly _terminalConfigurationService: ITerminalConfigurationService,
 	) {
 		super();
 
@@ -499,6 +501,17 @@ export class SuggestAddon extends Disposable implements ITerminalAddon, ISuggest
 				SimpleSuggestWidget,
 				this._panel!,
 				this._instantiationService.createInstance(PersistedWidgetSize),
+				() => {
+					const c = this._terminalConfigurationService.config;
+					const font = this._terminalConfigurationService.getFont(dom.getActiveWindow());
+					return {
+						fontFamily: font.fontFamily,
+						fontSize: font.fontSize,
+						lineHeight: Math.ceil(1.5 * font.fontSize),
+						fontWeight: c.fontWeight.toString(),
+						letterSpacing: font.letterSpacing
+					};
+				},
 				{}
 			));
 			this._suggestWidget.list.style(getListStyles({

src/vs/workbench/services/suggest/browser/simpleSuggestWidget.ts

@@ -84,6 +84,7 @@ export class SimpleSuggestWidget extends Disposable {
 	constructor(
 		private readonly _container: HTMLElement,
 		private readonly _persistedSize: IPersistedWidgetSizeDelegate,
+		private readonly _getFontInfo: () => { fontFamily: string; fontSize: number; lineHeight: number; fontWeight: string; letterSpacing: number },
 		options: IWorkbenchSuggestWidgetOptions,
 		@IInstantiationService instantiationService: IInstantiationService
 	) {
@@ -140,7 +141,7 @@ export class SimpleSuggestWidget extends Disposable {
 			state = undefined;
 		}));
 
-		const renderer = new SimpleSuggestWidgetItemRenderer();
+		const renderer = new SimpleSuggestWidgetItemRenderer(_getFontInfo);
 		this._register(renderer);
 		this._listElement = dom.append(this.element.domNode, $('.tree'));
 		this._list = this._register(new List('SuggestWidget', this._listElement, {
@@ -503,11 +504,8 @@ export class SimpleSuggestWidget extends Disposable {
 	}
 
 	private _getLayoutInfo() {
-		const fontInfo = {
-			lineHeight: 20,
-			typicalHalfwidthCharacterWidth: 10
-		}; //this.editor.getOption(EditorOption.fontInfo);
-		const itemHeight = clamp(fontInfo.lineHeight, 8, 1000);
+		const fontInfo = this._getFontInfo();
+		const itemHeight = clamp(Math.ceil(fontInfo.lineHeight), 8, 1000);
 		const statusBarHeight = 0; //!this.editor.getOption(EditorOption.suggest).showStatusBar || this._state === State.Empty || this._state === State.Loading ? 0 : itemHeight;
 		const borderWidth = 1; //this._details.widget.borderWidth;
 		const borderHeight = 2 * borderWidth;
@@ -517,7 +515,7 @@ export class SimpleSuggestWidget extends Disposable {
 			statusBarHeight,
 			borderWidth,
 			borderHeight,
-			typicalHalfwidthCharacterWidth: fontInfo.typicalHalfwidthCharacterWidth,
+			typicalHalfwidthCharacterWidth: 10,
 			verticalPadding: 22,
 			horizontalPadding: 14,
 			defaultSize: new dom.Dimension(430, statusBarHeight + 12 * itemHeight + borderHeight)

src/vs/workbench/services/suggest/browser/simpleSuggestWidgetRenderer.ts

@@ -49,6 +49,9 @@ export class SimpleSuggestWidgetItemRenderer implements IListRenderer<SimpleComp
 
 	readonly templateId = 'suggestion';
 
+	constructor(private readonly _getFontInfo: () => { fontFamily: string; fontSize: number; lineHeight: number; fontWeight: string; letterSpacing: number }) {
+	}
+
 	dispose(): void {
 		this._onDidToggleDetails.dispose();
 	}
@@ -80,15 +83,8 @@ export class SimpleSuggestWidgetItemRenderer implements IListRenderer<SimpleComp
 		// readMore.title = nls.localize('readMore', "Read More");
 
 		const configureFont = () => {
-			// TODO: Implement
-			// const options = this._editor.getOptions();
-			// const fontInfo = options.get(EditorOption.fontInfo);
-			const fontFamily = 'Hack'; //fontInfo.getMassagedFontFamily();
-			const fontFeatureSettings = ''; //fontInfo.fontFeatureSettings;
-			const fontSize = '12'; // = options.get(EditorOption.suggestFontSize) || fontInfo.fontSize;
-			const lineHeight = '20'; // options.get(EditorOption.suggestLineHeight) || fontInfo.lineHeight;
-			const fontWeight = 'normal'; //fontInfo.fontWeight;
-			const letterSpacing = '0'; // fontInfo.letterSpacing;
+			const fontFeatureSettings = '';
+			const { fontFamily, fontSize, lineHeight, fontWeight, letterSpacing } = this._getFontInfo();
 			const fontSizePx = `${fontSize}px`;
 			const lineHeightPx = `${lineHeight}px`;
 			const letterSpacingPx = `${letterSpacing}px`;