@codingame/monaco-vscode-api 16.1.1 → 17.1.0

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

@@ -0,0 +1,157 @@
+
+import { __decorate, __param } from '../../../../../../../../../external/tslib/tslib.es6.js';
+import { timeout } from '../../../../../../base/common/async.js';
+import { BugIndicatingError } from '../../../../../../base/common/errors.js';
+import { Disposable, MutableDisposable, DisposableStore } from '../../../../../../base/common/lifecycle.js';
+import '../../../../../../base/common/observableInternal/index.js';
+import { IConfigurationService } from '../../../../../../platform/configuration/common/configuration.service.js';
+import { StorageScope, StorageTarget } from '../../../../../../platform/storage/common/storage.js';
+import { IStorageService } from '../../../../../../platform/storage/common/storage.service.js';
+import { runOnChangeWithCancellationToken, runOnChange } from '../../../../../../base/common/observableInternal/utils.js';
+import { observableValue } from '../../../../../../base/common/observableInternal/base.js';
+import { derived } from '../../../../../../base/common/observableInternal/derived.js';
+import { autorun, autorunWithStore } from '../../../../../../base/common/observableInternal/autorun.js';
+
+var UserKind;
+(function (UserKind) {
+    UserKind["FirstTime"] = "firstTime";
+    UserKind["SecondTime"] = "secondTime";
+    UserKind["Active"] = "active";
+})(UserKind || (UserKind = {}));
+let InlineEditsOnboardingExperience = class InlineEditsOnboardingExperience extends Disposable {
+    constructor(_host, _model, _indicator, _collapsedView, _storageService, _configurationService) {
+        super();
+        this._host = _host;
+        this._model = _model;
+        this._indicator = _indicator;
+        this._collapsedView = _collapsedView;
+        this._storageService = _storageService;
+        this._configurationService = _configurationService;
+        this._disposables = this._register(( new MutableDisposable()));
+        this._setupDone = observableValue({ name: 'setupDone' }, false);
+        this._activeCompletionId = derived(reader => {
+            const model = this._model.read(reader);
+            if (!model) {
+                return undefined;
+            }
+            if (!this._setupDone.read(reader)) {
+                return undefined;
+            }
+            const indicator = this._indicator.read(reader);
+            if (!indicator || !indicator.isVisible.read(reader)) {
+                return undefined;
+            }
+            return model.inlineEdit.inlineCompletion.identity.id;
+        });
+        this._register(this._initializeDebugSetting());
+        this._disposables.value = this.setupNewUserExperience();
+        this._setupDone.set(true, undefined);
+    }
+    setupNewUserExperience() {
+        if (this.getNewUserType() === UserKind.Active) {
+            return undefined;
+        }
+        const disposableStore = ( new DisposableStore());
+        let userHasHoveredOverIcon = false;
+        let inlineEditHasBeenAccepted = false;
+        let firstTimeUserAnimationCount = 0;
+        let secondTimeUserAnimationCount = 0;
+        disposableStore.add(runOnChangeWithCancellationToken(this._activeCompletionId, async (id, _, __, token) => {
+            if (id === undefined) {
+                return;
+            }
+            let userType = this.getNewUserType();
+            switch (userType) {
+                case UserKind.FirstTime: {
+                    if (firstTimeUserAnimationCount++ >= 5 || userHasHoveredOverIcon) {
+                        userType = UserKind.SecondTime;
+                        this.setNewUserType(userType);
+                    }
+                    break;
+                }
+                case UserKind.SecondTime: {
+                    if (secondTimeUserAnimationCount++ >= 3 && inlineEditHasBeenAccepted) {
+                        userType = UserKind.Active;
+                        this.setNewUserType(userType);
+                    }
+                    break;
+                }
+            }
+            switch (userType) {
+                case UserKind.FirstTime: {
+                    for (let i = 0; i < 3 && !token.isCancellationRequested; i++) {
+                        await this._indicator.get()?.triggerAnimation();
+                        await timeout(500);
+                    }
+                    break;
+                }
+                case UserKind.SecondTime: {
+                    this._indicator.get()?.triggerAnimation();
+                    break;
+                }
+            }
+        }));
+        disposableStore.add(autorun(reader => {
+            if (this._collapsedView.isVisible.read(reader)) {
+                if (this.getNewUserType() !== UserKind.Active) {
+                    this._collapsedView.triggerAnimation();
+                }
+            }
+        }));
+        disposableStore.add(autorunWithStore((reader, store) => {
+            const indicator = this._indicator.read(reader);
+            if (!indicator) {
+                return;
+            }
+            store.add(runOnChange(indicator.isHoveredOverIcon, async (isHovered) => {
+                if (isHovered) {
+                    userHasHoveredOverIcon = true;
+                }
+            }));
+        }));
+        disposableStore.add(autorunWithStore((reader, store) => {
+            const host = this._host.read(reader);
+            if (!host) {
+                return;
+            }
+            store.add(host.onDidAccept(() => {
+                inlineEditHasBeenAccepted = true;
+            }));
+        }));
+        return disposableStore;
+    }
+    getNewUserType() {
+        return this._storageService.get('inlineEditsGutterIndicatorUserKind', StorageScope.APPLICATION, UserKind.FirstTime);
+    }
+    setNewUserType(value) {
+        switch (value) {
+            case UserKind.FirstTime:
+                throw ( new BugIndicatingError('UserKind should not be set to first time'));
+            case UserKind.SecondTime:
+                break;
+            case UserKind.Active:
+                this._disposables.clear();
+                break;
+        }
+        this._storageService.store('inlineEditsGutterIndicatorUserKind', value, StorageScope.APPLICATION, StorageTarget.USER);
+    }
+    _initializeDebugSetting() {
+        const hiddenDebugSetting = 'editor.inlineSuggest.edits.resetNewUserExperience';
+        if (this._configurationService.getValue(hiddenDebugSetting)) {
+            this._storageService.remove('inlineEditsGutterIndicatorUserKind', StorageScope.APPLICATION);
+        }
+        const disposable = this._configurationService.onDidChangeConfiguration(e => {
+            if (e.affectsConfiguration(hiddenDebugSetting) && this._configurationService.getValue(hiddenDebugSetting)) {
+                this._storageService.remove('inlineEditsGutterIndicatorUserKind', StorageScope.APPLICATION);
+                this._disposables.value = this.setupNewUserExperience();
+            }
+        });
+        return disposable;
+    }
+};
+InlineEditsOnboardingExperience = ( __decorate([
+    ( __param(4, IStorageService)),
+    ( __param(5, IConfigurationService))
+], InlineEditsOnboardingExperience));
+
+export { InlineEditsOnboardingExperience };

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

