@codingame/monaco-vscode-api 24.3.0 → 25.0.0

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsCustomView.d.ts

@@ -4,6 +4,7 @@ import { IThemeService } from "../../../../../../../platform/theme/common/themeS
 import { ICodeEditor } from "../../../../../../browser/editorBrowser.js";
 import { ILanguageService } from "../../../../../../common/languages/language.service.js";
 import { InlineSuggestHint } from "../../../model/inlineSuggestionItem.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 import { IInlineEditsView, InlineEditClickEvent, InlineEditTabAction } from "../inlineEditsViewInterface.js";
 export declare class InlineEditsCustomView extends Disposable implements IInlineEditsView {
     private readonly _editor;
@@ -15,7 +16,7 @@ export declare class InlineEditsCustomView extends Disposable implements IInline
     private readonly _viewRef;
     private readonly _editorObs;
     readonly minEditorScrollHeight: IObservable<number>;
-    constructor(_editor: ICodeEditor, displayLocation: IObservable<InlineSuggestHint | undefined>, tabAction: IObservable<InlineEditTabAction>, themeService: IThemeService, _languageService: ILanguageService);
+    constructor(_editor: ICodeEditor, displayLocation: IObservable<InlineSuggestHint | undefined>, tabAction: IObservable<InlineEditTabAction>, editorType: IObservable<InlineCompletionEditorType>, themeService: IThemeService, _languageService: ILanguageService);
     private fitsInsideViewport;
     private getState;
     private getRendering;

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsCustomView.js

@@ -4,17 +4,6 @@ import { n, createElement } from '../../../../../../../base/browser/dom.js';
 import { Emitter } from '../../../../../../../base/common/event.js';
 import { Disposable } from '../../../../../../../base/common/lifecycle.js';
 import '../../../../../../../base/common/observableInternal/index.js';
-import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
-import '../../../../../../../platform/theme/common/colors/baseColors.js';
-import '../../../../../../../platform/theme/common/colors/chartsColors.js';
-import { editorBackground } from '../../../../../../../platform/theme/common/colors/editorColors.js';
-import '../../../../../../../platform/theme/common/colors/inputColors.js';
-import '../../../../../../../platform/theme/common/colors/listColors.js';
-import '../../../../../../../platform/theme/common/colors/menuColors.js';
-import '../../../../../../../platform/theme/common/colors/minimapColors.js';
-import '../../../../../../../platform/theme/common/colors/miscColors.js';
-import '../../../../../../../platform/theme/common/colors/quickpickColors.js';
-import '../../../../../../../platform/theme/common/colors/searchColors.js';
 import { IThemeService } from '../../../../../../../platform/theme/common/themeService.service.js';
 import { observableCodeEditor } from '../../../../../../browser/observableCodeEditor.js';
 import { renderLines, LineSource, RenderOptions } from '../../../../../../browser/widget/diffEditor/components/diffEditorViewZones/renderLines.js';
@@ -25,7 +14,7 @@ import { InlineCompletionHintStyle } from '../../../../../../common/languages.js
 import { ILanguageService } from '../../../../../../common/languages/language.service.js';
 import { TokenArray, LineTokens } from '../../../../../../common/tokens/lineTokens.js';
 import { InlineEditTabAction, InlineEditClickEvent } from '../inlineEditsViewInterface.js';
-import { inlineEditIndicatorSuccessfulBackground, inlineEditIndicatorPrimaryBackground, inlineEditIndicatorSecondaryBackground, getEditorBlendedColor } from '../theme.js';
+import { inlineEditIndicatorSuccessfulBackground, inlineEditIndicatorPrimaryBackground, inlineEditIndicatorSecondaryBackground, getEditorBackgroundColor, getEditorBlendedColor, INLINE_EDITS_BORDER_RADIUS } from '../theme.js';
 import { maxContentWidthInRange, getContentRenderWidth, rectToProps } from '../utils/utils.js';
 import { observableValue } from '../../../../../../../base/common/observableInternal/observables/observableValue.js';
 import { derived } from '../../../../../../../base/common/observableInternal/observables/derived.js';
@@ -39,7 +28,7 @@ const PADDING_HORIZONTALLY = 4;
 const HORIZONTAL_OFFSET_WHEN_ABOVE_BELOW = 4;
 const VERTICAL_OFFSET_WHEN_ABOVE_BELOW = 2;
 let InlineEditsCustomView = class InlineEditsCustomView extends Disposable {
-    constructor(_editor, displayLocation, tabAction, themeService, _languageService) {
+    constructor(_editor, displayLocation, tabAction, editorType, themeService, _languageService) {
         super();
         this._editor = _editor;
         this._languageService = _languageService;
@@ -64,7 +53,7 @@ let InlineEditsCustomView = class InlineEditsCustomView extends Disposable {
             }
             return {
                 border: ( getEditorBlendedColor(border, themeService).read(reader).toString()),
-                background: asCssVariable(editorBackground)
+                background: getEditorBackgroundColor(editorType.read(reader))
             };
         }));
         const state = ( displayLocation.map(dl => dl ? this.getState(dl) : undefined));
@@ -222,7 +211,7 @@ let InlineEditsCustomView = class InlineEditsCustomView extends Disposable {
                 boxSizing: 'border-box',
                 cursor: 'pointer',
                 border: ( styles.map(s => `1px solid ${s.border}`)),
-                borderRadius: '4px',
+                borderRadius: `${INLINE_EDITS_BORDER_RADIUS}px`,
                 backgroundColor: ( styles.map(s => s.background)),
                 display: 'flex',
                 alignItems: 'center',
@@ -239,8 +228,8 @@ let InlineEditsCustomView = class InlineEditsCustomView extends Disposable {
     }
 };
 InlineEditsCustomView = ( __decorate([
-    ( __param(3, IThemeService)),
-    ( __param(4, ILanguageService))
+    ( __param(4, IThemeService)),
+    ( __param(5, ILanguageService))
 ], InlineEditsCustomView));
 
 export { InlineEditsCustomView };

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsDeletionView.d.ts

@@ -6,6 +6,7 @@ import { LineRange } from "../../../../../../common/core/ranges/lineRange.js";
 import { Range } from "../../../../../../common/core/range.js";
 import { IInlineEditsView, InlineEditTabAction } from "../inlineEditsViewInterface.js";
 import { InlineEditWithChanges } from "../inlineEditWithChanges.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 export declare class InlineEditsDeletionView extends Disposable implements IInlineEditsView {
     private readonly _editor;
     private readonly _edit;
@@ -19,7 +20,7 @@ export declare class InlineEditsDeletionView extends Disposable implements IInli
     constructor(_editor: ICodeEditor, _edit: IObservable<InlineEditWithChanges | undefined>, _uiState: IObservable<{
         originalRange: LineRange;
         deletions: Range[];
-        inDiffEditor: boolean;
+        editorType: InlineCompletionEditorType;
     } | undefined>, _tabAction: IObservable<InlineEditTabAction>);
     private readonly _display;
     private readonly _editorMaxContentWidthInRange;

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsDeletionView.js

@@ -4,23 +4,14 @@ import { Event } from '../../../../../../../base/common/event.js';
 import { Disposable } from '../../../../../../../base/common/lifecycle.js';
 import '../../../../../../../base/common/observableInternal/index.js';
 import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
-import '../../../../../../../platform/theme/common/colors/baseColors.js';
-import '../../../../../../../platform/theme/common/colors/chartsColors.js';
-import { editorBackground } from '../../../../../../../platform/theme/common/colors/editorColors.js';
-import '../../../../../../../platform/theme/common/colors/inputColors.js';
-import '../../../../../../../platform/theme/common/colors/listColors.js';
-import '../../../../../../../platform/theme/common/colors/menuColors.js';
-import '../../../../../../../platform/theme/common/colors/minimapColors.js';
-import '../../../../../../../platform/theme/common/colors/miscColors.js';
-import '../../../../../../../platform/theme/common/colors/quickpickColors.js';
-import '../../../../../../../platform/theme/common/colors/searchColors.js';
 import { observableCodeEditor } from '../../../../../../browser/observableCodeEditor.js';
 import { Rect } from '../../../../../../common/core/2d/rect.js';
 import { EditorOption } from '../../../../../../common/config/editorOptions.js';
 import { OffsetRange } from '../../../../../../common/core/ranges/offsetRange.js';
 import { Position } from '../../../../../../common/core/position.js';
-import { originalBackgroundColor, getOriginalBorderColor } from '../theme.js';
+import { INLINE_EDITS_BORDER_RADIUS, getEditorBackgroundColor, originalBackgroundColor, getOriginalBorderColor } from '../theme.js';
 import { maxContentWidthInRange, getPrefixTrim, mapOutFalsy } from '../utils/utils.js';
+import { InlineCompletionEditorType } from '../../../model/provideInlineCompletions.js';
 import { derived } from '../../../../../../../base/common/observableInternal/observables/derived.js';
 import { constObservable } from '../../../../../../../base/common/observableInternal/observables/constObservable.js';
 import { derivedObservableWithCache } from '../../../../../../../base/common/observableInternal/utils/utils.js';
@@ -30,7 +21,7 @@ const VERTICAL_PADDING = 0;
 const BORDER_WIDTH = 1;
 const WIDGET_SEPARATOR_WIDTH = 1;
 const WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH = 3;
-const BORDER_RADIUS = 4;
+const BORDER_RADIUS = INLINE_EDITS_BORDER_RADIUS;
 class InlineEditsDeletionView extends Disposable {
     constructor(_editor, _edit, _uiState, _tabAction) {
         super();
@@ -100,16 +91,17 @@ class InlineEditsDeletionView extends Disposable {
                 return rect.intersectHorizontal(( new OffsetRange(overlayHider.left, Number.MAX_SAFE_INTEGER)));
             });
             const separatorWidth = ( this._uiState.map(
-                s => s?.inDiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
+                s => s?.editorType === InlineCompletionEditorType.DiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
             )).read(reader);
             const separatorRect = ( overlayRect.map(rect => rect.withMargin(separatorWidth, separatorWidth)));
+            const editorBackground = getEditorBackgroundColor(( this._uiState.map(s => s?.editorType ?? InlineCompletionEditorType.TextEditor)).read(reader));
             return [
                 n.div({
                     class: 'originalSeparatorDeletion',
                     style: {
                         ...separatorRect.read(reader).toStyles(),
                         borderRadius: `${BORDER_RADIUS}px`,
-                        border: `${BORDER_WIDTH + separatorWidth}px solid ${asCssVariable(editorBackground)}`,
+                        border: `${BORDER_WIDTH + separatorWidth}px solid ${editorBackground}`,
                         boxSizing: 'border-box',
                     }
                 }),
@@ -127,7 +119,7 @@ class InlineEditsDeletionView extends Disposable {
                     class: 'originalOverlayHiderDeletion',
                     style: {
                         ...overlayhider.read(reader).toStyles(),
-                        backgroundColor: asCssVariable(editorBackground),
+                        backgroundColor: editorBackground,
                     }
                 })
             ];

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsInsertionView.d.ts

@@ -4,6 +4,7 @@ import { IInstantiationService } from "../../../../../../../platform/instantiati
 import { ICodeEditor } from "../../../../../../browser/editorBrowser.js";
 import { LineRange } from "../../../../../../common/core/ranges/lineRange.js";
 import { ILanguageService } from "../../../../../../common/languages/language.service.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 import { GhostTextView } from "../../ghostText/ghostTextView.js";
 import { IInlineEditsView, InlineEditClickEvent, InlineEditTabAction } from "../inlineEditsViewInterface.js";
 export declare class InlineEditsInsertionView extends Disposable implements IInlineEditsView {
@@ -24,7 +25,7 @@ export declare class InlineEditsInsertionView extends Disposable implements IInl
         lineNumber: number;
         startColumn: number;
         text: string;
-        inDiffEditor: boolean;
+        editorType: InlineCompletionEditorType;
     } | undefined>, _tabAction: IObservable<InlineEditTabAction>, instantiationService: IInstantiationService, _languageService: ILanguageService);
     private readonly _display;
     private readonly _editorMaxContentWidthInRange;

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsInsertionView.js

