@codingame/monaco-vscode-katex-common 25.1.2 → 26.0.0

package/vscode/src/vs/workbench/contrib/inlineChat/browser/inlineChatOverlayWidget.js

@@ -0,0 +1,416 @@
+
+import { registerCss } from '@codingame/monaco-vscode-api/css';
+import { __decorate, __param } from '@codingame/monaco-vscode-api/external/tslib/tslib.es6';
+import * as inlineChatOverlayWidget from './media/inlineChatOverlayWidget.css';
+import { $, append, addDisposableListener, trackFocus, isAncestorOfActiveElement, createElement, DisposableResizeObserver } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/dom';
+import { renderAsPlaintext } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/markdownRenderer';
+import { StandardKeyboardEvent } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/keyboardEvent';
+import { Separator } from '@codingame/monaco-vscode-api/vscode/vs/base/common/actions';
+import { ActionBar, ActionsOrientation } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/ui/actionbar/actionbar';
+import { Codicon } from '@codingame/monaco-vscode-api/vscode/vs/base/common/codicons';
+import { KeyCode } from '@codingame/monaco-vscode-api/vscode/vs/base/common/keyCodes';
+import { Disposable, DisposableStore, toDisposable } from '@codingame/monaco-vscode-api/vscode/vs/base/common/lifecycle';
+import '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/index';
+import { ThemeIcon } from '@codingame/monaco-vscode-api/vscode/vs/base/common/themables';
+import { URI } from '@codingame/monaco-vscode-api/vscode/vs/base/common/uri';
+import { EditorOption } from '@codingame/monaco-vscode-api/vscode/vs/editor/common/config/editorOptions';
+import { EditorExtensionsRegistry } from '@codingame/monaco-vscode-api/vscode/vs/editor/browser/editorExtensions';
+import { CodeEditorWidget } from '@codingame/monaco-vscode-api/vscode/vs/editor/browser/widget/codeEditor/codeEditorWidget';
+import { IModelService } from '@codingame/monaco-vscode-api/vscode/vs/editor/common/services/model.service';
+import { localize } from '@codingame/monaco-vscode-api/vscode/vs/nls';
+import { MenuWorkbenchToolBar, HiddenItemStrategy } from '@codingame/monaco-vscode-api/vscode/vs/platform/actions/browser/toolbar';
+import { MenuId } from '@codingame/monaco-vscode-api/vscode/vs/platform/actions/common/actions';
+import { IMenuService } from '@codingame/monaco-vscode-api/vscode/vs/platform/actions/common/actions.service';
+import { IContextKeyService } from '@codingame/monaco-vscode-api/vscode/vs/platform/contextkey/common/contextkey.service';
+import { IInstantiationService } from '@codingame/monaco-vscode-api/vscode/vs/platform/instantiation/common/instantiation';
+import { ChatEditingAcceptRejectActionViewItem } from '../../chat/browser/chatEditing/chatEditingEditorOverlay.js';
+import { ACTION_START } from '../common/inlineChat.js';
+import { StickyScrollController } from '@codingame/monaco-vscode-api/vscode/vs/editor/contrib/stickyScroll/browser/stickyScrollController';
+import { IKeybindingService } from '@codingame/monaco-vscode-api/vscode/vs/platform/keybinding/common/keybinding.service';
+import { getFlatActionBarActions } from '@codingame/monaco-vscode-api/vscode/vs/platform/actions/browser/menuEntryActionViewItem';
+import { IConfigurationService } from '@codingame/monaco-vscode-api/vscode/vs/platform/configuration/common/configuration.service';
+import { getSimpleEditorOptions } from '@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/codeEditor/browser/simpleEditorOptions';
+import { PlaceholderTextContribution } from '@codingame/monaco-vscode-api/vscode/vs/editor/contrib/placeholderText/browser/placeholderTextContribution';
+import { Position } from '@codingame/monaco-vscode-api/vscode/vs/editor/common/core/position';
+import { CancelChatActionId } from '../../chat/browser/actions/chatExecuteActions.js';
+import { assertType } from '@codingame/monaco-vscode-api/vscode/vs/base/common/types';
+import { observableValue } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/observableValue';
+import { observableFromEvent, observableFromEventOpts } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/observableFromEvent';
+import { constObservable } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/constObservable';
+import { autorun } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/reactions/autorun';
+import { derived } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/observables/derived';
+
+registerCss(inlineChatOverlayWidget);
+let InlineChatInputWidget = class InlineChatInputWidget extends Disposable {
+    constructor(
+        _editorObs,
+        _keybindingService,
+        _menuService,
+        _contextKeyService,
+        instantiationService,
+        modelService,
+        configurationService
+    ) {
+        super();
+        this._editorObs = _editorObs;
+        this._keybindingService = _keybindingService;
+        this._menuService = _menuService;
+        this._contextKeyService = _contextKeyService;
+        this._position = observableValue(this, null);
+        this.position = this._position;
+        this._showStore = this._store.add(( new DisposableStore()));
+        this._anchorLineNumber = 0;
+        this._anchorLeft = 0;
+        this._anchorAbove = false;
+        this._domNode = $(".inline-chat-gutter-menu");
+        this._inputContainer = append(this._domNode, $(".input"));
+        this._inputContainer.style.width = "200px";
+        this._inputContainer.style.height = "26px";
+        this._inputContainer.style.display = "flex";
+        this._inputContainer.style.alignItems = "center";
+        this._inputContainer.style.justifyContent = "center";
+        const options = getSimpleEditorOptions(configurationService);
+        options.wordWrap = "on";
+        options.lineNumbers = "off";
+        options.glyphMargin = false;
+        options.lineDecorationsWidth = 0;
+        options.lineNumbersMinChars = 0;
+        options.folding = false;
+        options.minimap = {
+            enabled: false
+        };
+        options.scrollbar = {
+            vertical: "auto",
+            horizontal: "hidden",
+            alwaysConsumeMouseWheel: true,
+            verticalSliderSize: 6
+        };
+        options.renderLineHighlight = "none";
+        const codeEditorWidgetOptions = {
+            isSimpleWidget: true,
+            contributions: EditorExtensionsRegistry.getSomeEditorContributions([PlaceholderTextContribution.ID])
+        };
+        this._input = this._store.add(
+            instantiationService.createInstance(CodeEditorWidget, this._inputContainer, options, codeEditorWidgetOptions)
+        );
+        const model = this._store.add(modelService.createModel("", null, ( URI.parse(`gutter-input:${Date.now()}`)), true));
+        this._input.setModel(model);
+        const stickyScrollController = StickyScrollController.get(this._editorObs.editor);
+        this._stickyScrollHeight = stickyScrollController ? observableFromEvent(
+            stickyScrollController.onDidChangeStickyScrollHeight,
+            () => stickyScrollController.stickyScrollWidgetHeight
+        ) : constObservable(0);
+        this._store.add(autorun(r => {
+            const selection = this._editorObs.cursorSelection.read(r);
+            const hasSelection = selection && !selection.isEmpty();
+            const placeholderText = hasSelection ? ( localize(8640, "Modify selected code")) : ( localize(8641, "Generate code"));
+            this._input.updateOptions({
+                placeholder: this._keybindingService.appendKeybinding(placeholderText, ACTION_START)
+            });
+        }));
+        this._store.add(this._input.onDidContentSizeChange(e => {
+            if (e.contentHeightChanged) {
+                this._updateInputHeight(e.contentHeight);
+            }
+        }));
+        this._store.add(this._input.onKeyDown(e => {
+            if (e.keyCode === KeyCode.Enter && !e.shiftKey) {
+                const value = this._input.getModel().getValue() ?? "";
+                if (this._inlineStartAction && value) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this._actionBar.actionRunner.run(this._inlineStartAction, {
+                        message: value,
+                        autoSend: true
+                    });
+                }
+            } else if (e.keyCode === KeyCode.Escape) {
+                const value = this._input.getModel().getValue() ?? "";
+                if (!value) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this._hide();
+                }
+            } else if (e.keyCode === KeyCode.DownArrow) {
+                const inputModel = this._input.getModel();
+                const position = this._input.getPosition();
+                const lastLineNumber = inputModel.getLineCount();
+                const lastLineMaxColumn = inputModel.getLineMaxColumn(lastLineNumber);
+                if (Position.equals(position, ( new Position(lastLineNumber, lastLineMaxColumn)))) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    this._actionBar.focus();
+                }
+            }
+        }));
+        this._actionBar = this._store.add(( new ActionBar(this._domNode, {
+            orientation: ActionsOrientation.VERTICAL,
+            preventLoopNavigation: true
+        })));
+        this._store.add(addDisposableListener(this._actionBar.domNode, "keydown", e => {
+            const event = ( new StandardKeyboardEvent(e));
+            if (event.equals(KeyCode.UpArrow) && this._actionBar.isFocused(
+                this._actionBar.viewItems.findIndex(item => item.action.id !== Separator.ID)
+            )) {
+                event.preventDefault();
+                event.stopPropagation();
+                this._input.focus();
+            }
+        }, true));
+        const focusTracker = this._store.add(trackFocus(this._domNode));
+        this._store.add(focusTracker.onDidBlur(() => this._hide()));
+        this._store.add(this._actionBar.onDidCancel(() => this._hide()));
+        this._store.add(this._actionBar.onWillRun(() => this._hide()));
+    }
+    show(lineNumber, left, anchorAbove) {
+        this._showStore.clear();
+        this._input.getModel().setValue("");
+        this._updateInputHeight(this._input.getContentHeight());
+        this._refreshActions();
+        this._anchorLineNumber = lineNumber;
+        this._anchorLeft = left;
+        this._anchorAbove = anchorAbove;
+        this._updatePosition();
+        this._showStore.add(this._editorObs.createOverlayWidget({
+            domNode: this._domNode,
+            position: this._position,
+            minContentWidthInPx: constObservable(0),
+            allowEditorOverflow: true
+        }));
+        if (anchorAbove) {
+            this._updatePosition();
+        }
+        this._showStore.add(this._editorObs.editor.onDidScrollChange(() => {
+            const visibleRanges = this._editorObs.editor.getVisibleRanges();
+            const isLineVisible = ( visibleRanges.some(
+                range => this._anchorLineNumber >= range.startLineNumber && this._anchorLineNumber <= range.endLineNumber
+            ));
+            const hasContent = !!this._input.getModel().getValue();
+            if (!isLineVisible && !hasContent) {
+                this._hide();
+            } else {
+                this._updatePosition();
+            }
+        }));
+        setTimeout(() => this._input.focus(), 0);
+    }
+    _updatePosition() {
+        const editor = this._editorObs.editor;
+        const lineHeight = editor.getOption(EditorOption.lineHeight);
+        const top = editor.getTopForLineNumber(this._anchorLineNumber) - editor.getScrollTop();
+        let adjustedTop = top;
+        if (this._anchorAbove) {
+            const widgetHeight = this._domNode.offsetHeight;
+            adjustedTop = top - widgetHeight;
+        } else {
+            adjustedTop = top + lineHeight;
+        }
+        const stickyScrollHeight = this._stickyScrollHeight.get();
+        const layoutInfo = editor.getLayoutInfo();
+        const widgetHeight = this._domNode.offsetHeight;
+        const minTop = stickyScrollHeight;
+        const maxTop = layoutInfo.height - widgetHeight;
+        const clampedTop = Math.max(minTop, Math.min(adjustedTop, maxTop));
+        const isClamped = clampedTop !== adjustedTop;
+        this._domNode.classList.toggle("clamped", isClamped);
+        this._position.set({
+            preference: {
+                top: clampedTop,
+                left: this._anchorLeft
+            },
+            stackOrdinal: 10000
+        }, undefined);
+    }
+    _hide() {
+        const editorDomNode = this._editorObs.editor.getDomNode();
+        if (editorDomNode && isAncestorOfActiveElement(editorDomNode)) {
+            this._editorObs.editor.focus();
+        }
+        this._position.set(null, undefined);
+        this._showStore.clear();
+    }
+    _refreshActions() {
+        this._actionBar.clear();
+        this._inlineStartAction = undefined;
+        const actions = getFlatActionBarActions(
+            this._menuService.getMenuActions(MenuId.ChatEditorInlineGutter, this._contextKeyService, {
+                shouldForwardArgs: true
+            })
+        );
+        for (const action of actions) {
+            if (action.id === ACTION_START) {
+                this._inlineStartAction = action;
+                continue;
+            }
+            const keybinding = this._keybindingService.lookupKeybinding(action.id)?.getLabel();
+            this._actionBar.push(action, {
+                icon: false,
+                label: true,
+                keybinding
+            });
+        }
+    }
+    _updateInputHeight(contentHeight) {
+        const lineHeight = this._input.getOption(EditorOption.lineHeight);
+        const maxHeight = 3 * lineHeight;
+        const clampedHeight = Math.min(contentHeight, maxHeight);
+        const containerPadding = 8;
+        this._inputContainer.style.height = `${clampedHeight + containerPadding}px`;
+        this._input.layout({
+            width: 200,
+            height: clampedHeight
+        });
+    }
+};
+InlineChatInputWidget = ( __decorate([( __param(1, IKeybindingService)), ( __param(2, IMenuService)), ( __param(3, IContextKeyService)), ( __param(4, IInstantiationService)), ( __param(5, IModelService)), ( __param(6, IConfigurationService))], InlineChatInputWidget));
+let InlineChatSessionOverlayWidget = class InlineChatSessionOverlayWidget extends Disposable {
+    constructor(_editorObs, _instaService, _keybindingService) {
+        super();
+        this._editorObs = _editorObs;
+        this._instaService = _instaService;
+        this._keybindingService = _keybindingService;
+        this._domNode = createElement("div");
+        this._showStore = this._store.add(( new DisposableStore()));
+        this._position = observableValue(this, null);
+        this._minContentWidthInPx = constObservable(0);
+        this._domNode.classList.add("inline-chat-session-overlay-widget");
+        this._container = createElement("div");
+        this._domNode.appendChild(this._container);
+        this._container.classList.add("inline-chat-session-overlay-container");
+        this._statusNode = createElement("div");
+        this._statusNode.classList.add("status");
+        this._icon = append(this._statusNode, $("span"));
+        this._message = append(this._statusNode, $("span.message"));
+        this._container.appendChild(this._statusNode);
+        this._toolbarNode = createElement("div");
+        this._toolbarNode.classList.add("toolbar");
+        const stickyScrollController = StickyScrollController.get(this._editorObs.editor);
+        this._stickyScrollHeight = stickyScrollController ? observableFromEvent(
+            stickyScrollController.onDidChangeStickyScrollHeight,
+            () => stickyScrollController.stickyScrollWidgetHeight
+        ) : constObservable(0);
+    }
+    show(session) {
+        assertType(this._editorObs.editor.hasModel());
+        this._showStore.clear();
+        const entry = derived(r => session.editingSession.readEntry(session.uri, r));
+        const requestMessage = derived(r => {
+            const chatModel = session?.chatModel;
+            if (!session || !chatModel) {
+                return undefined;
+            }
+            const response = chatModel.lastRequestObs.read(r)?.response;
+            if (!response) {
+                return {
+                    message: ( localize(8642, "Working...")),
+                    icon: ThemeIcon.modify(Codicon.loading, "spin")
+                };
+            }
+            if (response.isComplete) {
+                const result = response.result;
+                if (result?.errorDetails) {
+                    return {
+                        message: ( localize(8643, "Sorry, your request failed")),
+                        icon: Codicon.error
+                    };
+                }
+                const changes = entry.read(r)?.changesCount.read(r) ?? 0;
+                return {
+                    message: changes === 0 ? ( localize(8644, "Done")) : changes === 1 ? ( localize(8645, "Done, 1 change")) : ( localize(8646, "Done, {0} changes", changes)),
+                    icon: Codicon.check
+                };
+            }
+            const lastPart = observableFromEventOpts({
+                equalsFn: () => false
+            }, response.onDidChange, () => response.response.value).read(r).filter(part => part.kind === "progressMessage" || part.kind === "toolInvocation").at(-1);
+            if (lastPart?.kind === "toolInvocation") {
+                return {
+                    message: lastPart.invocationMessage,
+                    icon: ThemeIcon.modify(Codicon.loading, "spin")
+                };
+            } else if (lastPart?.kind === "progressMessage") {
+                return {
+                    message: lastPart.content,
+                    icon: ThemeIcon.modify(Codicon.loading, "spin")
+                };
+            } else {
+                return {
+                    message: ( localize(8642, "Working...")),
+                    icon: ThemeIcon.modify(Codicon.loading, "spin")
+                };
+            }
+        });
+        this._showStore.add(autorun(r => {
+            const value = requestMessage.read(r);
+            if (value) {
+                this._message.innerText = renderAsPlaintext(value.message);
+                this._icon.className = "";
+                this._icon.classList.add(...ThemeIcon.asClassNameArray(value.icon));
+            } else {
+                this._message.innerText = "";
+                this._icon.className = "";
+            }
+        }));
+        this._container.appendChild(this._toolbarNode);
+        this._showStore.add(toDisposable(() => this._toolbarNode.remove()));
+        const that = this;
+        this._showStore.add(
+            this._instaService.createInstance(MenuWorkbenchToolBar, this._toolbarNode, MenuId.ChatEditorInlineExecute, {
+                telemetrySource: "inlineChatProgress.overlayToolbar",
+                hiddenItemStrategy: HiddenItemStrategy.Ignore,
+                toolbarOptions: {
+                    primaryGroup: () => true,
+                    useSeparatorsInPrimaryActions: true
+                },
+                menuOptions: {
+                    renderShortTitle: true
+                },
+                actionViewItemProvider: (action, options) => {
+                    const primaryActions = [CancelChatActionId, "inlineChat2.keep"];
+                    const labeledActions = primaryActions.concat(["inlineChat2.undo"]);
+                    if (!labeledActions.includes(action.id)) {
+                        return undefined;
+                    }
+                    return ( new ChatEditingAcceptRejectActionViewItem(action, options, entry, undefined, that._keybindingService, primaryActions));
+                }
+            })
+        );
+        const lineHeight = this._editorObs.getOption(EditorOption.lineHeight);
+        const widgetWidth = observableValue(this, 0);
+        const resizeObserver = new DisposableResizeObserver(() => {
+            widgetWidth.set(this._domNode.offsetWidth, undefined);
+        });
+        this._showStore.add(resizeObserver);
+        this._showStore.add(resizeObserver.observe(this._domNode));
+        this._showStore.add(autorun(r => {
+            const layoutInfo = this._editorObs.layoutInfo.read(r);
+            const stickyScrollHeight = this._stickyScrollHeight.read(r);
+            const width = widgetWidth.read(r);
+            const padding = Math.round(lineHeight.read(r) * 2 / 3);
+            const maxWidth = layoutInfo.contentWidth - 2 * padding;
+            this._domNode.style.maxWidth = `${maxWidth}px`;
+            const top = stickyScrollHeight + padding;
+            const left = layoutInfo.width - width - layoutInfo.verticalScrollbarWidth - layoutInfo.minimap.minimapWidth - padding;
+            this._position.set({
+                preference: {
+                    top,
+                    left
+                },
+                stackOrdinal: 10000
+            }, undefined);
+        }));
+        this._showStore.add(this._editorObs.createOverlayWidget({
+            domNode: this._domNode,
+            position: this._position,
+            minContentWidthInPx: this._minContentWidthInPx,
+            allowEditorOverflow: false
+        }));
+    }
+    hide() {
+        this._position.set(null, undefined);
+        this._showStore.clear();
+    }
+};
+InlineChatSessionOverlayWidget = ( __decorate([( __param(1, IInstantiationService)), ( __param(2, IKeybindingService))], InlineChatSessionOverlayWidget));
+
+export { InlineChatInputWidget, InlineChatSessionOverlayWidget };

