@codingame/monaco-vscode-workbench-service-override 37.2.0 → 37.3.0

package/vscode/src/vs/sessions/browser/parts/chatCompositeBar.js

@@ -0,0 +1,566 @@
+
+import { registerCss } from '@codingame/monaco-vscode-api/css';
+import { __decorate, __param } from '@codingame/monaco-vscode-api/external/tslib/tslib.es6';
+import * as chatCompositeBar from './media/chatCompositeBar.css';
+import { Disposable, DisposableStore, MutableDisposable } from '@codingame/monaco-vscode-api/vscode/vs/base/common/lifecycle';
+import { Emitter } from '@codingame/monaco-vscode-api/vscode/vs/base/common/event';
+import { $, addDisposableGenericMouseDownListener, addDisposableGenericMouseUpListener, addDisposableListener, EventType, DisposableResizeObserver, getWindow, reset, EventHelper, isHTMLElement, addStandardDisposableListener } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/dom';
+import { applyDragImage } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/ui/dnd/dnd';
+import { ScrollableElement } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/ui/scrollbar/scrollableElement';
+import { ScrollbarVisibility } from '@codingame/monaco-vscode-api/vscode/vs/base/common/scrollable';
+import '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/index';
+import { isLinux } from '@codingame/monaco-vscode-api/vscode/vs/base/common/platform';
+import { IThemeService } from '@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService.service';
+import { Action, Separator } from '@codingame/monaco-vscode-api/vscode/vs/base/common/actions';
+import { InputBox } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/ui/inputbox/inputBox';
+import { defaultInputBoxStyles } from '@codingame/monaco-vscode-api/vscode/vs/platform/theme/browser/defaultStyles';
+import { Codicon } from '@codingame/monaco-vscode-api/vscode/vs/base/common/codicons';
+import { ThemeIcon } from '@codingame/monaco-vscode-api/vscode/vs/base/common/themables';
+import { IContextMenuService, IContextViewService } from '@codingame/monaco-vscode-api/vscode/vs/platform/contextview/browser/contextView.service';
+import { IInstantiationService } from '@codingame/monaco-vscode-api/vscode/vs/platform/instantiation/common/instantiation';
+import { MenuWorkbenchToolBar, HiddenItemStrategy } from '@codingame/monaco-vscode-api/vscode/vs/platform/actions/browser/toolbar';
+import { Menus } from '@codingame/monaco-vscode-api/vscode/vs/sessions/browser/menus';
+import { StandardMouseEvent } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/mouseEvent';
+import { StandardKeyboardEvent } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/keyboardEvent';
+import { KeyCode } from '@codingame/monaco-vscode-api/vscode/vs/base/common/keyCodes';
+import { onUnexpectedError } from '@codingame/monaco-vscode-api/vscode/vs/base/common/errors';
+import { localize } from '@codingame/monaco-vscode-api/vscode/vs/nls';
+import { ChatInteractivity, SessionStatus, getChatCapabilities } from '@codingame/monaco-vscode-api/vscode/vs/sessions/services/sessions/common/session';
+import { ISessionsManagementService } from '@codingame/monaco-vscode-api/vscode/vs/sessions/services/sessions/common/sessionsManagement.service';
+import { fillSessionChatDragData, fillChatReferenceDragData, clearChatReferenceDragData } from '@codingame/monaco-vscode-api/vscode/vs/sessions/browser/dnd';
+import { IHoverService } from '@codingame/monaco-vscode-api/vscode/vs/platform/hover/browser/hover.service';
+import { getDefaultHoverDelegate } from '@codingame/monaco-vscode-api/vscode/vs/base/browser/ui/hover/hoverDelegateFactory';
+import { applySessionBarThemeColors } from './sessionBarStyles.js';
+import { ISessionsProvidersService } from '@codingame/monaco-vscode-api/vscode/vs/sessions/services/sessions/browser/sessionsProvidersService.service';
+import { isAgentHostProvider } from '@codingame/monaco-vscode-api/vscode/vs/sessions/common/agentHostSessionsProvider';
+import { ICommandService } from '@codingame/monaco-vscode-api/vscode/vs/platform/commands/common/commands.service';
+import { CLOSE_CHAT_COMMAND_ID, COPY_AGENT_HOST_CHAT_LINK_COMMAND_ID } from '@codingame/monaco-vscode-api/vscode/vs/sessions/common/sessionCommands';
+import { getSessionConversationStatusAriaLabel } from '@codingame/monaco-vscode-api/vscode/vs/sessions/browser/sessionConversationGroups';
+import { IEditorGroupsService } from '@codingame/monaco-vscode-api/vscode/vs/workbench/services/editor/common/editorGroupsService.service';
+import { autorun } from '@codingame/monaco-vscode-api/vscode/vs/base/common/observableInternal/reactions/autorun';
+
+registerCss(chatCompositeBar, 0);
+let ChatCompositeBar = class ChatCompositeBar extends Disposable {
+    get element() {
+        return this._container;
+    }
+    get visible() {
+        return this._visible;
+    }
+    get height() {
+        return this._visible ? this._height : 0;
+    }
+    constructor(
+        resizeObserverCtor,
+        _themeService,
+        _sessionsManagementService,
+        _contextMenuService,
+        _contextViewService,
+        _hoverService,
+        _instantiationService,
+        _sessionsProvidersService,
+        _commandService,
+        _editorGroupsService
+    ) {
+        super();
+        this._themeService = _themeService;
+        this._sessionsManagementService = _sessionsManagementService;
+        this._contextMenuService = _contextMenuService;
+        this._contextViewService = _contextViewService;
+        this._hoverService = _hoverService;
+        this._instantiationService = _instantiationService;
+        this._sessionsProvidersService = _sessionsProvidersService;
+        this._commandService = _commandService;
+        this._editorGroupsService = _editorGroupsService;
+        this._tabs = [];
+        this._tabDisposables = this._register(( new DisposableStore()));
+        this._groupDisposables = this._register(( new MutableDisposable()));
+        this._editingDisposables = this._register(( new MutableDisposable()));
+        this._showSessionActions = false;
+        this._onDidChangeVisibility = this._register(( new Emitter()));
+        this.onDidChangeVisibility = this._onDidChangeVisibility.event;
+        this._onDidChangeHeight = this._register(( new Emitter()));
+        this.onDidChangeHeight = this._onDidChangeHeight.event;
+        this._visible = false;
+        this._height = 0;
+        this._container = $(".chat-composite-bar.session-chat-tabs-bar");
+        const updateCompactHeight = () => this._container.classList.toggle(
+            "compact-height",
+            this._editorGroupsService.partOptions.tabHeight === "compact"
+        );
+        updateCompactHeight();
+        this._register(
+            this._editorGroupsService.onDidChangeEditorPartOptions(updateCompactHeight)
+        );
+        this._tabsRow = $(".chat-composite-bar-tabs-row");
+        this._container.appendChild(this._tabsRow);
+        this._tabsContainer = $(".chat-composite-bar-tabs");
+        this._tabsContainer.setAttribute("role", "tablist");
+        this._tabsContainer.setAttribute("aria-label", ( localize(2953, "Chats")));
+        this._tabsScrollbar = this._register(( new ScrollableElement(this._tabsContainer, {
+            horizontal: ScrollbarVisibility.Hidden,
+            vertical: ScrollbarVisibility.Hidden,
+            scrollYToX: true,
+            useShadows: false
+        })));
+        this._tabsRow.appendChild(this._tabsScrollbar.getDomNode());
+        this._sessionActionsContainer = $(".session-chat-tabs-actions");
+        this._tabsRow.appendChild(this._sessionActionsContainer);
+        const sessionToolbarContainer = $(".chat-composite-bar-toolbar");
+        this._sessionActionsContainer.appendChild(sessionToolbarContainer);
+        this._sessionToolbar = this._register(
+            this._instantiationService.createInstance(MenuWorkbenchToolBar, sessionToolbarContainer, Menus.SessionBarToolbar, {
+                hiddenItemStrategy: HiddenItemStrategy.Ignore,
+                menuOptions: {
+                    shouldForwardArgs: true
+                },
+                highlightToggledItems: true
+            })
+        );
+        const preventMiddleButtonDefault = e => {
+            if (e.button === 1 && !this._isInTabInput(e)) {
+                e.preventDefault();
+            }
+        };
+        this._register(
+            addDisposableGenericMouseDownListener(this._tabsContainer, preventMiddleButtonDefault)
+        );
+        if (isLinux) {
+            this._register(
+                addDisposableGenericMouseUpListener(this._tabsContainer, preventMiddleButtonDefault)
+            );
+        }
+        this._register(addDisposableListener(this._tabsContainer, EventType.SCROLL, () => {
+            this._tabsScrollbar.setScrollPosition({
+                scrollLeft: this._tabsContainer.scrollLeft
+            });
+        }));
+        this._register(this._tabsScrollbar.onScroll(e => {
+            if (e.scrollLeftChanged) {
+                this._tabsContainer.scrollLeft = e.scrollLeft;
+            }
+        }));
+        const resizeObserver = this._register(( new DisposableResizeObserver("ChatCompositeBar.activeTabReveal", () => {
+            this._updateScrollDimensions();
+            this._revealActiveTab();
+        })));
+        this._register(resizeObserver.observe(this._tabsContainer));
+        const heightObserver = this._register(( new DisposableResizeObserver("ChatCompositeBar.height", entries => {
+            const entry = entries.find(entry => entry.target === this._container);
+            if (!entry) {
+                return;
+            }
+            const height = entry.borderBoxSize[0]?.blockSize ?? entry.contentRect.height;
+            if (this._height !== height) {
+                this._height = height;
+                this._onDidChangeHeight.fire();
+            }
+        }, getWindow(this._container), {
+            resizeObserverCtor
+        })));
+        this._register(heightObserver.observe(this._container, {
+            box: "border-box"
+        }));
+        this._setVisible(false);
+        this._updateStyles();
+        this._register(this._themeService.onDidColorThemeChange(() => this._updateStyles()));
+    }
+    setGroup(delegate) {
+        if (this._delegate === delegate) {
+            return;
+        }
+        this._delegate = delegate;
+        this._sessionToolbar.context = delegate?.session;
+        const store = ( new DisposableStore());
+        this._groupDisposables.value = store;
+        if (!delegate) {
+            this._rebuildTabs([], "");
+            this._setVisible(false);
+            return;
+        }
+        this._setVisible(false);
+        store.add(autorun(reader => {
+            const chats = delegate.chats.read(reader);
+            const mainChatUri = delegate.mainChatResource.read(reader);
+            this._rebuildTabs(chats, mainChatUri);
+        }));
+        store.add(autorun(reader => {
+            this._updateActiveTab(delegate.activeChatResource.read(reader));
+        }));
+        store.add(autorun(reader => {
+            this._showSessionActions = delegate.showSessionActions.read(reader);
+            this._sessionActionsContainer.classList.toggle("hidden", !this._showSessionActions);
+        }));
+        store.add(autorun(reader => {
+            this._setVisible(delegate.visible.read(reader));
+        }));
+    }
+    setAriaLabel(label) {
+        this._tabsContainer.setAttribute("aria-label", label);
+    }
+    _rebuildTabs(chats, mainChatId) {
+        this._cancelTabEditing();
+        this._tabDisposables.clear();
+        this._tabs.length = 0;
+        reset(this._tabsContainer);
+        for (const chat of chats) {
+            this._createTab(chat, ( chat.resource.toString()) === mainChatId);
+        }
+        this._updateActiveTab(this._delegate?.activeChatResource.get() ?? "");
+        this._updateScrollDimensions();
+    }
+    _updateScrollDimensions() {
+        this._tabsScrollbar.setScrollDimensions({
+            width: this._tabsContainer.clientWidth,
+            scrollWidth: this._tabsContainer.scrollWidth
+        });
+    }
+    _createTab(chat, isMainChat) {
+        const delegate = this._delegate;
+        const session = delegate?.session;
+        const tab = $(".chat-composite-bar-tab.modern-ui-editor-tab");
+        tab.tabIndex = -1;
+        tab.setAttribute("role", "tab");
+        tab.draggable = true;
+        tab.dataset.chatResource = ( chat.resource.toString());
+        tab.dataset.isMainChat = String(isMainChat);
+        const tabFill = $(".chat-composite-bar-tab-fill.modern-ui-editor-tab-fill", {
+            "aria-hidden": true
+        });
+        tab.appendChild(tabFill);
+        const labelEl = $(".chat-composite-bar-tab-label.modern-ui-editor-tab-label");
+        this._tabDisposables.add(autorun(reader => {
+            const title = chat.title.read(reader);
+            const status = chat.status.read(reader);
+            labelEl.textContent = title;
+            tab.setAttribute("aria-label", ( localize(2954, "{0}, {1}", title, getSessionConversationStatusAriaLabel(status))));
+        }));
+        const lockIcon = $(".chat-composite-bar-tab-lock");
+        lockIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.lock));
+        tab.appendChild(lockIcon);
+        this._tabDisposables.add(autorun(reader => {
+            const isReadOnly = chat.interactivity.read(reader) === ChatInteractivity.ReadOnly;
+            tab.classList.toggle("read-only", isReadOnly);
+            tab.dataset.interactivity = chat.interactivity.read(reader);
+        }));
+        tab.appendChild(labelEl);
+        const inputContainer = $(".chat-composite-bar-tab-input-container");
+        tab.appendChild(inputContainer);
+        this._tabDisposables.add(
+            this._hoverService.setupManagedHover(getDefaultHoverDelegate("element"), tab, () => chat.title.get())
+        );
+        this._tabDisposables.add(autorun(reader => {
+            const status = chat.status.read(reader);
+            tab.classList.toggle("untitled", status === SessionStatus.Untitled);
+        }));
+        const indicator = $(".chat-composite-bar-tab-indicator");
+        const indicatorIcon = $(".chat-composite-bar-tab-indicator-icon");
+        indicator.appendChild(indicatorIcon);
+        this._tabDisposables.add(autorun(reader => {
+            const isActive = delegate?.activeChatResource.read(reader) === ( chat.resource.toString());
+            const status = chat.status.read(reader);
+            const isRead = chat.isRead.read(reader);
+            let mode = "none";
+            if (status === SessionStatus.NeedsInput) {
+                mode = "needs-input";
+            } else if (status === SessionStatus.InProgress) {
+                mode = "in-progress";
+            } else if (!isRead && !isActive) {
+                mode = "unread";
+            }
+            tab.classList.toggle("needs-input", mode === "needs-input");
+            tab.classList.toggle("unread", mode === "unread");
+            tab.classList.toggle("in-progress", mode === "in-progress");
+            indicatorIcon.className = "chat-composite-bar-tab-indicator-icon";
+            if (mode === "in-progress") {
+                indicatorIcon.classList.add(...ThemeIcon.asClassNameArray(ThemeIcon.modify(Codicon.loading, "spin")));
+            }
+        }));
+        tab.appendChild(indicator);
+        let tabToolbar;
+        if (!isMainChat && session) {
+            const actionsContainer = $(".chat-composite-bar-tab-actions");
+            tab.appendChild(actionsContainer);
+            tabToolbar = this._tabDisposables.add(
+                this._instantiationService.createInstance(MenuWorkbenchToolBar, actionsContainer, Menus.SessionChatTab, {
+                    hiddenItemStrategy: HiddenItemStrategy.Ignore,
+                    menuOptions: {
+                        shouldForwardArgs: true
+                    },
+                    toolbarOptions: {
+                        primaryGroup: () => true
+                    }
+                })
+            );
+            tabToolbar.context = {
+                session,
+                chat
+            };
+        }
+        this._tabsContainer.appendChild(tab);
+        const chatTab = {
+            chat,
+            element: tab,
+            inputContainer,
+            toolbar: tabToolbar
+        };
+        this._tabDisposables.add(addDisposableListener(tab, EventType.CLICK, () => {
+            this._cancelTabEditing();
+            this._delegate?.openChat(chat.resource);
+        }));
+        const isHandledTabKey = event => ( [
+            KeyCode.Enter,
+            KeyCode.Space,
+            KeyCode.LeftArrow,
+            KeyCode.RightArrow,
+            KeyCode.Home,
+            KeyCode.End
+        ].some(keyCode => event.equals(keyCode)));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.KEY_DOWN, e => {
+            if (e.target === tab && isHandledTabKey(( new StandardKeyboardEvent(e)))) {
+                EventHelper.stop(e, true);
+            }
+        }));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.KEY_UP, e => {
+            if (e.target !== tab) {
+                return;
+            }
+            const event = ( new StandardKeyboardEvent(e));
+            if (event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
+                EventHelper.stop(e, true);
+                this._delegate?.openChat(chat.resource);
+            } else if (( [KeyCode.LeftArrow, KeyCode.RightArrow, KeyCode.Home, KeyCode.End].some(keyCode => event.equals(keyCode)))) {
+                let tabIndex = this._tabs.indexOf(chatTab);
+                if (event.equals(KeyCode.LeftArrow)) {
+                    tabIndex--;
+                } else if (event.equals(KeyCode.RightArrow)) {
+                    tabIndex++;
+                } else if (event.equals(KeyCode.Home)) {
+                    tabIndex = 0;
+                } else {
+                    tabIndex = this._tabs.length - 1;
+                }
+                const targetTab = this._tabs[tabIndex];
+                if (targetTab) {
+                    EventHelper.stop(e, true);
+                    this._delegate?.openChat(targetTab.chat.resource);
+                    targetTab.element.focus();
+                }
+            }
+        }));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.AUXCLICK, e => {
+            if (e.button !== 1) {
+                return;
+            }
+            if (this._isInTabInput(e)) {
+                return;
+            }
+            EventHelper.stop(e, true);
+            if (isMainChat || !session) {
+                return;
+            }
+            this._cancelTabEditing();
+            void this._commandService.executeCommand(CLOSE_CHAT_COMMAND_ID, {
+                session,
+                chat
+            }).catch(onUnexpectedError);
+        }));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.DRAG_START, e => {
+            if (!delegate || !e.dataTransfer) {
+                e.preventDefault();
+                return;
+            }
+            const target = e.target;
+            if (target?.closest(".chat-composite-bar-tab-actions")) {
+                e.preventDefault();
+                return;
+            }
+            if (this._editingTab) {
+                e.preventDefault();
+                return;
+            }
+            this._cancelTabEditing();
+            fillSessionChatDragData(e, delegate.session.sessionId, chat.resource);
+            const backendChatResource = this._backendChatResource(chat);
+            if (backendChatResource) {
+                fillChatReferenceDragData(e, backendChatResource, chat.resource, chat.title.get());
+            }
+            e.dataTransfer.effectAllowed = "copyMove";
+            applyDragImage(e, tab, chat.title.get());
+            delegate.onTabDragStart?.(chat.resource);
+        }));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.DRAG_END, () => {
+            clearChatReferenceDragData();
+            this._delegate?.onTabDragEnd?.();
+        }));
+        const renameAction = this._tabDisposables.add(( new Action("sessionCompositeBar.renameChat", ( localize(2955, "Rename")), undefined, true, async () => {
+            this._startTabEditing(chatTab);
+        })));
+        const copyLinkAction = this._tabDisposables.add(( new Action(COPY_AGENT_HOST_CHAT_LINK_COMMAND_ID, ( localize(2956, "Copy Link")), undefined, true, async () => {
+            if (session) {
+                await this._commandService.executeCommand(COPY_AGENT_HOST_CHAT_LINK_COMMAND_ID, {
+                    session,
+                    chat
+                });
+            }
+        })));
+        const deleteAction = this._tabDisposables.add(( new Action("sessionCompositeBar.deleteChat", ( localize(2957, "Delete Chat")), undefined, true, async () => {
+            if (delegate) {
+                await this._sessionsManagementService.deleteChat(delegate.session, chat.resource);
+            }
+        })));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.DBLCLICK, e => {
+            if (chat.status.get() === SessionStatus.Untitled || !getChatCapabilities(chat, session, undefined).canRename) {
+                return;
+            }
+            e.preventDefault();
+            e.stopPropagation();
+            this._startTabEditing(chatTab);
+        }));
+        this._tabDisposables.add(addDisposableListener(tab, EventType.CONTEXT_MENU, e => {
+            if (chat.status.get() === SessionStatus.Untitled) {
+                e.preventDefault();
+                return;
+            }
+            e.preventDefault();
+            e.stopPropagation();
+            const event = ( new StandardMouseEvent(getWindow(tab), e));
+            this._contextMenuService.showContextMenu({
+                getAnchor: () => event,
+                getActions: () => {
+                    const capabilities = getChatCapabilities(chat, session, undefined);
+                    const provider = session && this._sessionsProvidersService.getProvider(session.providerId);
+                    return Separator.join(
+                        capabilities.canRename ? [renameAction] : [],
+                        provider && isAgentHostProvider(provider) ? [copyLinkAction] : [],
+                        capabilities.canDelete ? [deleteAction] : []
+                    );
+                }
+            });
+        }));
+        this._tabs.push(chatTab);
+    }
+    _isInTabInput(event) {
+        return isHTMLElement(event.target) && !!event.target.closest(".chat-composite-bar-tab-input-container");
+    }
+    _backendChatResource(chat) {
+        const providerId = this._delegate?.session.providerId;
+        if (!providerId) {
+            return undefined;
+        }
+        const provider = this._sessionsProvidersService.getProvider(providerId);
+        return provider && isAgentHostProvider(provider) ? provider.getBackendChatResource(chat.resource) : undefined;
+    }
+    _startTabEditing(chatTab) {
+        const delegate = this._delegate;
+        if (!delegate || this._editingTab) {
+            return;
+        }
+        const {
+            chat,
+            element: tab,
+            inputContainer
+        } = chatTab;
+        const initialTitle = chat.title.get();
+        this._editingTab = chatTab;
+        tab.classList.add("editing");
+        const store = ( new DisposableStore());
+        this._editingDisposables.value = store;
+        const inputBox = store.add(( new InputBox(inputContainer, this._contextViewService, {
+            ariaLabel: ( localize(2958, "Rename chat")),
+            inputBoxStyles: defaultInputBoxStyles
+        })));
+        inputBox.element.classList.add("chat-composite-bar-tab-input");
+        inputBox.value = initialTitle;
+        inputBox.focus();
+        inputBox.select();
+        let finished = false;
+        const finish = commit => {
+            if (finished) {
+                return;
+            }
+            finished = true;
+            const newTitle = inputBox.value.trim();
+            this._endTabEditing();
+            if (commit && newTitle && newTitle !== initialTitle) {
+                this._sessionsManagementService.renameChat(delegate.session, chat.resource, newTitle).catch(onUnexpectedError);
+            }
+        };
+        store.add(
+            addStandardDisposableListener(inputBox.inputElement, EventType.KEY_DOWN, e => {
+                if (e.equals(KeyCode.Enter)) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    finish(true);
+                } else if (e.equals(KeyCode.Escape)) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    finish(false);
+                } else {
+                    e.stopPropagation();
+                }
+            })
+        );
+        store.add(
+            addDisposableListener(inputBox.inputElement, EventType.BLUR, () => finish(false))
+        );
+        store.add(
+            addDisposableListener(inputBox.element, EventType.CLICK, e => e.stopPropagation())
+        );
+        store.add(
+            addDisposableListener(inputBox.element, EventType.DBLCLICK, e => e.stopPropagation())
+        );
+    }
+    _cancelTabEditing() {
+        if (!this._editingTab) {
+            return;
+        }
+        this._endTabEditing();
+    }
+    _endTabEditing() {
+        const editingTab = this._editingTab;
+        this._editingTab = undefined;
+        this._editingDisposables.clear();
+        if (editingTab) {
+            editingTab.element.classList.remove("editing");
+            reset(editingTab.inputContainer);
+        }
+    }
+    _updateActiveTab(activeChatId) {
+        for (const tab of this._tabs) {
+            const isActive = ( tab.chat.resource.toString()) === activeChatId;
+            tab.element.classList.toggle("active", isActive);
+            tab.element.setAttribute("aria-selected", String(isActive));
+            tab.element.tabIndex = isActive ? 0 : -1;
+            tab.toolbar?.setFocusable(isActive);
+            if (isActive) {
+                tab.element.scrollIntoView({
+                    block: "nearest",
+                    inline: "nearest"
+                });
+            }
+        }
+    }
+    _revealActiveTab() {
+        const activeTab = this._tabs.find(t => t.element.classList.contains("active"));
+        activeTab?.element.scrollIntoView({
+            block: "nearest",
+            inline: "nearest"
+        });
+    }
+    _setVisible(visible) {
+        const wasVisible = this._visible;
+        this._visible = visible;
+        this._container.style.display = this._visible ? "" : "none";
+        this._height = this._visible ? this._container.offsetHeight : 0;
+        if (wasVisible !== this._visible) {
+            this._onDidChangeVisibility.fire(this._visible);
+        }
+    }
+    _updateStyles() {
+        applySessionBarThemeColors(this._container, this._themeService.getColorTheme());
+    }
+};
+ChatCompositeBar = ( __decorate([( __param(1, IThemeService)), ( __param(2, ISessionsManagementService)), ( __param(3, IContextMenuService)), ( __param(4, IContextViewService)), ( __param(5, IHoverService)), ( __param(6, IInstantiationService)), ( __param(7, ISessionsProvidersService)), ( __param(8, ICommandService)), ( __param(9, IEditorGroupsService))], ChatCompositeBar));
+
+export { ChatCompositeBar };