@@ -6,16 +6,6 @@ import { Disposable } from '../../../../../../../base/common/lifecycle.js';
 import '../../../../../../../base/common/observableInternal/index.js';
 import { IInstantiationService } from '../../../../../../../platform/instantiation/common/instantiation.js';
 import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
-import '../../../../../../../platform/theme/common/colors/baseColors.js';
-import '../../../../../../../platform/theme/common/colors/chartsColors.js';
-import { editorBackground } from '../../../../../../../platform/theme/common/colors/editorColors.js';
-import '../../../../../../../platform/theme/common/colors/inputColors.js';
-import '../../../../../../../platform/theme/common/colors/listColors.js';
-import '../../../../../../../platform/theme/common/colors/menuColors.js';
-import '../../../../../../../platform/theme/common/colors/minimapColors.js';
-import '../../../../../../../platform/theme/common/colors/miscColors.js';
-import '../../../../../../../platform/theme/common/colors/quickpickColors.js';
-import '../../../../../../../platform/theme/common/colors/searchColors.js';
 import { observableCodeEditor } from '../../../../../../browser/observableCodeEditor.js';
 import { RenderOptions, renderLines, LineSource } from '../../../../../../browser/widget/diffEditor/components/diffEditorViewZones/renderLines.js';
 import { Rect } from '../../../../../../common/core/2d/rect.js';
