monaco-editor-core 0.55.1 → 0.56.0-dev-20251121

package/esm/vs/editor/contrib/inlineCompletions/browser/view/inlineEdits/inlineEditsView.js

@@ -13,11 +13,11 @@ var __param = (this && this.__param) || function (paramIndex, decorator) {
 };
 var InlineEditsView_1;
 import { $ } from '../../../../../../base/browser/dom.js';
-import { equalsIfDefined, itemEquals } from '../../../../../../base/common/equals.js';
+import { itemEquals, itemsEquals } from '../../../../../../base/common/equals.js';
 import { BugIndicatingError, onUnexpectedError } from '../../../../../../base/common/errors.js';
 import { Event } from '../../../../../../base/common/event.js';
 import { Disposable } from '../../../../../../base/common/lifecycle.js';
-import { autorun, autorunWithStore, derived, derivedOpts, mapObservableArrayCached, observableValue } from '../../../../../../base/common/observable.js';
+import { autorun, derived, derivedOpts, mapObservableArrayCached, observableValue } from '../../../../../../base/common/observable.js';
 import { IInstantiationService } from '../../../../../../platform/instantiation/common/instantiation.js';
 import { observableCodeEditor } from '../../../../../browser/observableCodeEditor.js';
 import { TextReplacement } from '../../../../../common/core/edits/textEdit.js';
@@ -28,45 +28,62 @@ import { TextLength } from '../../../../../common/core/text/textLength.js';
 import { lineRangeMappingFromRangeMappings, RangeMapping } from '../../../../../common/diff/rangeMapping.js';
 import { TextModel } from '../../../../../common/model/textModel.js';
 import { InlineEditItem } from '../../model/inlineSuggestionItem.js';
-import { InlineEditsGutterIndicator } from './components/gutterIndicatorView.js';
-import { InlineEditsOnboardingExperience } from './inlineEditsNewUsers.js';
 import { InlineCompletionViewKind, InlineEditTabAction } from './inlineEditsViewInterface.js';
 import { InlineEditsCollapsedView } from './inlineEditsViews/inlineEditsCollapsedView.js';
 import { InlineEditsCustomView } from './inlineEditsViews/inlineEditsCustomView.js';
 import { InlineEditsDeletionView } from './inlineEditsViews/inlineEditsDeletionView.js';
 import { InlineEditsInsertionView } from './inlineEditsViews/inlineEditsInsertionView.js';
 import { InlineEditsLineReplacementView } from './inlineEditsViews/inlineEditsLineReplacementView.js';