package/vscode/src/vs/workbench/contrib/inlineChat/browser/inlineChatWidget.d.ts

@@ -22,7 +22,6 @@ import { IChatWidgetViewOptions } from "@codingame/monaco-vscode-api/vscode/vs/w
 import { ChatWidget, IChatWidgetLocationOptions } from "../../chat/browser/widget/chatWidget.js";
 import { IChatModel } from "@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/chat/common/model/chatModel";
 import { IChatService } from "@codingame/monaco-vscode-api/vscode/vs/workbench/contrib/chat/common/chatService/chatService.service";
-import { HunkInformation, Session } from "./inlineChatSession.js";
 export interface InlineChatWidgetViewState {
     editorViewState: ICodeEditorViewState;
     input: string;
@@ -114,11 +113,7 @@ export declare class InlineChatWidget {
     hasFocus(): boolean;
 }
 export declare class EditorBasedInlineChatWidget extends InlineChatWidget {
-    private readonly _parentEditor;
-    private readonly _accessibleViewer;
-    constructor(location: IChatWidgetLocationOptions, _parentEditor: ICodeEditor, options: IInlineChatWidgetConstructionOptions, contextKeyService: IContextKeyService, keybindingService: IKeybindingService, instantiationService: IInstantiationService, accessibilityService: IAccessibilityService, configurationService: IConfigurationService, accessibleViewService: IAccessibleViewService, textModelResolverService: ITextModelService, chatService: IChatService, hoverService: IHoverService, layoutService: ILayoutService, chatEntitlementService: IChatEntitlementService, markdownRendererService: IMarkdownRendererService);
-    get contentHeight(): number;
+    constructor(location: IChatWidgetLocationOptions, parentEditor: ICodeEditor, options: IInlineChatWidgetConstructionOptions, contextKeyService: IContextKeyService, keybindingService: IKeybindingService, instantiationService: IInstantiationService, accessibilityService: IAccessibilityService, configurationService: IConfigurationService, accessibleViewService: IAccessibleViewService, textModelResolverService: ITextModelService, chatService: IChatService, hoverService: IHoverService, layoutService: ILayoutService, chatEntitlementService: IChatEntitlementService, markdownRendererService: IMarkdownRendererService);
     protected _doLayout(dimension: Dimension): void;
     reset(): void;
-    showAccessibleHunk(session: Session, hunkData: HunkInformation): void;
 }