@@ -27,9 +17,10 @@ import { ILanguageService } from '../../../../../../common/languages/language.se
 import { TokenArray, LineTokens } from '../../../../../../common/tokens/lineTokens.js';
 import { InlineDecoration, InlineDecorationType } from '../../../../../../common/viewModel/inlineDecorations.js';
 import { GhostText, GhostTextPart } from '../../../model/ghostText.js';
+import { InlineCompletionEditorType } from '../../../model/provideInlineCompletions.js';
 import { GhostTextView } from '../../ghostText/ghostTextView.js';
 import { InlineEditClickEvent } from '../inlineEditsViewInterface.js';
-import { modifiedBackgroundColor, getModifiedBorderColor } from '../theme.js';
+import { INLINE_EDITS_BORDER_RADIUS, getEditorBackgroundColor, modifiedBackgroundColor, getModifiedBorderColor } from '../theme.js';
 import { getPrefixTrim, mapOutFalsy } from '../utils/utils.js';
 import { derived } from '../../../../../../../base/common/observableInternal/observables/derived.js';
 import { observableValue } from '../../../../../../../base/common/observableInternal/observables/observableValue.js';
@@ -38,7 +29,7 @@ import { constObservable } from '../../../../../../../base/common/observableInte
 const BORDER_WIDTH = 1;
 const WIDGET_SEPARATOR_WIDTH = 1;
 const WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH = 3;