+import { InlineEditsLongDistanceHint } from './inlineEditsViews/longDistanceHint/inlineEditsLongDistanceHint.js';
 import { InlineEditsSideBySideView } from './inlineEditsViews/inlineEditsSideBySideView.js';
 import { InlineEditsWordReplacementView } from './inlineEditsViews/inlineEditsWordReplacementView.js';
 import { OriginalEditorInlineDiffView } from './inlineEditsViews/originalEditorInlineDiffView.js';
 import { applyEditToModifiedRangeMappings, createReindentEdit } from './utils/utils.js';
 import './view.css';
 let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposable {
-    constructor(_editor, _host, _model, _ghostTextIndicator, _focusIsInMenu, _instantiationService) {
+    constructor(_editor, _model, _simpleModel, _suggestInfo, _showCollapsed, _instantiationService) {
         super();
         this._editor = _editor;
-        this._host = _host;
         this._model = _model;
-        this._ghostTextIndicator = _ghostTextIndicator;
-        this._focusIsInMenu = _focusIsInMenu;
+        this._simpleModel = _simpleModel;
+        this._suggestInfo = _suggestInfo;
+        this._showCollapsed = _showCollapsed;
         this._instantiationService = _instantiationService;
-        this._editorObs = observableCodeEditor(this._editor);
         this._tabAction = derived(reader => this._model.read(reader)?.tabAction.read(reader) ?? InlineEditTabAction.Inactive);
-        this._constructorDone = observableValue(this, false);
+        this.displayRange = derived(this, reader => {
+            const state = this._uiState.read(reader);
+            if (!state) {
+                return undefined;
+            }
+            if (state.state?.kind === 'custom') {
+                const range = state.state.displayLocation?.range;
+                if (!range) {
+                    throw new BugIndicatingError('custom view should have a range');
+                }
+                return new LineRange(range.startLineNumber, range.endLineNumber);
+            }
+            if (state.state?.kind === 'insertionMultiLine') {
+                return this._insertion.originalLines.read(reader);
+            }
+            return state.edit.displayRange;
+        });
+        this._currentInlineEditCache = undefined;
         this._uiState = derived(this, reader => {
             const model = this._model.read(reader);
-            if (!model || !this._constructorDone.read(reader)) {
+            const textModel = this._editorObs.model.read(reader);
+            if (!model || !textModel || !this._constructorDone.read(reader)) {
                 return undefined;
             }
             const inlineEdit = model.inlineEdit;
             let mappings = RangeMapping.fromEdit(inlineEdit.edit);
             let newText = inlineEdit.edit.apply(inlineEdit.originalText);
             let diff = lineRangeMappingFromRangeMappings(mappings, inlineEdit.originalText, new StringText(newText));
-            let state = this.determineRenderState(model, reader, diff, new StringText(newText));
+            let state = this._determineRenderState(model, reader, diff, new StringText(newText));
             if (!state) {
                 onUnexpectedError(new Error(`unable to determine view: tried to render ${this._previousView?.view}`));
                 return undefined;
             }
+            const longDistanceHint = this._getLongDistanceHintState(model, reader);
             if (state.kind === InlineCompletionViewKind.SideBySide) {
                 const indentationAdjustmentEdit = createReindentEdit(newText, inlineEdit.modifiedLineRange, textModel.getOptions().tabSize);
                 newText = indentationAdjustmentEdit.applyToString(newText);
@@ -79,7 +96,7 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
                 // Only update the model if the text has changed to avoid flickering
                 this._previewTextModel.setValue(newText);
             }
-            if (model.showCollapsed.read(reader) && !this._indicator.read(reader)?.isHoverVisible.read(reader)) {
+            if (this._showCollapsed.read(reader)) {
                 state = { kind: InlineCompletionViewKind.Collapsed, viewData: state.viewData };
             }
             model.handleInlineEditShown(state.kind, state.viewData);
@@ -90,70 +107,29 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
                 newText,
                 newTextLineCount: inlineEdit.modifiedLineRange.length,
                 isInDiffEditor: model.isInDiffEditor,
+                longDistanceHint,
             };
         });
-        this._previewTextModel = this._register(this._instantiationService.createInstance(TextModel, '', this._editor.getModel().getLanguageId(), { ...TextModel.DEFAULT_CREATION_OPTIONS, bracketPairColorizationOptions: { enabled: true, independentColorPoolPerBracketType: false } }, null));
-        this._indicatorCyclicDependencyCircuitBreaker = observableValue(this, false);
-        this._indicator = derived(this, (reader) => {
-            if (!this._indicatorCyclicDependencyCircuitBreaker.read(reader)) {
-                return undefined;
-            }
-            const indicatorDisplayRange = derivedOpts({ owner: this, equalsFn: equalsIfDefined(itemEquals()) }, reader => {
-                /** @description indicatorDisplayRange */
-                const ghostTextIndicator = this._ghostTextIndicator.read(reader);
-                if (ghostTextIndicator) {
-                    return ghostTextIndicator.lineRange;
-                }
-                const state = this._uiState.read(reader);
-                if (!state) {
-                    return undefined;
-                }
-                if (state.state?.kind === 'custom') {
-                    const range = state.state.displayLocation?.range;
-                    if (!range) {
-                        throw new BugIndicatingError('custom view should have a range');
-                    }
-                    return new LineRange(range.startLineNumber, range.endLineNumber);
-                }
-                if (state.state?.kind === 'insertionMultiLine') {
-                    return this._insertion.originalLines.read(reader);
-                }
-                return state.edit.displayRange;
-            });
-            const modelWithGhostTextSupport = derived(this, reader => {
-                /** @description modelWithGhostTextSupport */
-                const model = this._model.read(reader);
-                if (model) {
-                    return model;
-                }
-                const ghostTextIndicator = this._ghostTextIndicator.read(reader);
-                if (ghostTextIndicator) {
-                    return ghostTextIndicator.model;
-                }
-                return model;
-            });
-            return reader.store.add(this._instantiationService.createInstance(InlineEditsGutterIndicator, this._editorObs, indicatorDisplayRange, this._gutterIndicatorOffset, modelWithGhostTextSupport, this._inlineEditsIsHovered, this._focusIsInMenu));
-        });
-        this._inlineEditsIsHovered = derived(this, reader => {
+        this.inlineEditsIsHovered = derived(this, reader => {
             return this._sideBySide.isHovered.read(reader)
                 || this._wordReplacementViews.read(reader).some(v => v.isHovered.read(reader))
                 || this._deletion.isHovered.read(reader)
                 || this._inlineDiffView.isHovered.read(reader)
                 || this._lineReplacementView.isHovered.read(reader)
                 || this._insertion.isHovered.read(reader)
-                || this._customView.isHovered.read(reader);
+                || this._customView.isHovered.read(reader)
+                || this._longDistanceHint.map((v, r) => v?.isHovered.read(r) ?? false).read(reader);
         });
-        this._gutterIndicatorOffset = derived(this, reader => {
+        this.gutterIndicatorOffset = derived(this, reader => {
             // TODO: have a better way to tell the gutter indicator view where the edit is inside a viewzone
             if (this._uiState.read(reader)?.state?.kind === 'insertionMultiLine') {
                 return this._insertion.startLineOffset.read(reader);
             }
-            const ghostTextIndicator = this._ghostTextIndicator.read(reader);
-            if (ghostTextIndicator) {
-                return getGhostTextTopOffset(ghostTextIndicator, this._editor);
-            }
             return 0;
         });
+        this._editorObs = observableCodeEditor(this._editor);
+        this._constructorDone = observableValue(this, false);
+        this._previewTextModel = this._register(this._instantiationService.createInstance(TextModel, '', this._editor.getModel().getLanguageId(), { ...TextModel.DEFAULT_CREATION_OPTIONS, bracketPairColorizationOptions: { enabled: true, independentColorPoolPerBracketType: false } }, null));
         this._sideBySide = this._register(this._instantiationService.createInstance(InlineEditsSideBySideView, this._editor, this._model.map(m => m?.inlineEdit), this._previewTextModel, this._uiState.map(s => s && s.state?.kind === InlineCompletionViewKind.SideBySide ? ({
             newTextLineCount: s.newTextLineCount,
             isInDiffEditor: s.isInDiffEditor,
@@ -169,6 +145,22 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
             text: s.state.text,
             inDiffEditor: s.isInDiffEditor,
         }) : undefined), this._tabAction));
+        this._inlineCollapsedView = this._register(this._instantiationService.createInstance(InlineEditsCollapsedView, this._editor, this._model.map((m, reader) => this._uiState.read(reader)?.state?.kind === 'collapsed' ? m?.inlineEdit : undefined)));
+        this._customView = this._register(this._instantiationService.createInstance(InlineEditsCustomView, this._editor, this._model.map((m, reader) => this._uiState.read(reader)?.state?.kind === 'custom' ? m?.displayLocation : undefined), this._tabAction));
+        this._showLongDistanceHint = this._editorObs.getOption(71 /* EditorOption.inlineSuggest */).map(this, s => s.edits.showLongDistanceHint);
+        this._longDistanceHint = derived(this, reader => {
+            if (!this._showLongDistanceHint.read(reader)) {
+                return undefined;
+            }
+            return reader.store.add(this._instantiationService.createInstance(InlineEditsLongDistanceHint, this._editor, this._uiState.map((s, reader) => s?.longDistanceHint ? ({
+                hint: s.longDistanceHint,
+                newTextLineCount: s.newTextLineCount,
+                edit: s.edit,
+                diff: s.diff,
+                model: this._simpleModel.read(reader),
+                suggestInfo: this._suggestInfo.read(reader),
+            }) : undefined), this._previewTextModel, this._tabAction));
+        }).recomputeInitiallyAndOnChange(this._store);
         this._inlineDiffViewState = derived(this, reader => {
             const e = this._uiState.read(reader);
             if (!e || !e.state) {
@@ -185,10 +177,14 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
                 isInDiffEditor: e.isInDiffEditor,
             };
         });
-        this._inlineCollapsedView = this._register(this._instantiationService.createInstance(InlineEditsCollapsedView, this._editor, this._model.map((m, reader) => this._uiState.read(reader)?.state?.kind === 'collapsed' ? m?.inlineEdit : undefined)));
-        this._customView = this._register(this._instantiationService.createInstance(InlineEditsCustomView, this._editor, this._model.map((m, reader) => this._uiState.read(reader)?.state?.kind === 'custom' ? m?.displayLocation : undefined), this._tabAction));
         this._inlineDiffView = this._register(new OriginalEditorInlineDiffView(this._editor, this._inlineDiffViewState, this._previewTextModel));
-        this._wordReplacementViews = mapObservableArrayCached(this, this._uiState.map(s => s?.state?.kind === 'wordReplacements' ? s.state.replacements : []), (e, store) => {
+        const wordReplacements = derivedOpts({
+            equalsFn: itemsEquals(itemEquals())
+        }, reader => {
+            const s = this._uiState.read(reader);
+            return s?.state?.kind === 'wordReplacements' ? s.state.replacements : [];
+        });
+        this._wordReplacementViews = mapObservableArrayCached(this, wordReplacements, (e, store) => {
             return store.add(this._instantiationService.createInstance(InlineEditsWordReplacementView, this._editorObs, e, this._tabAction));
         });
         this._lineReplacementView = this._register(this._instantiationService.createInstance(InlineEditsLineReplacementView, this._editorObs, this._uiState.map(s => s?.state?.kind === InlineCompletionViewKind.LineReplacement ? ({
@@ -199,33 +195,33 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
         }) : undefined), this._uiState.map(s => s?.isInDiffEditor ?? false), this._tabAction));
         this._useCodeShifting = this._editorObs.getOption(71 /* EditorOption.inlineSuggest */).map(s => s.edits.allowCodeShifting);
         this._renderSideBySide = this._editorObs.getOption(71 /* EditorOption.inlineSuggest */).map(s => s.edits.renderSideBySide);
-        this._register(autorunWithStore((reader, store) => {
+        this._register(autorun((reader) => {
             const model = this._model.read(reader);
             if (!model) {
                 return;
             }
-            store.add(Event.any(this._sideBySide.onDidClick, this._deletion.onDidClick, this._lineReplacementView.onDidClick, this._insertion.onDidClick, ...this._wordReplacementViews.read(reader).map(w => w.onDidClick), this._inlineDiffView.onDidClick, this._customView.onDidClick)(e => {
+            reader.store.add(Event.any(this._sideBySide.onDidClick, this._deletion.onDidClick, this._lineReplacementView.onDidClick, this._insertion.onDidClick, ...this._wordReplacementViews.read(reader).map(w => w.onDidClick), this._inlineDiffView.onDidClick, this._customView.onDidClick)(e => {
                 if (this._viewHasBeenShownLongerThan(350)) {
                     e.preventDefault();
                     model.accept();
                 }
             }));
         }));
-        this._indicator.recomputeInitiallyAndOnChange(this._store);
         this._wordReplacementViews.recomputeInitiallyAndOnChange(this._store);
-        this._indicatorCyclicDependencyCircuitBreaker.set(true, undefined);
-        this._register(this._instantiationService.createInstance(InlineEditsOnboardingExperience, this._host, this._model, this._indicator, this._inlineCollapsedView));
         const minEditorScrollHeight = derived(this, reader => {
             return Math.max(...this._wordReplacementViews.read(reader).map(v => v.minEditorScrollHeight.read(reader)), this._lineReplacementView.minEditorScrollHeight.read(reader), this._customView.minEditorScrollHeight.read(reader));
         }).recomputeInitiallyAndOnChange(this._store);
-        const textModel = this._editor.getModel();
         let viewZoneId;
         this._register(autorun(reader => {
             const minScrollHeight = minEditorScrollHeight.read(reader);
+            const textModel = this._editorObs.model.read(reader);
+            if (!textModel) {
+                return;
+            }
             this._editor.changeViewZones(accessor => {
                 const scrollHeight = this._editor.getScrollHeight();
                 const viewZoneHeight = minScrollHeight - scrollHeight + 1 /* Add 1px so there is a small gap */;
-                if (viewZoneHeight !== 0 && viewZoneId) {
+                if (viewZoneHeight !== 0 && viewZoneId !== undefined) {
                     accessor.removeZone(viewZoneId);
                     viewZoneId = undefined;
                 }
@@ -241,13 +237,28 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
         }));
         this._constructorDone.set(true, undefined); // TODO: remove and use correct initialization order
     }
-    getCacheId(model) {
+    _getLongDistanceHintState(model, reader) {
+        if (model.inlineEdit.inlineCompletion.identity.jumpedTo.read(reader)) {
+            return undefined;
+        }
+        if (this._currentInlineEditCache?.inlineSuggestionIdentity !== model.inlineEdit.inlineCompletion.identity) {
+            this._currentInlineEditCache = {
+                inlineSuggestionIdentity: model.inlineEdit.inlineCompletion.identity,
+                firstCursorLineNumber: model.inlineEdit.cursorPosition.lineNumber,
+            };
+        }
+        return {
+            lineNumber: this._currentInlineEditCache.firstCursorLineNumber,
+            isVisible: !model.inViewPort.read(reader),
+        };
+    }
+    _getCacheId(model) {
         return model.inlineEdit.inlineCompletion.identity.id;
     }
-    determineView(model, reader, diff, newText) {
+    _determineView(model, reader, diff, newText) {
         // Check if we can use the previous view if it is the same InlineCompletion as previously shown
         const inlineEdit = model.inlineEdit;
-        const canUseCache = this._previousView?.id === this.getCacheId(model) && !model.displayLocation?.jumpToEdit;
+        const canUseCache = this._previousView?.id === this._getCacheId(model);
         const reconsiderViewEditorWidthChange = this._previousView?.editorWidth !== this._editorObs.layoutInfoWidth.read(reader) &&
             (this._previousView?.view === InlineCompletionViewKind.SideBySide ||
                 this._previousView?.view === InlineCompletionViewKind.LineReplacement);
@@ -315,9 +326,9 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
         }
         return InlineCompletionViewKind.SideBySide;
     }
-    determineRenderState(model, reader, diff, newText) {
+    _determineRenderState(model, reader, diff, newText) {
         const inlineEdit = model.inlineEdit;
-        let view = this.determineView(model, reader, diff, newText);
+        let view = this._determineView(model, reader, diff, newText);
         if (this._willRenderAboveCursor(reader, inlineEdit, view)) {
             switch (view) {
                 case InlineCompletionViewKind.LineReplacement:
@@ -326,7 +337,7 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
                     break;
             }
         }
-        this._previousView = { id: this.getCacheId(model), view, editorWidth: this._editor.getLayoutInfo().width, timestamp: Date.now() };
+        this._previousView = { id: this._getCacheId(model), view, editorWidth: this._editor.getLayoutInfo().width, timestamp: Date.now() };
         const inner = diff.flatMap(d => d.innerChanges ?? []);
         const textModel = this._editor.getModel();
         const stringChanges = inner.map(m => ({
@@ -335,18 +346,7 @@ let InlineEditsView = InlineEditsView_1 = class InlineEditsView extends Disposab
             original: textModel.getValueInRange(m.originalRange),
             modified: newText.getValueOfRange(m.modifiedRange)
         }));
-        const cursorPosition = inlineEdit.cursorPosition;
-        const startsWithEOL = stringChanges.length === 0 ? false : stringChanges[0].modified.startsWith(textModel.getEOL());
-        const viewData = {
-            cursorColumnDistance: inlineEdit.edit.replacements.length === 0 ? 0 : inlineEdit.edit.replacements[0].range.getStartPosition().column - cursorPosition.column,
-            cursorLineDistance: inlineEdit.lineEdit.lineRange.startLineNumber - cursorPosition.lineNumber + (startsWithEOL && inlineEdit.lineEdit.lineRange.startLineNumber >= cursorPosition.lineNumber ? 1 : 0),
-            lineCountOriginal: inlineEdit.lineEdit.lineRange.length,
-            lineCountModified: inlineEdit.lineEdit.newLines.length,
-            characterCountOriginal: stringChanges.reduce((acc, r) => acc + r.original.length, 0),
-            characterCountModified: stringChanges.reduce((acc, r) => acc + r.modified.length, 0),
-            disjointReplacements: stringChanges.length,
-            sameShapeReplacements: stringChanges.every(r => r.original === stringChanges[0].original && r.modified === stringChanges[0].modified),
-        };
+        const viewData = getViewData(inlineEdit, stringChanges, textModel);
         switch (view) {
             case InlineCompletionViewKind.InsertionInline: return { kind: InlineCompletionViewKind.InsertionInline, viewData };
             case InlineCompletionViewKind.SideBySide: return { kind: InlineCompletionViewKind.SideBySide, viewData };
@@ -429,6 +429,21 @@ InlineEditsView = InlineEditsView_1 = __decorate([
     __param(5, IInstantiationService)
 ], InlineEditsView);
 export { InlineEditsView };
+function getViewData(inlineEdit, stringChanges, textModel) {
+    const cursorPosition = inlineEdit.cursorPosition;
+    const startsWithEOL = stringChanges.length === 0 ? false : stringChanges[0].modified.startsWith(textModel.getEOL());
+    const viewData = {
+        cursorColumnDistance: inlineEdit.edit.replacements.length === 0 ? 0 : inlineEdit.edit.replacements[0].range.getStartPosition().column - cursorPosition.column,
+        cursorLineDistance: inlineEdit.lineEdit.lineRange.startLineNumber - cursorPosition.lineNumber + (startsWithEOL && inlineEdit.lineEdit.lineRange.startLineNumber >= cursorPosition.lineNumber ? 1 : 0),
+        lineCountOriginal: inlineEdit.lineEdit.lineRange.length,
+        lineCountModified: inlineEdit.lineEdit.newLines.length,
+        characterCountOriginal: stringChanges.reduce((acc, r) => acc + r.original.length, 0),
+        characterCountModified: stringChanges.reduce((acc, r) => acc + r.modified.length, 0),
+        disjointReplacements: stringChanges.length,
+        sameShapeReplacements: stringChanges.every(r => r.original === stringChanges[0].original && r.modified === stringChanges[0].modified),
+    };
+    return viewData;
+}
 function isSingleLineInsertion(diff) {
     return diff.every(m => m.innerChanges.every(r => isWordInsertion(r)));
     function isWordInsertion(r) {
@@ -525,33 +540,4 @@ function _growEdits(replacements, originalText, fn) {
     }
     return result;
 }
-function getGhostTextTopOffset(ghostTextIndicator, editor) {
-    const replacements = ghostTextIndicator.model.inlineEdit.edit.replacements;
-    if (replacements.length !== 1) {
-        return 0;
-    }
-    const textModel = editor.getModel();
-    if (!textModel) {
-        return 0;
-    }
-    const EOL = textModel.getEOL();
-    const replacement = replacements[0];
-    if (replacement.range.isEmpty() && replacement.text.startsWith(EOL)) {
-        const lineHeight = editor.getLineHeightForPosition(replacement.range.getStartPosition());
-        return countPrefixRepeats(replacement.text, EOL) * lineHeight;
-    }
-    return 0;
-}
-function countPrefixRepeats(str, prefix) {
-    if (!prefix.length) {
-        return 0;
-    }
-    let count = 0;
-    let i = 0;
-    while (str.startsWith(prefix, i)) {
-        count++;
-        i += prefix.length;
-    }
-    return count;
-}
 //# sourceMappingURL=inlineEditsView.js.map