@@ -5,6 +5,7 @@ import { ICodeEditor } from "../../../../../browser/editorBrowser.js";
 import { InlineEditsGutterIndicator } from "./components/gutterIndicatorView.js";
 import { GhostTextIndicator, InlineEditHost, InlineEditModel } from "./inlineEditsModel.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";
@@ -36,6 +37,7 @@ export declare class InlineEditsView extends Disposable {
     protected readonly _insertion: InlineEditsInsertionView;
     private readonly _inlineDiffViewState;
     protected readonly _inlineCollapsedView: InlineEditsCollapsedView;
+    protected readonly _customView: InlineEditsCustomView;
     protected readonly _inlineDiffView: OriginalEditorInlineDiffView;
     protected readonly _wordReplacementViews: IObservable<readonly InlineEditsWordReplacementView[]>;
     protected readonly _lineReplacementView: InlineEditsLineReplacementView;

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

@@ -16,8 +16,10 @@ import { TextLength } from '../../../../../common/core/textLength.js';
 import { RangeMapping, lineRangeMappingFromRangeMappings } from '../../../../../common/diff/rangeMapping.js';
 import { TextModel } from '../../../../../common/model/textModel.js';
 import { InlineEditsGutterIndicator } from './components/gutterIndicatorView.js';
+import { InlineEditsOnboardingExperience } from './inlineEditsNewUsers.js';
 import { 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';
@@ -26,9 +28,9 @@ import { InlineEditsWordReplacementView } from './inlineEditsViews/inlineEditsWo
 import { OriginalEditorInlineDiffView } from './inlineEditsViews/originalEditorInlineDiffView.js';
 import { createReindentEdit, applyEditToModifiedRangeMappings } from './utils/utils.js';
 import * as view from './view.css';
-import { mapObservableArrayCached } from '../../../../../../base/common/observableInternal/utils.js';
 import { derived, derivedWithStore, derivedOpts } from '../../../../../../base/common/observableInternal/derived.js';
 import { observableValue } from '../../../../../../base/common/observableInternal/base.js';
+import { mapObservableArrayCached } from '../../../../../../base/common/observableInternal/utils.js';
 import { autorunWithStore } from '../../../../../../base/common/observableInternal/autorun.js';
 
 registerCss(view);
@@ -54,8 +56,7 @@ let InlineEditsView = class InlineEditsView extends Disposable {
             let mappings = RangeMapping.fromEdit(inlineEdit.edit);
             let newText = inlineEdit.edit.apply(inlineEdit.originalText);
             let diff = lineRangeMappingFromRangeMappings(mappings, inlineEdit.originalText, ( new StringText(newText)));
-            const originalDisplayRange = inlineEdit.originalText.lineRange.intersect(inlineEdit.originalLineRange.join(LineRange.ofLength(inlineEdit.originalLineRange.startLineNumber, inlineEdit.lineEdit.newLines.length)));
-            let state = this.determineRenderState(model, reader, diff, ( new StringText(newText)), originalDisplayRange);
+            let state = this.determineRenderState(model, reader, diff, ( new StringText(newText)));
             if (!state) {
                 model.abort(`unable to determine view: tried to render ${this._previousView?.view}`);
                 return undefined;
@@ -80,7 +81,6 @@ let InlineEditsView = class InlineEditsView extends Disposable {
                 edit: inlineEdit,
                 newText,
                 newTextLineCount: inlineEdit.modifiedLineRange.length,
-                originalDisplayRange: originalDisplayRange,
             };
         });
         this._previewTextModel = this._register(this._instantiationService.createInstance(TextModel, '', this._editor.getModel().getLanguageId(), { ...TextModel.DEFAULT_CREATION_OPTIONS, bracketPairColorizationOptions: { enabled: true, independentColorPoolPerBracketType: false } }, null));
@@ -95,10 +95,20 @@ let InlineEditsView = class InlineEditsView extends Disposable {
                     return ghostTextIndicator.lineRange;
                 }
                 const state = this._uiState.read(reader);
-                if (state?.state?.kind === 'insertionMultiLine') {
+                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?.originalDisplayRange;
+                return state.edit.displayRange;
             });
             const modelWithGhostTextSupport = derived(this, reader => {
                 const model = this._model.read(reader);
@@ -111,7 +121,7 @@ let InlineEditsView = class InlineEditsView extends Disposable {
                 }
                 return model;
             });
-            return store.add(this._instantiationService.createInstance(InlineEditsGutterIndicator, this._editorObs, indicatorDisplayRange, this._gutterIndicatorOffset, this._host, modelWithGhostTextSupport, this._inlineEditsIsHovered, this._focusIsInMenu));
+            return store.add(this._instantiationService.createInstance(InlineEditsGutterIndicator, this._editorObs, indicatorDisplayRange, this._gutterIndicatorOffset, modelWithGhostTextSupport, this._inlineEditsIsHovered, this._focusIsInMenu));
         });
         this._inlineEditsIsHovered = derived(this, reader => {
             return this._sideBySide.isHovered.read(reader)
@@ -119,7 +129,8 @@ let InlineEditsView = class InlineEditsView extends Disposable {
                 || this._deletion.isHovered.read(reader)
                 || this._inlineDiffView.isHovered.read(reader)
                 || this._lineReplacementView.isHovered.read(reader)
-                || this._insertion.isHovered.read(reader);
+                || this._insertion.isHovered.read(reader)
+                || this._customView.isHovered.read(reader);
         });
         this._gutterIndicatorOffset = derived(this, reader => {
             if (this._uiState.read(reader)?.state?.kind === 'insertionMultiLine') {
@@ -129,7 +140,6 @@ let InlineEditsView = class InlineEditsView extends Disposable {
         });
         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 === 'sideBySide' ? ({
             newTextLineCount: s.newTextLineCount,
-            originalDisplayRange: s.originalDisplayRange,
         }) : undefined)), this._tabAction));
         this._deletion = this._register(this._instantiationService.createInstance(InlineEditsDeletionView, this._editor, ( this._model.map(m => m?.inlineEdit)), ( this._uiState.map(s => s && s.state?.kind === 'deletion' ? ({
             originalRange: s.state.originalRange,
@@ -145,7 +155,7 @@ let InlineEditsView = class InlineEditsView extends Disposable {
             if (!e || !e.state) {
                 return undefined;
             }
-            if (e.state.kind === 'wordReplacements' || e.state.kind === 'lineReplacement' || e.state.kind === 'insertionMultiLine' || e.state.kind === 'collapsed') {
+            if (e.state.kind === 'wordReplacements' || e.state.kind === 'lineReplacement' || e.state.kind === 'insertionMultiLine' || e.state.kind === 'collapsed' || e.state.kind === 'custom') {
                 return undefined;
             }
             return {
@@ -158,6 +168,9 @@ let InlineEditsView = class InlineEditsView extends Disposable {
         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) => {
             return store.add(this._instantiationService.createInstance(InlineEditsWordReplacementView, this._editorObs, e, this._tabAction));
@@ -176,7 +189,7 @@ let InlineEditsView = class InlineEditsView extends Disposable {
             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)(e => {
+            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();
@@ -186,16 +199,13 @@ let InlineEditsView = class InlineEditsView extends Disposable {
         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));
         this._constructorDone.set(true, undefined);
     }
     getCacheId(model) {
-        const inlineEdit = model.inlineEdit;
-        if (this._host.get()?.inPartialAcceptFlow.get()) {
-            return `${inlineEdit.inlineCompletion.id}_${( inlineEdit.edit.edits.map(innerEdit => ( innerEdit.range.toString()) + innerEdit.text)).join(',')}`;
-        }
-        return inlineEdit.inlineCompletion.id;
+        return model.inlineEdit.inlineCompletion.identity.id;
     }
-    determineView(model, reader, diff, newText, originalDisplayRange) {
+    determineView(model, reader, diff, newText) {
         const inlineEdit = model.inlineEdit;
         const canUseCache = this._previousView?.id === this.getCacheId(model);
         const reconsiderViewEditorWidthChange = this._previousView?.editorWidth !== this._editorObs.layoutInfoWidth.read(reader) &&
@@ -204,6 +214,9 @@ let InlineEditsView = class InlineEditsView extends Disposable {
         if (canUseCache && !reconsiderViewEditorWidthChange) {
             return this._previousView.view;
         }
+        if (model.displayLocation) {
+            return 'custom';
+        }
         const inner = diff.flatMap(d => d.innerChanges ?? []);
         const isSingleInnerEdit = inner.length === 1;
         if (isSingleInnerEdit
@@ -232,18 +245,22 @@ let InlineEditsView = class InlineEditsView extends Disposable {
             }
         }
         if (numOriginalLines > 0 && numModifiedLines > 0) {
-            if (this._renderSideBySide.read(reader) !== 'never' && InlineEditsSideBySideView.fitsInsideViewport(this._editor, this._previewTextModel, inlineEdit, originalDisplayRange, reader)) {
+            if (numOriginalLines === 1 && numModifiedLines === 1) {
+                return 'lineReplacement';
+            }
+            if (this._renderSideBySide.read(reader) !== 'never' && InlineEditsSideBySideView.fitsInsideViewport(this._editor, this._previewTextModel, inlineEdit, reader)) {
                 return 'sideBySide';
             }
             return 'lineReplacement';
         }
         return 'sideBySide';
     }
-    determineRenderState(model, reader, diff, newText, originalDisplayRange) {
+    determineRenderState(model, reader, diff, newText) {
         const inlineEdit = model.inlineEdit;
-        const view = this.determineView(model, reader, diff, newText, originalDisplayRange);
+        const view = this.determineView(model, reader, diff, newText);
         this._previousView = { id: this.getCacheId(model), view, editorWidth: this._editor.getLayoutInfo().width, timestamp: Date.now() };
         switch (view) {
+            case 'custom': return { kind: 'custom', displayLocation: model.displayLocation };
             case 'insertionInline': return { kind: 'insertionInline' };
             case 'sideBySide': return { kind: 'sideBySide' };
             case 'collapsed': return { kind: 'collapsed' };

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

@@ -1,7 +1,7 @@
 import { IMouseEvent } from "../../../../../../base/browser/mouseEvent.js";
 import { Event } from "../../../../../../base/common/event.js";
 import { IObservable } from "../../../../../../base/common/observable.js";
-import { Command } from "../../../../../common/languages.js";
+import { Command, InlineCompletionDisplayLocation } from "../../../../../common/languages.js";
 import { InlineEditWithChanges } from "./inlineEditWithChanges.js";
 export declare enum InlineEditTabAction {
     Jump = "jump",
@@ -13,8 +13,8 @@ export interface IInlineEditsView {
     onDidClick: Event<IMouseEvent>;
 }
 export interface IInlineEditHost {
+    readonly onDidAccept: Event<void>;
     inAcceptFlow: IObservable<boolean>;
-    inPartialAcceptFlow: IObservable<boolean>;
 }
 export interface IInlineEditModel {
     displayName: string;
@@ -23,6 +23,7 @@ export interface IInlineEditModel {
     inlineEdit: InlineEditWithChanges;
     tabAction: IObservable<InlineEditTabAction>;
     showCollapsed: IObservable<boolean>;
+    displayLocation: InlineCompletionDisplayLocation | undefined;
     handleInlineEditShown(): void;
     accept(): void;
     jump(): void;

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

@@ -38,12 +38,11 @@ let InlineEditsViewAndDiffProducer = class InlineEditsViewAndDiffProducer extend
             if (!textModel) {
                 return undefined;
             }
-            const editOffset = model.inlineEditState.get()?.inlineCompletion.updatedEdit.read(reader);
+            const editOffset = model.inlineEditState.get()?.inlineCompletion.updatedEdit;
             if (!editOffset) {
                 return undefined;
             }
-            const offsetEdits = model.inPartialAcceptFlow.read(reader) ? [editOffset.edits[0]] : editOffset.edits;
-            const edits = ( offsetEdits.map(e => {
+            const edits = ( editOffset.edits.map(e => {
                 const innerEditRange = Range.fromPositions(textModel.getPositionAt(e.replaceRange.start), textModel.getPositionAt(e.replaceRange.endExclusive));
                 return ( new SingleTextEdit(innerEditRange, e.newText));
             }));
@@ -99,7 +98,7 @@ let InlineEditsViewAndDiffProducer = class InlineEditsViewAndDiffProducer extend
             if (!inlineCompletion) {
                 return undefined;
             }
-            if (!inlineCompletion.sourceInlineCompletion.showInlineEditMenu) {
+            if (!inlineCompletion.showInlineEditMenu) {
                 return undefined;
             }
             const lineRange = LineRange.ofLength(state.primaryGhostText.lineNumber, 1);

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

@@ -1,16 +1,21 @@
 import { IMouseEvent } from "../../../../../../../base/browser/mouseEvent.js";
 import { Disposable } from "../../../../../../../base/common/lifecycle.js";
 import { IObservable } from "../../../../../../../base/common/observable.js";
+import { IAccessibilityService } from "../../../../../../../platform/accessibility/common/accessibility.service.js";
 import { ICodeEditor } from "../../../../../../browser/editorBrowser.js";
 import { IInlineEditsView } from "../inlineEditsViewInterface.js";
 import { InlineEditWithChanges } from "../inlineEditWithChanges.js";
 export declare class InlineEditsCollapsedView extends Disposable implements IInlineEditsView {
     private readonly _editor;
     private readonly _edit;
+    private readonly _accessibilityService;
     private readonly _onDidClick;
     readonly onDidClick: import("../../../../../../../base/common/event.js").Event<IMouseEvent>;
     private readonly _editorObs;
-    constructor(_editor: ICodeEditor, _edit: IObservable<InlineEditWithChanges | undefined>);
+    private readonly _iconRef;
+    readonly isVisible: IObservable<boolean>;
+    constructor(_editor: ICodeEditor, _edit: IObservable<InlineEditWithChanges | undefined>, _accessibilityService: IAccessibilityService);
+    triggerAnimation(): Promise<Animation>;
     private getCollapsedIndicator;
     private createIconPath;
     readonly isHovered: IObservable<boolean>;

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

@@ -1,25 +1,29 @@
 
+import { __decorate, __param } from '../../../../../../../../../../external/tslib/tslib.es6.js';
 import '../../../../../../../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 { IAccessibilityService } from '../../../../../../../platform/accessibility/common/accessibility.service.js';
 import { asCssVariable } from '../../../../../../../platform/theme/common/colorUtils.js';
 import { observableCodeEditor } from '../../../../../../browser/observableCodeEditor.js';
 import { Point } from '../../../../../../browser/point.js';
 import { singleTextRemoveCommonPrefix } from '../../../model/singleTextEditHelpers.js';
 import { inlineEditIndicatorPrimaryBorder } from '../theme.js';
 import { PathBuilder } from '../utils/utils.js';
-import { constObservable } from '../../../../../../../base/common/observableInternal/utils.js';
 import { n } from '../../../../../../../base/browser/domImpl/n.js';
+import { constObservable } from '../../../../../../../base/common/observableInternal/utils.js';
 import { derived } from '../../../../../../../base/common/observableInternal/derived.js';
 
-class InlineEditsCollapsedView extends Disposable {
-    constructor(_editor, _edit) {
+let InlineEditsCollapsedView = class InlineEditsCollapsedView extends Disposable {
+    constructor(_editor, _edit, _accessibilityService) {
         super();
         this._editor = _editor;
         this._edit = _edit;
+        this._accessibilityService = _accessibilityService;
         this._onDidClick = this._register(( new Emitter()));
         this.onDidClick = this._onDidClick.event;
+        this._iconRef = n.ref();
         this.isHovered = constObservable(false);
         this._editorObs = observableCodeEditor(this._editor);
         const firstEdit = ( this._edit.map(inlineEdit => inlineEdit?.edit.edits[0] ?? null));
@@ -43,7 +47,6 @@ class InlineEditsCollapsedView extends Disposable {
                 overflow: 'visible',
                 top: '0px',
                 left: '0px',
-                zIndex: '0',
                 display: 'block',
             },
         }, [
@@ -55,6 +58,22 @@ class InlineEditsCollapsedView extends Disposable {
             allowEditorOverflow: false,
             minContentWidthInPx: constObservable(0),
         }));
+        this.isVisible = ( this._edit.map((inlineEdit, reader) => !!inlineEdit && startPoint.read(reader) !== null));
+    }
+    triggerAnimation() {
+        if (this._accessibilityService.isMotionReduced()) {
+            return ( new Animation(null, null)).finished;
+        }
+        const animation = this._iconRef.element.animate([
+            { offset: 0.00, transform: 'translateY(-3px)', },
+            { offset: 0.20, transform: 'translateY(1px)', },
+            { offset: 0.36, transform: 'translateY(-1px)', },
+            { offset: 0.52, transform: 'translateY(1px)', },
+            { offset: 0.68, transform: 'translateY(-1px)', },
+            { offset: 0.84, transform: 'translateY(1px)', },
+            { offset: 1.00, transform: 'translateY(0px)', },
+        ], { duration: 2000 });
+        return animation.finished;
     }
     getCollapsedIndicator(startPoint) {
         const contentLeft = this._editorObs.layoutInfoContentLeft;
@@ -62,6 +81,7 @@ class InlineEditsCollapsedView extends Disposable {
         const iconPath = this.createIconPath(startPointTranslated);
         return n.svg({
             class: 'collapsedView',
+            ref: this._iconRef,
             style: {
                 position: 'absolute',
                 top: 0,
@@ -102,6 +122,9 @@ class InlineEditsCollapsedView extends Disposable {
                 .build();
         }));
     }
-}
+};
+InlineEditsCollapsedView = ( __decorate([
+    ( __param(2, IAccessibilityService))
+], InlineEditsCollapsedView));
 
 export { InlineEditsCollapsedView };

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

@@ -0,0 +1,21 @@
+import { IMouseEvent } from "../../../../../../../base/browser/mouseEvent.js";
+import { Disposable } from "../../../../../../../base/common/lifecycle.js";
+import { IObservable } from "../../../../../../../base/common/observable.js";
+import { IThemeService } from "../../../../../../../platform/theme/common/themeService.service.js";
+import { ICodeEditor } from "../../../../../../browser/editorBrowser.js";
+import { InlineCompletionDisplayLocation } from "../../../../../../common/languages.js";
+import { ILanguageService } from "../../../../../../common/languages/language.service.js";
+import { IInlineEditsView, InlineEditTabAction } from "../inlineEditsViewInterface.js";
+export declare class InlineEditsCustomView extends Disposable implements IInlineEditsView {
+    private readonly _editor;
+    private readonly _languageService;
+    private readonly _onDidClick;
+    readonly onDidClick: import("../../../../../../../base/common/event.js").Event<IMouseEvent>;
+    private readonly _isHovered;
+    readonly isHovered: IObservable<boolean>;
+    private readonly _viewRef;
+    private readonly _editorObs;
+    constructor(_editor: ICodeEditor, displayLocation: IObservable<InlineCompletionDisplayLocation | undefined>, tabAction: IObservable<InlineEditTabAction>, themeService: IThemeService, _languageService: ILanguageService);
+    private getState;
+    private getRendering;
+}