-const BORDER_RADIUS = 4;
+const BORDER_RADIUS = INLINE_EDITS_BORDER_RADIUS;
 let InlineEditsInsertionView = class InlineEditsInsertionView extends Disposable {
     constructor(_editor, _input, _tabAction, instantiationService, _languageService) {
         super();
@@ -186,19 +177,20 @@ let InlineEditsInsertionView = class InlineEditsInsertionView extends Disposable
                 layoutInfo => Rect.fromLeftTopRightBottom(layoutInfo.contentLeft - BORDER_RADIUS - BORDER_WIDTH, layoutInfo.overlay.top, layoutInfo.contentLeft, layoutInfo.overlay.bottom)
             )).read(reader);
             const separatorWidth = ( this._input.map(
-                i => i?.inDiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
+                i => i?.editorType === InlineCompletionEditorType.DiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
             )).read(reader);
             const overlayRect = ( overlayLayoutObs.map(
                 l => l.overlay.withMargin(0, BORDER_WIDTH, 0, l.startsAtContentLeft ? 0 : BORDER_WIDTH).intersectHorizontal(( new OffsetRange(overlayHider.left, Number.MAX_SAFE_INTEGER)))
             ));
             const underlayRect = ( overlayRect.map(rect => rect.withMargin(separatorWidth, separatorWidth)));
+            const editorBackground = getEditorBackgroundColor(this._input.read(undefined)?.editorType ?? InlineCompletionEditorType.TextEditor);
             return [
                 n.div({
                     class: 'originalUnderlayInsertion',
                     style: {
                         ...underlayRect.read(reader).toStyles(),
                         borderRadius: BORDER_RADIUS,
-                        border: `${BORDER_WIDTH + separatorWidth}px solid ${asCssVariable(editorBackground)}`,
+                        border: `${BORDER_WIDTH + separatorWidth}px solid ${editorBackground}`,
                         boxSizing: 'border-box',
                     }
                 }),
@@ -216,7 +208,7 @@ let InlineEditsInsertionView = class InlineEditsInsertionView extends Disposable
                     class: 'originalOverlayHiderInsertion',
                     style: {
                         ...overlayHider.toStyles(),
-                        backgroundColor: asCssVariable(editorBackground),
+                        backgroundColor: editorBackground,
                     }
                 })
             ];

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsLineReplacementView.d.ts