package/vscode/src/vs/sessions/browser/parts/chatGroupDropTarget.d.ts

@@ -0,0 +1,43 @@
+import { IInstantiationService } from "@codingame/monaco-vscode-api/vscode/vs/platform/instantiation/common/instantiation";
+import { Themable } from "@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService";
+import { IThemeService } from "@codingame/monaco-vscode-api/vscode/vs/platform/theme/common/themeService.service";
+import { IDraggedSessionChat } from "@codingame/monaco-vscode-api/vscode/vs/sessions/browser/dnd";
+/** Zone of a target group where a dragged chat can be dropped. */
+export type ChatDropZone = "left" | "right" | "top" | "bottom" | "center";
+/**
+ * Resolves an element under the groups container to the chat group it belongs
+ * to, and receives drop notifications.
+ */
+export interface IChatGroupDropTargetDelegate {
+    /** Whether the drag can be accepted by this session's grid. */
+    isChatDrag(event: DragEvent): boolean;
+    /** Resolve a child element to its owning chat group id + root element. */
+    findTargetGroup(child: HTMLElement): {
+        readonly id: number;
+        readonly element: HTMLElement;
+    } | undefined;
+    /** Handle a chat being dropped onto the given group in the given zone. */
+    onChatDrop(targetGroupId: number, zone: ChatDropZone, data: IDraggedSessionChat | undefined): void;
+}
+/**
+ * Drop target for the chats grid within a session. Listens for chat-tab drags
+ * over the groups container, displays a 5-zone overlay on whichever group is
+ * being hovered, and calls back into the owning {@link ChatGroupsView} to move
+ * the chat into an existing group (center) or split it into a new group (edge).
+ */
+export declare class ChatGroupDropTarget extends Themable {
+    private readonly _container;
+    private readonly _delegate;
+    private readonly _instantiationService;
+    private _overlay?;
+    private _counter;
+    constructor(_container: HTMLElement, _delegate: IChatGroupDropTargetDelegate, themeService: IThemeService, _instantiationService: IInstantiationService);
+    private get overlay();
+    private _registerListeners;
+    private _onDragEnter;
+    private _onDragLeave;
+    private _onDragEnd;
+    private _updateContainer;
+    dispose(): void;
+    private _disposeOverlay;
+}