@@ -5,11 +5,12 @@ import { ObservableCodeEditor } from "../../../../../../browser/observableCodeEd
 import { Range } from "../../../../../../common/core/range.js";
 import { LineRange } from "../../../../../../common/core/ranges/lineRange.js";
 import { ILanguageService } from "../../../../../../common/languages/language.service.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 import { IInlineEditsView, InlineEditClickEvent, InlineEditTabAction } from "../inlineEditsViewInterface.js";
 export declare class InlineEditsLineReplacementView extends Disposable implements IInlineEditsView {
     private readonly _editor;
     private readonly _edit;
-    private readonly _isInDiffEditor;
+    private readonly _editorType;
     private readonly _tabAction;
     private readonly _languageService;
     private readonly _themeService;
@@ -27,7 +28,7 @@ export declare class InlineEditsLineReplacementView extends Disposable implement
         modifiedRange: LineRange;
         modifiedLines: string[];
         replacements: Replacement[];
-    } | undefined>, _isInDiffEditor: IObservable<boolean>, _tabAction: IObservable<InlineEditTabAction>, _languageService: ILanguageService, _themeService: IThemeService);
+    } | undefined>, _editorType: IObservable<InlineCompletionEditorType>, _tabAction: IObservable<InlineEditTabAction>, _languageService: ILanguageService, _themeService: IThemeService);
     private _isMouseOverWidget;
     private _previousViewZoneInfo;
     private removePreviousViewZone;

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsLineReplacementView.js

@@ -7,7 +7,7 @@ import '../../../../../../../base/common/observableInternal/index.js';
 import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
 import '../../../../../../../platform/theme/common/colors/baseColors.js';
 import '../../../../../../../platform/theme/common/colors/chartsColors.js';
-import { editorBackground } from '../../../../../../../platform/theme/common/colors/editorColors.js';
+import '../../../../../../../platform/theme/common/colors/editorColors.js';
 import '../../../../../../../platform/theme/common/colors/inputColors.js';
 import '../../../../../../../platform/theme/common/colors/listColors.js';
 import '../../../../../../../platform/theme/common/colors/menuColors.js';
@@ -26,19 +26,20 @@ import { OffsetRange } from '../../../../../../common/core/ranges/offsetRange.js
 import { ILanguageService } from '../../../../../../common/languages/language.service.js';
 import { TokenArray, LineTokens } from '../../../../../../common/tokens/lineTokens.js';
 import { InlineDecoration, InlineDecorationType } from '../../../../../../common/viewModel/inlineDecorations.js';
+import { InlineCompletionEditorType } from '../../../model/provideInlineCompletions.js';
 import { InlineEditClickEvent } from '../inlineEditsViewInterface.js';
-import { getModifiedBorderColor, getOriginalBorderColor, originalBackgroundColor, getEditorBlendedColor, modifiedChangedLineBackgroundColor } from '../theme.js';
+import { getModifiedBorderColor, getOriginalBorderColor, getEditorBackgroundColor, INLINE_EDITS_BORDER_RADIUS, originalBackgroundColor, getEditorBlendedColor, modifiedChangedLineBackgroundColor } from '../theme.js';
 import { getPrefixTrim, mapOutFalsy, rectToProps, getEditorValidOverlayRect } from '../utils/utils.js';
 import { autorunDelta } from '../../../../../../../base/common/observableInternal/reactions/autorun.js';
 import { derived } from '../../../../../../../base/common/observableInternal/observables/derived.js';
 import { constObservable } from '../../../../../../../base/common/observableInternal/observables/constObservable.js';
 
 let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extends Disposable {
-    constructor(_editor, _edit, _isInDiffEditor, _tabAction, _languageService, _themeService) {
+    constructor(_editor, _edit, _editorType, _tabAction, _languageService, _themeService) {
         super();
         this._editor = _editor;
         this._edit = _edit;
-        this._isInDiffEditor = _isInDiffEditor;
+        this._editorType = _editorType;
         this._tabAction = _tabAction;
         this._languageService = _languageService;
         this._themeService = _themeService;
@@ -169,7 +170,7 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                 }
                 const layoutProps = layout.read(reader);
                 const contentLeft = this._editor.layoutInfoContentLeft.read(reader);
-                const separatorWidth = this._isInDiffEditor.read(reader) ? 3 : 1;
+                const separatorWidth = this._editorType.read(reader) === InlineCompletionEditorType.DiffEditor ? 3 : 1;
                 modifiedLineElements.lines.forEach((l, i) => {
                     l.style.width = `${layoutProps.lowerText.width}px`;
                     l.style.height = `${layoutProps.modifiedLineHeights[i]}px`;
@@ -177,6 +178,7 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                 });
                 const modifiedBorderColor = getModifiedBorderColor(this._tabAction).read(reader);
                 const originalBorderColor = getOriginalBorderColor(this._tabAction).read(reader);
+                const editorBackground = getEditorBackgroundColor(this._editorType.read(reader));
                 return [
                     n.div({
                         style: {
@@ -191,8 +193,8 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                             style: {
                                 position: 'absolute',
                                 ...rectToProps(reader => layout.read(reader).background.translateX(-contentLeft).withMargin(separatorWidth)),
-                                borderRadius: '4px',
-                                border: `${separatorWidth + 1}px solid ${asCssVariable(editorBackground)}`,
+                                borderRadius: `${INLINE_EDITS_BORDER_RADIUS}px`,
+                                border: `${separatorWidth + 1}px solid ${editorBackground}`,
                                 boxSizing: 'border-box',
                                 pointerEvents: 'none',
                             }
@@ -202,7 +204,7 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                             style: {
                                 position: 'absolute',
                                 ...rectToProps(reader => layout.read(reader).background.translateX(-contentLeft)),
-                                borderRadius: '4px',
+                                borderRadius: `${INLINE_EDITS_BORDER_RADIUS}px`,
                                 border: ( getEditorBlendedColor(originalBorderColor, this._themeService).map(c => `1px solid ${( c.toString())}`)),
                                 pointerEvents: 'none',
                                 boxSizing: 'border-box',
@@ -214,8 +216,8 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                             style: {
                                 position: 'absolute',
                                 ...rectToProps(reader => layout.read(reader).lowerBackground.translateX(-contentLeft)),
-                                borderRadius: '0 0 4px 4px',
-                                background: asCssVariable(editorBackground),
+                                borderRadius: `0 0 ${INLINE_EDITS_BORDER_RADIUS}px ${INLINE_EDITS_BORDER_RADIUS}px`,
+                                background: editorBackground,
                                 boxShadow: `${asCssVariable(scrollbarShadow)} 0 6px 6px -6px`,
                                 border: `1px solid ${asCssVariable(modifiedBorderColor)}`,
                                 boxSizing: 'border-box',
@@ -246,7 +248,7 @@ let InlineEditsLineReplacementView = class InlineEditsLineReplacementView extend
                                 fontWeight: this._editor.getOption(EditorOption.fontWeight),
                                 pointerEvents: 'none',
                                 whiteSpace: 'nowrap',
-                                borderRadius: '0 0 4px 4px',
+                                borderRadius: `0 0 ${INLINE_EDITS_BORDER_RADIUS}px ${INLINE_EDITS_BORDER_RADIUS}px`,
                                 overflow: 'hidden',
                             }
                         }, [...modifiedLineElements.lines]),

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsSideBySideView.d.ts

@@ -7,6 +7,7 @@ import { EmbeddedCodeEditorWidget } from "../../../../../../browser/widget/codeE
 import { ITextModel } from "../../../../../../common/model.js";
 import { IInlineEditsView, InlineEditClickEvent, InlineEditTabAction } from "../inlineEditsViewInterface.js";
 import { InlineEditWithChanges } from "../inlineEditWithChanges.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 export declare class InlineEditsSideBySideView extends Disposable implements IInlineEditsView {
     private readonly _editor;
     private readonly _edit;
@@ -21,7 +22,7 @@ export declare class InlineEditsSideBySideView extends Disposable implements IIn
     readonly onDidClick: import("../../../../../../../base/common/event.js").Event<InlineEditClickEvent>;
     constructor(_editor: ICodeEditor, _edit: IObservable<InlineEditWithChanges | undefined>, _previewTextModel: ITextModel, _uiState: IObservable<{
         newTextLineCount: number;
-        isInDiffEditor: boolean;
+        editorType: InlineCompletionEditorType;
     } | undefined>, _tabAction: IObservable<InlineEditTabAction>, _instantiationService: IInstantiationService, _themeService: IThemeService);
     private readonly _display;
     private readonly previewRef;
@@ -44,6 +45,7 @@ export declare class InlineEditsSideBySideView extends Disposable implements IIn
     private readonly _stickyScrollHeight;
     private readonly _shouldOverflow;
     private readonly _originalBackgroundColor;
+    private readonly _editorBackgroundColor;
     private readonly _backgroundSvg;
     private readonly _originalOverlay;
     private readonly _modifiedOverlay;

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsSideBySideView.js

@@ -6,17 +6,7 @@ import { Emitter } from '../../../../../../../base/common/event.js';
 import { Disposable } from '../../../../../../../base/common/lifecycle.js';
 import '../../../../../../../base/common/observableInternal/index.js';
 import { IInstantiationService } from '../../../../../../../platform/instantiation/common/instantiation.js';
-import { asCssVariableWithDefault, asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
-import '../../../../../../../platform/theme/common/colors/baseColors.js';
-import '../../../../../../../platform/theme/common/colors/chartsColors.js';
-import { editorBackground } from '../../../../../../../platform/theme/common/colors/editorColors.js';
-import '../../../../../../../platform/theme/common/colors/inputColors.js';
-import '../../../../../../../platform/theme/common/colors/listColors.js';
-import '../../../../../../../platform/theme/common/colors/menuColors.js';
-import '../../../../../../../platform/theme/common/colors/minimapColors.js';
-import '../../../../../../../platform/theme/common/colors/miscColors.js';
-import '../../../../../../../platform/theme/common/colors/quickpickColors.js';
-import '../../../../../../../platform/theme/common/colors/searchColors.js';
+import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
 import { IThemeService } from '../../../../../../../platform/theme/common/themeService.service.js';
 import { observableCodeEditor } from '../../../../../../browser/observableCodeEditor.js';
 import { Rect } from '../../../../../../common/core/2d/rect.js';
@@ -27,8 +17,9 @@ import { Range } from '../../../../../../common/core/range.js';
 import { StickyScrollController } from '../../../../../stickyScroll/browser/stickyScrollController.js';
 import { InlineCompletionContextKeys } from '../../../controller/inlineCompletionContextKeys.js';
 import { InlineEditClickEvent } from '../inlineEditsViewInterface.js';
-import { originalBackgroundColor, getOriginalBorderColor, getEditorBlendedColor, getModifiedBorderColor, modifiedBackgroundColor } from '../theme.js';
+import { INLINE_EDITS_BORDER_RADIUS, originalBackgroundColor, getEditorBackgroundColor, getOriginalBorderColor, getEditorBlendedColor, getModifiedBorderColor, modifiedBackgroundColor } from '../theme.js';
 import { maxContentWidthInRange, getContentRenderWidth, observeEditorBoundingClientRect, getOffsetForPos, PathBuilder, mapOutFalsy } from '../utils/utils.js';
+import { InlineCompletionEditorType } from '../../../model/provideInlineCompletions.js';
 import { derived } from '../../../../../../../base/common/observableInternal/observables/derived.js';
 import { constObservable } from '../../../../../../../base/common/observableInternal/observables/constObservable.js';
 import { derivedObservableWithCache } from '../../../../../../../base/common/observableInternal/utils/utils.js';
@@ -40,7 +31,7 @@ const VERTICAL_PADDING = 0;
 const BORDER_WIDTH = 1;
 const WIDGET_SEPARATOR_WIDTH = 1;
 const WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH = 3;
-const BORDER_RADIUS = 4;
+const BORDER_RADIUS = INLINE_EDITS_BORDER_RADIUS;
 const ORIGINAL_END_PADDING = 20;
 const MODIFIED_END_PADDING = 12;
 let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposable {
@@ -71,7 +62,7 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
         this._display = derived(this, reader => !!this._uiState.read(reader) ? 'block' : 'none');
         this.previewRef = n.ref();
         const separatorWidthObs = ( this._uiState.map(
-            s => s?.isInDiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
+            s => s?.editorType === InlineCompletionEditorType.DiffEditor ? WIDGET_SEPARATOR_DIFF_EDITOR_WIDTH : WIDGET_SEPARATOR_WIDTH
         ));
         this._editorContainer = n.div({
             class: ['editorContainer'],
@@ -290,6 +281,9 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
         this._originalBackgroundColor = observableFromEvent(this, this._themeService.onDidColorThemeChange, () => {
             return this._themeService.getColorTheme().getColor(originalBackgroundColor) ?? Color.transparent;
         });
+        this._editorBackgroundColor = ( this._uiState.map(s => {
+            return getEditorBackgroundColor(s?.editorType ?? InlineCompletionEditorType.TextEditor);
+        }));
         this._backgroundSvg = n.svg({
             transform: 'translate(-0.5 -0.5)',
             style: { overflow: 'visible', pointerEvents: 'none', position: 'absolute' },
@@ -313,7 +307,7 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
                         .build();
                 }),
                 style: {
-                    fill: asCssVariableWithDefault(editorBackground, 'transparent'),
+                    fill: this._editorBackgroundColor,
                 }
             }),
         ]).keepUpdated(this._store);
@@ -324,9 +318,10 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
             if (!layoutInfoObs) {
                 return undefined;
             }
+            const editorBackground = this._editorBackgroundColor.read(reader);
             const separatorWidth = separatorWidthObs.read(reader);
             const borderStyling = ( getOriginalBorderColor(this._tabAction).map(bc => `${BORDER_WIDTH}px solid ${asCssVariable(bc)}`));
-            const borderStylingSeparator = `${BORDER_WIDTH + separatorWidth}px solid ${asCssVariable(editorBackground)}`;
+            const borderStylingSeparator = `${BORDER_WIDTH + separatorWidth}px solid ${editorBackground}`;
             const hasBorderLeft = layoutInfoObs.read(reader).codeScrollLeft !== 0;
             const isModifiedLower = ( layoutInfoObs.map(layoutInfo => layoutInfo.codeRect.bottom < layoutInfo.editRect.bottom));
             const transitionRectSize = BORDER_RADIUS * 2 + BORDER_WIDTH * 2;
@@ -388,7 +383,7 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
                             borderTop: borderStyling,
                             borderRight: borderStyling,
                             borderRadius: `0 100% 0 0`,
-                            backgroundColor: asCssVariable(editorBackground)
+                            backgroundColor: editorBackground
                         }
                     })
                 ]),
@@ -396,7 +391,7 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
                     class: 'originalOverlaySideBySideHider',
                     style: {
                         ...overlayHider.toStyles(),
-                        backgroundColor: asCssVariable(editorBackground),
+                        backgroundColor: editorBackground,
                     }
                 }),
             ];
@@ -409,12 +404,13 @@ let InlineEditsSideBySideView = class InlineEditsSideBySideView extends Disposab
                 return undefined;
             }
             const isModifiedLower = ( layoutInfoObs.map(layoutInfo => layoutInfo.codeRect.bottom < layoutInfo.editRect.bottom));
+            const editorBackground = this._editorBackgroundColor.read(reader);
             const separatorWidth = separatorWidthObs.read(reader);
             const borderRadius = ( isModifiedLower.map(
                 isLower => `0 ${BORDER_RADIUS}px ${BORDER_RADIUS}px ${isLower ? BORDER_RADIUS : 0}px`
             ));
             const borderStyling = ( getEditorBlendedColor(getModifiedBorderColor(this._tabAction), this._themeService).map(c => `1px solid ${( c.toString())}`));
-            const borderStylingSeparator = `${BORDER_WIDTH + separatorWidth}px solid ${asCssVariable(editorBackground)}`;
+            const borderStylingSeparator = `${BORDER_WIDTH + separatorWidth}px solid ${editorBackground}`;
             const overlayRect = ( layoutInfoObs.map(layoutInfo => layoutInfo.editRect.withMargin(0, BORDER_WIDTH)));
             const separatorRect = ( overlayRect.map(
                 overlayRect => overlayRect.withMargin(separatorWidth, separatorWidth, separatorWidth, 0)

package/vscode/src/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsViews/inlineEditsWordReplacementView.d.ts

@@ -1,3 +1,4 @@
+import { IEquatable } from "../../../../../../../base/common/equals.js";
 import { Disposable } from "../../../../../../../base/common/lifecycle.js";
 import { IObservable } from "../../../../../../../base/common/observable.js";
 import { IHoverService } from "../../../../../../../platform/hover/browser/hover.service.js";
@@ -7,11 +8,13 @@ import { ObservableCodeEditor } from "../../../../../../browser/observableCodeEd
 import { TextReplacement } from "../../../../../../common/core/edits/textEdit.js";
 import { ILanguageService } from "../../../../../../common/languages/language.service.js";
 import { InlineSuggestAlternativeAction } from "../../../model/InlineSuggestAlternativeAction.js";
+import { InlineCompletionEditorType } from "../../../model/provideInlineCompletions.js";
 import { IInlineEditsView, InlineEditClickEvent, InlineEditTabAction } from "../inlineEditsViewInterface.js";
-export declare class WordReplacementsViewData {
+export declare class WordReplacementsViewData implements IEquatable<WordReplacementsViewData> {
     readonly edit: TextReplacement;
+    readonly editorType: InlineCompletionEditorType;
     readonly alternativeAction: InlineSuggestAlternativeAction | undefined;
-    constructor(edit: TextReplacement, alternativeAction: InlineSuggestAlternativeAction | undefined);
+    constructor(edit: TextReplacement, editorType: InlineCompletionEditorType, alternativeAction: InlineSuggestAlternativeAction | undefined);
     equals(other: WordReplacementsViewData): boolean;
 }
 export declare class InlineEditsWordReplacementView extends Disposable implements IInlineEditsView {