@codingame/monaco-vscode-api 6.0.2 → 7.0.0

package/vscode/src/vs/workbench/contrib/chat/browser/chatListRenderer.js

@@ -1,36 +1,23 @@
 import { __decorate, __param } from '../../../../../../../external/tslib/tslib.es6.js';
-import { append, addDisposableListener, clearNode, WindowIntervalTimer, getWindow, reset, $ as $$1, scheduleAtNextAnimationFrame, hide, show, EventType } from '../../../../base/browser/dom.js';
+import { append, addDisposableListener, clearNode, WindowIntervalTimer, getWindow, reset, $ as $$1, scheduleAtNextAnimationFrame, EventType } from '../../../../base/browser/dom.js';
 import { renderFormattedText } from '../../../../base/browser/formattedTextRenderer.js';
 import { StandardKeyboardEvent } from '../../../../base/browser/keyboardEvent.js';
-import { alert } from '../../../../base/browser/ui/aria/aria.js';
-import { Button } from '../../../../base/browser/ui/button/button.js';
 import { getDefaultHoverDelegate } from '../../../../base/browser/ui/hover/hoverDelegateFactory.js';
-import { renderIcon } from '../../../../base/browser/ui/iconLabel/iconLabels.js';
-import { distinct } from '../../../../base/common/arrays.js';
-import { CancellationTokenSource } from '../../../../base/common/cancellation.js';
+import { distinct, coalesce } from '../../../../base/common/arrays.js';
 import { Codicon } from '../../../../base/common/codicons.js';
-import { Emitter, Event } from '../../../../base/common/event.js';
+import { Emitter } from '../../../../base/common/event.js';
 import { MarkdownString } from '../../../../base/common/htmlContent.js';
 import { KeyCode } from '../../../../base/common/keyCodes.js';
-import { Disposable, DisposableStore, toDisposable } from '../../../../base/common/lifecycle.js';
+import { Disposable, toDisposable, dispose, DisposableStore } from '../../../../base/common/lifecycle.js';
 import { ResourceMap } from '../../../../base/common/map.js';
-import { FileAccess, Schemas, matchesSomeScheme } from '../../../../base/common/network.js';
+import { FileAccess } from '../../../../base/common/network.js';
 import { clamp } from '../../../../base/common/numbers.js';
 import '../../../../base/common/observableInternal/derived.js';
 import { autorun } from '../../../../base/common/observableInternal/autorun.js';
 import '../../../../base/common/observableInternal/utils.js';
-import { basename } from '../../../../base/common/path.js';
-import { isEqual, basenameOrAuthority } from '../../../../base/common/resources.js';
-import { equalsIgnoreCase } from '../../../../base/common/strings.js';
+import '../../../../base/common/cancellation.js';
 import { ThemeIcon } from '../../../../base/common/themables.js';
 import { URI } from '../../../../base/common/uri.js';
-import { generateUuid } from '../../../../base/common/uuid.js';
-import { Range } from '../../../../editor/common/core/range.js';
-import { TextEdit } from '../../../../editor/common/languages.js';
-import { createTextBufferFactoryFromSnapshot } from '../../../../editor/common/model/textModel.js';
-import { IModelService } from '../../../../editor/common/services/model.js';
-import { DefaultModelSHA1Computer } from '../../../../editor/common/services/modelService.js';
-import { ITextModelService } from '../../../../editor/common/services/resolverService.js';
 import { localizeWithPath } from '../../../../nls.js';
 import { createActionViewItem, MenuEntryActionViewItem } from '../../../../platform/actions/browser/menuEntryActionViewItem.js';
 import { MenuWorkbenchToolBar } from '../../../../platform/actions/browser/toolbar.js';
@@ -38,40 +25,40 @@ import { MenuId, MenuItemAction } from '../../../../platform/actions/common/acti
 import { ICommandService } from '../../../../platform/commands/common/commands.service.js';
 import { IConfigurationService } from '../../../../platform/configuration/common/configuration.service.js';
 import { IContextKeyService } from '../../../../platform/contextkey/common/contextkey.service.js';
-import { FileKind, FileType } from '../../../../platform/files/common/files.js';
 import { IHoverService } from '../../../../platform/hover/browser/hover.service.js';
 import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
 import { ServiceCollection } from '../../../../platform/instantiation/common/serviceCollection.js';
-import { WorkbenchCompressibleAsyncDataTree, WorkbenchList } from '../../../../platform/list/browser/listService.js';
 import { ILogService } from '../../../../platform/log/common/log.service.js';
-import { IOpenerService } from '../../../../platform/opener/common/opener.service.js';
-import { defaultButtonStyles } from '../../../../platform/theme/browser/defaultStyles.js';
 import { ColorScheme } from '../../../../platform/theme/common/theme.js';
 import { IThemeService } from '../../../../platform/theme/common/themeService.service.js';
-import { ResourceLabels } from '../../../browser/labels.js';
 import { GeneratingPhrase } from './chat.js';
 import { ChatAgentHover, getChatAgentHoverOptions } from './chatAgentHover.js';
-import { ChatConfirmationWidget } from './chatConfirmationWidget.js';
+import { ChatCommandButtonContentPart } from './chatContentParts/chatCommandContentPart.js';
+import { ChatConfirmationContentPart } from './chatContentParts/chatConfirmationContentPart.js';
+import { EditorPool, ChatMarkdownContentPart } from './chatContentParts/chatMarkdownContentPart.js';
+import { ChatProgressContentPart } from './chatContentParts/chatProgressContentPart.js';
+import { ContentReferencesListPool, ChatReferencesContentPart } from './chatContentParts/chatReferencesContentPart.js';
+import { ChatTaskContentPart } from './chatContentParts/chatTaskContentPart.js';
+import { DiffEditorPool, ChatTextEditContentPart } from './chatContentParts/chatTextEditContentPart.js';
+import { TreePool, ChatTreeContentPart } from './chatContentParts/chatTreeContentPart.js';
+import { ChatWarningContentPart } from './chatContentParts/chatWarningContentPart.js';
 import { ChatFollowups } from './chatFollowups.js';
 import { ChatMarkdownDecorationsRenderer } from './chatMarkdownDecorationsRenderer.js';
-import { ChatCodeBlockContentProvider, parseLocalFileData, CodeBlockPart, CodeCompareBlockPart, localFileLanguageId } from './codeBlockPart.js';
+import { ChatMarkdownRenderer } from './chatMarkdownRenderer.js';
+import { ChatCodeBlockContentProvider } from './codeBlockPart.js';
 import { CONTEXT_RESPONSE, CONTEXT_REQUEST, CONTEXT_RESPONSE_DETECTED_AGENT_COMMAND, CONTEXT_CHAT_RESPONSE_SUPPORT_ISSUE_REPORTING, CONTEXT_RESPONSE_VOTE, CONTEXT_RESPONSE_FILTERED } from '../common/chatContextKeys.js';
 import { chatSubcommandLeader } from '../common/chatParserTypes.js';
 import { ChatAgentVoteDirection } from '../common/chatService.js';
-import { IChatService } from '../common/chatService.service.js';
-import { IChatVariablesService } from '../common/chatVariables.service.js';
 import { isResponseVM, isRequestVM, isWelcomeVM } from '../common/chatViewModel.js';
 import { getNWords } from '../common/chatWordCounter.js';
-import { createFileIconThemableTreeContainerScope } from '../../files/browser/views/explorerView.js';
 import { annotateSpecialMarkdownContent } from '../common/annotations.js';
-import { ChatMarkdownRenderer } from './chatMarkdownRenderer.js';
-var ChatListItemRenderer_1, ContentReferencesListRenderer_1;
+var ChatListItemRenderer_1;
 const _moduleId = "vs/workbench/contrib/chat/browser/chatListRenderer";
 const $ = $$1;
 let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
     static { ChatListItemRenderer_1 = this; }
     static { this.ID = 'item'; }
-    constructor(editorOptions, location, rendererOptions, delegate, codeBlockModelCollection, overflowWidgetsDomNode, instantiationService, configService, logService, openerService, contextKeyService, themeService, commandService, textModelService, modelService, hoverService, chatService) {
+    constructor(editorOptions, location, rendererOptions, delegate, codeBlockModelCollection, overflowWidgetsDomNode, instantiationService, configService, logService, contextKeyService, themeService, commandService, hoverService) {
         super();
         this.location = location;
         this.rendererOptions = rendererOptions;
@@ -79,14 +66,10 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         this.codeBlockModelCollection = codeBlockModelCollection;
         this.instantiationService = instantiationService;
         this.logService = logService;
-        this.openerService = openerService;
         this.contextKeyService = contextKeyService;
         this.themeService = themeService;
         this.commandService = commandService;
-        this.textModelService = textModelService;
-        this.modelService = modelService;
         this.hoverService = hoverService;
-        this.chatService = chatService;
         this.codeBlocksByResponseId = ( (new Map()));
         this.codeBlocksByEditorUri = ( (new ResourceMap()));
         this.fileTreesByResponseId = ( (new Map()));
@@ -100,7 +83,6 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         this._currentLayoutWidth = 0;
         this._isVisible = true;
         this._onDidChangeVisibility = this._register(( (new Emitter())));
-        this._usedReferencesEnabled = false;
         this.renderer = this._register(this.instantiationService.createInstance(ChatMarkdownRenderer, undefined));
         this.markdownDecorationsRenderer = this.instantiationService.createInstance(ChatMarkdownDecorationsRenderer);
         this._editorPool = this._register(this.instantiationService.createInstance(EditorPool, editorOptions, delegate, overflowWidgetsDomNode));
@@ -108,12 +90,6 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         this._treePool = this._register(this.instantiationService.createInstance(TreePool, this._onDidChangeVisibility.event));
         this._contentReferencesListPool = this._register(this.instantiationService.createInstance(ContentReferencesListPool, this._onDidChangeVisibility.event));
         this._register(this.instantiationService.createInstance(ChatCodeBlockContentProvider));
-        this._usedReferencesEnabled = configService.getValue('chat.experimental.usedReferences') ?? true;
-        this._register(configService.onDidChangeConfiguration(e => {
-            if (e.affectsConfiguration('chat.experimental.usedReferences')) {
-                this._usedReferencesEnabled = configService.getValue('chat.experimental.usedReferences') ?? true;
-            }
-        }));
     }
     get templateId() {
         return ChatListItemRenderer_1.ID;
@@ -180,17 +156,30 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         if (this.rendererOptions.noPadding) {
             rowContainer.classList.add('no-padding');
         }
-        const header = append(rowContainer, $('.header'));
+        let headerParent = rowContainer;
+        let valueParent = rowContainer;
+        let detailContainerParent;
+        let toolbarParent;
+        if (this.rendererOptions.renderStyle === 'minimal') {
+            rowContainer.classList.add('interactive-item-compact');
+            rowContainer.classList.add('minimal');
+            const lhsContainer = append(rowContainer, $('.column.left'));
+            const rhsContainer = append(rowContainer, $('.column.right'));
+            headerParent = lhsContainer;
+            detailContainerParent = rhsContainer;
+            valueParent = rhsContainer;
+            toolbarParent = append(rowContainer, $('.header'));
+        }
+        const header = append(headerParent, $('.header'));
         const user = append(header, $('.user'));
         user.tabIndex = 0;
         user.role = 'toolbar';
         const avatarContainer = append(user, $('.avatar-container'));
         const username = append(user, $('h3.username'));
-        const detailContainer = append(user, $('span.detail-container'));
+        const detailContainer = append(detailContainerParent ?? user, $('span.detail-container'));
         const detail = append(detailContainer, $('span.detail'));
         append(detailContainer, $('span.chat-animated-ellipsis'));
-        const referencesListContainer = append(rowContainer, $('.referencesListContainer'));
-        const value = append(rowContainer, $('.value'));
+        const value = append(valueParent, $('.value'));
         const elementDisposables = ( (new DisposableStore()));
         const contextKeyService = templateDisposables.add(this.contextKeyService.createScoped(rowContainer));
         const scopedInstantiationService = this.instantiationService.createChild(( (new ServiceCollection([IContextKeyService, contextKeyService]))));
@@ -199,7 +188,7 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
             header.classList.add('hidden');
         }
         else {
-            titleToolbar = templateDisposables.add(scopedInstantiationService.createInstance(MenuWorkbenchToolBar, header, MenuId.ChatMessageTitle, {
+            titleToolbar = templateDisposables.add(scopedInstantiationService.createInstance(MenuWorkbenchToolBar, toolbarParent ?? header, MenuId.ChatMessageTitle, {
                 menuOptions: {
                     shouldForwardArgs: true
                 },
@@ -216,14 +205,14 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         }
         const agentHover = templateDisposables.add(this.instantiationService.createInstance(ChatAgentHover));
         const hoverContent = () => {
-            if (isResponseVM(template.currentElement) && template.currentElement.agent) {
+            if (isResponseVM(template.currentElement) && template.currentElement.agent && !template.currentElement.agent.isDefault) {
                 agentHover.setAgent(template.currentElement.agent.id);
                 return agentHover.domNode;
             }
             return undefined;
         };
         const hoverOptions = getChatAgentHoverOptions(() => isResponseVM(template.currentElement) ? template.currentElement.agent : undefined, this.commandService);
-        templateDisposables.add(this.hoverService.setupUpdatableHover(getDefaultHoverDelegate('element'), user, hoverContent, hoverOptions));
+        templateDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('element'), user, hoverContent, hoverOptions));
         templateDisposables.add(addDisposableListener(user, EventType.KEY_DOWN, e => {
             const ev = ( (new StandardKeyboardEvent(e)));
             if (ev.equals(KeyCode.Space) || ev.equals(KeyCode.Enter)) {
@@ -236,7 +225,7 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
                 this.hoverService.hideHover();
             }
         }));
-        const template = { avatarContainer, username, detail, referencesListContainer, value, rowContainer, elementDisposables, titleToolbar, templateDisposables, contextKeyService, agentHover };
+        const template = { avatarContainer, username, detail, value, rowContainer, elementDisposables, titleToolbar, templateDisposables, contextKeyService, instantiationService: scopedInstantiationService, agentHover };
         return template;
     }
     renderElement(node, index, templateData) {
@@ -278,31 +267,26 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         }
         if (isResponseVM(element) && index === this.delegate.getListLength() - 1 && (!element.isComplete || element.renderData) && element.response.value.length) {
             this.traceLayout('renderElement', `start progressive render ${kind}, index=${index}`);
-            const progressiveRenderingDisposables = templateData.elementDisposables.add(( (new DisposableStore())));
             const timer = templateData.elementDisposables.add(new WindowIntervalTimer());
             const runProgressiveRender = (initial) => {
                 try {
-                    if (this.doNextProgressiveRender(element, index, templateData, !!initial, progressiveRenderingDisposables)) {
+                    if (this.doNextProgressiveRender(element, index, templateData, !!initial)) {
                         timer.cancel();
                     }
                 }
                 catch (err) {
                     timer.cancel();
-                    throw err;
+                    this.logService.error(err);
                 }
             };
             timer.cancelAndSet(runProgressiveRender, 50, getWindow(templateData.rowContainer));
             runProgressiveRender(true);
         }
         else if (isResponseVM(element)) {
-            const renderableResponse = annotateSpecialMarkdownContent(element.response.value);
-            this.basicRenderElement(renderableResponse, element, index, templateData);
+            this.basicRenderElement(element, index, templateData);
         }
         else if (isRequestVM(element)) {
-            const markdown = 'message' in element.message ?
-                element.message.message :
-                this.markdownDecorationsRenderer.convertParsedRequestToMarkdown(element.message);
-            this.basicRenderElement([{ content: ( (new MarkdownString(markdown))), kind: 'markdownContent' }], element, index, templateData);
+            this.basicRenderElement(element, index, templateData);
         }
         else {
             this.renderWelcomeMessage(element, templateData);
@@ -316,14 +300,8 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
     _renderDetail(element, templateData) {
         clearNode(templateData.detail);
         if (element.slashCommand && element.agentOrSlashCommandDetected) {
-            let msg = '';
             const usingMsg = `${chatSubcommandLeader}${element.slashCommand.name}`;
-            if (element.isComplete) {
-                msg = ( localizeWithPath(_moduleId, 0, "used {0} [[(rerun without)]]", usingMsg));
-            }
-            else {
-                msg = ( localizeWithPath(_moduleId, 1, "using {0}", usingMsg));
-            }
+            const msg = ( localizeWithPath(_moduleId, 0, "used {0} [[(rerun without)]]", usingMsg));
             reset(templateData.detail, renderFormattedText(msg, {
                 className: 'agentOrSlashCommandDetected',
                 inline: true,
@@ -367,40 +345,43 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
             return Codicon.copilot;
         }
     }
-    basicRenderElement(value, element, index, templateData) {
-        const fillInIncompleteTokens = isResponseVM(element) && (!element.isComplete || element.isCanceled || element.errorDetails?.responseIsFiltered || element.errorDetails?.responseIsIncomplete);
+    basicRenderElement(element, index, templateData) {
+        let value = [];
+        if (isRequestVM(element)) {
+            const markdown = 'message' in element.message ?
+                element.message.message :
+                this.markdownDecorationsRenderer.convertParsedRequestToMarkdown(element.message);
+            value = [{ content: ( (new MarkdownString(markdown))), kind: 'markdownContent' }];
+        }
+        else if (isResponseVM(element)) {
+            value = annotateSpecialMarkdownContent(element.response.value);
+            if (element.contentReferences.length) {
+                value.unshift({ kind: 'references', references: element.contentReferences });
+            }
+        }
         clearNode(templateData.value);
-        clearNode(templateData.referencesListContainer);
         if (isResponseVM(element)) {
             this.renderDetail(element, templateData);
         }
-        this.renderContentReferencesIfNeeded(element, templateData, templateData.elementDisposables);
-        let fileTreeIndex = 0;
-        let codeBlockIndex = 0;
+        const parts = [];
         value.forEach((data, index) => {
-            const result = data.kind === 'treeData'
-                ? this.renderTreeData(data.treeData, element, templateData, fileTreeIndex++)
-                : data.kind === 'markdownContent'
-                    ? this.renderMarkdown(data.content, element, templateData, fillInIncompleteTokens, codeBlockIndex)
-                    : data.kind === 'progressMessage' && onlyProgressMessagesAfterI(value, index) ? this.renderProgressMessage(data, false)
-                        : data.kind === 'progressTask' ? this.renderProgressTask(data, false, element, templateData)
-                            : data.kind === 'command' ? this.renderCommandButton(element, data)
-                                : data.kind === 'textEditGroup' ? this.renderTextEdit(element, data, templateData)
-                                    : data.kind === 'warning' ? this.renderNotification('warning', data.content)
-                                        : data.kind === 'confirmation' ? this.renderConfirmation(element, data, templateData)
-                                            : undefined;
-            if (result) {
-                templateData.value.appendChild(result.element);
-                templateData.elementDisposables.add(result);
-                if ('codeBlockCount' in result) {
-                    codeBlockIndex += result.codeBlockCount;
-                }
+            const context = {
+                element,
+                index,
+                content: value,
+                preceedingContentParts: parts,
+            };
+            const newPart = this.renderChatContentPart(data, templateData, context);
+            if (newPart) {
+                templateData.value.appendChild(newPart.domNode);
+                parts.push(newPart);
             }
         });
+        templateData.renderedParts = parts;
         if (isResponseVM(element) && element.errorDetails?.message) {
-            const renderedError = this.renderNotification(element.errorDetails.responseIsFiltered ? 'info' : 'error', ( (new MarkdownString(element.errorDetails.message))));
+            const renderedError = this.instantiationService.createInstance(ChatWarningContentPart, element.errorDetails.responseIsFiltered ? 'info' : 'error', ( (new MarkdownString(element.errorDetails.message))), this.renderer);
             templateData.elementDisposables.add(renderedError);
-            templateData.value.appendChild(renderedError.element);
+            templateData.value.appendChild(renderedError.domNode);
         }
         const newHeight = templateData.rowContainer.offsetHeight;
         const fireEvent = !element.currentRenderedHeight || element.currentRenderedHeight !== newHeight;
@@ -423,19 +404,23 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
     }
     renderWelcomeMessage(element, templateData) {
         clearNode(templateData.value);
-        clearNode(templateData.referencesListContainer);
-        hide(templateData.referencesListContainer);
-        for (const item of element.content) {
+        element.content.forEach((item, i) => {
             if (Array.isArray(item)) {
                 const scopedInstaService = this.instantiationService.createChild(( (new ServiceCollection([IContextKeyService, templateData.contextKeyService]))));
                 templateData.elementDisposables.add(scopedInstaService.createInstance(ChatFollowups, templateData.value, item, this.location, undefined, followup => this._onDidClickFollowup.fire(followup)));
             }
             else {
-                const result = this.renderMarkdown(item, element, templateData);
-                templateData.value.appendChild(result.element);
+                const context = {
+                    element,
+                    index: i,
+                    content: [],
+                    preceedingContentParts: []
+                };
+                const result = this.renderMarkdown(item, templateData, context);
+                templateData.value.appendChild(result.domNode);
                 templateData.elementDisposables.add(result);
             }
-        }
+        });
         const newHeight = templateData.rowContainer.offsetHeight;
         const fireEvent = !element.currentRenderedHeight || element.currentRenderedHeight !== newHeight;
         element.currentRenderedHeight = newHeight;
@@ -447,165 +432,30 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
             }));
         }
     }
-    doNextProgressiveRender(element, index, templateData, isInRenderElement, disposables) {
+    doNextProgressiveRender(element, index, templateData, isInRenderElement) {
         if (!this._isVisible) {
             return true;
         }
-        const renderableResponse = annotateSpecialMarkdownContent(element.response.value);
         let isFullyRendered = false;
         if (element.isCanceled) {
-            this.traceLayout('runProgressiveRender', `canceled, index=${index}`);
+            this.traceLayout('doNextProgressiveRender', `canceled, index=${index}`);
             element.renderData = undefined;
-            this.basicRenderElement(renderableResponse, element, index, templateData);
+            this.basicRenderElement(element, index, templateData);
             isFullyRendered = true;
         }
         else {
-            element.renderData ??= { renderedParts: [] };
-            const renderedParts = element.renderData.renderedParts;
-            const wordCountResults = [];
-            const partsToRender = [];
-            let somePartIsNotFullyRendered = false;
-            renderableResponse.forEach((part, index) => {
-                const renderedPart = renderedParts[index];
-                if (!renderedPart) {
-                    if (part.kind === 'treeData') {
-                        partsToRender[index] = part.treeData;
-                    }
-                    else if (part.kind === 'progressMessage') {
-                        partsToRender[index] = {
-                            progressMessage: part,
-                            isAtEndOfResponse: onlyProgressMessagesAfterI(renderableResponse, index),
-                            isLast: index === renderableResponse.length - 1,
-                        };
-                    }
-                    else if (part.kind === 'command' ||
-                        part.kind === 'textEditGroup' ||
-                        part.kind === 'confirmation' ||
-                        part.kind === 'warning') {
-                        partsToRender[index] = part;
-                    }
-                    else if (part.kind === 'progressTask') {
-                        partsToRender[index] = {
-                            task: part,
-                            isSettled: part.isSettled?.() ?? true,
-                            progressLength: part.progress.length,
-                        };
-                    }
-                    else {
-                        const wordCountResult = this.getDataForProgressiveRender(element, contentToMarkdown(part.content), { renderedWordCount: 0, lastRenderTime: 0 });
-                        if (wordCountResult !== undefined) {
-                            this.traceLayout('doNextProgressiveRender', `Rendering new part ${index}, wordCountResult=${wordCountResult.actualWordCount}, rate=${wordCountResult.rate}`);
-                            partsToRender[index] = {
-                                renderedWordCount: wordCountResult.actualWordCount,
-                                lastRenderTime: Date.now(),
-                                isFullyRendered: wordCountResult.isFullString,
-                                originalMarkdown: part.content,
-                            };
-                            wordCountResults[index] = wordCountResult;
-                        }
-                    }
-                }
-                else if ((part.kind === 'markdownContent' || part.kind === 'progressMessage') && isMarkdownRenderData(renderedPart)) {
-                    const wordCountResult = this.getDataForProgressiveRender(element, contentToMarkdown(part.content), renderedPart);
-                    if (wordCountResult !== undefined && renderedPart.renderedWordCount !== wordCountResult?.actualWordCount) {
-                        this.traceLayout('doNextProgressiveRender', `Rendering changed part ${index}, wordCountResult=${wordCountResult.actualWordCount}, rate=${wordCountResult.rate}`);
-                        partsToRender[index] = {
-                            renderedWordCount: wordCountResult.actualWordCount,
-                            lastRenderTime: Date.now(),
-                            isFullyRendered: wordCountResult.isFullString,
-                            originalMarkdown: part.content,
-                        };
-                        wordCountResults[index] = wordCountResult;
-                    }
-                    else if (!renderedPart.isFullyRendered && !wordCountResult) {
-                        somePartIsNotFullyRendered = true;
-                    }
-                }
-                else if (part.kind === 'progressMessage' && isProgressMessageRenderData(renderedPart) && ((renderedPart.isAtEndOfResponse !== onlyProgressMessagesAfterI(renderableResponse, index)) ||
-                    renderedPart.isLast !== (index === renderableResponse.length - 1))) {
-                    partsToRender[index] = {
-                        progressMessage: part,
-                        isAtEndOfResponse: onlyProgressMessagesAfterI(renderableResponse, index),
-                        isLast: index === renderableResponse.length - 1,
-                    };
-                }
-                else if (part.kind === 'progressTask' && isProgressTaskRenderData(renderedPart)) {
-                    const isSettled = part.isSettled?.() ?? true;
-                    if (renderedPart.isSettled !== isSettled || part.progress.length !== renderedPart.progressLength || isSettled) {
-                        partsToRender[index] = { task: part, isSettled, progressLength: part.progress.length };
-                    }
-                }
-            });
-            isFullyRendered = partsToRender.filter((p) => !('isSettled' in p) || !p.isSettled).length === 0 && !somePartIsNotFullyRendered;
+            this.traceLayout('doNextProgressiveRender', `START progressive render, index=${index}, renderData=${JSON.stringify(element.renderData)}`);
+            const contentForThisTurn = this.getNextProgressiveRenderContent(element);
+            const partsToRender = this.diff(templateData.renderedParts ?? [], contentForThisTurn, element);
+            isFullyRendered = partsToRender.every(part => part === null);
             if (isFullyRendered && element.isComplete) {
-                this.traceLayout('runProgressiveRender', `end progressive render, index=${index} and clearing renderData, response is complete, index=${index}`);
+                this.traceLayout('doNextProgressiveRender', `END progressive render, index=${index} and clearing renderData, response is complete`);
                 element.renderData = undefined;
-                disposables.clear();
-                this.basicRenderElement(renderableResponse, element, index, templateData);
+                this.basicRenderElement(element, index, templateData);
             }
             else if (!isFullyRendered) {
-                disposables.clear();
-                this.renderContentReferencesIfNeeded(element, templateData, disposables);
-                let hasRenderedOneMarkdownBlock = false;
-                partsToRender.forEach((partToRender, index) => {
-                    if (!partToRender) {
-                        return;
-                    }
-                    let result;
-                    if (isInteractiveProgressTreeData(partToRender)) {
-                        result = this.renderTreeData(partToRender, element, templateData, index);
-                    }
-                    else if (isProgressMessageRenderData(partToRender)) {
-                        if (onlyProgressMessageRenderDatasAfterI(partsToRender, index)) {
-                            result = this.renderProgressMessage(partToRender.progressMessage, index === partsToRender.length - 1);
-                        }
-                        else {
-                            result = null;
-                        }
-                    }
-                    else if (isProgressTaskRenderData(partToRender)) {
-                        result = this.renderProgressTask(partToRender.task, !partToRender.isSettled, element, templateData);
-                    }
-                    else if (isCommandButtonRenderData(partToRender)) {
-                        result = this.renderCommandButton(element, partToRender);
-                    }
-                    else if (isTextEditRenderData(partToRender)) {
-                        result = this.renderTextEdit(element, partToRender, templateData);
-                    }
-                    else if (isConfirmationRenderData(partToRender)) {
-                        result = this.renderConfirmation(element, partToRender, templateData);
-                    }
-                    else if (isWarningRenderData(partToRender)) {
-                        result = this.renderNotification('warning', partToRender.content);
-                    }
-                    else if (!hasRenderedOneMarkdownBlock && wordCountResults[index]) {
-                        const { value } = wordCountResults[index];
-                        const part = partsToRender[index];
-                        const originalMarkdown = 'originalMarkdown' in part ? part.originalMarkdown : undefined;
-                        const markdownToRender = ( (new MarkdownString(value, originalMarkdown)));
-                        result = this.renderMarkdown(markdownToRender, element, templateData, true);
-                        hasRenderedOneMarkdownBlock = true;
-                    }
-                    if (result === undefined) {
-                        return;
-                    }
-                    renderedParts[index] = partToRender;
-                    const existingElement = templateData.value.children[index];
-                    if (existingElement) {
-                        if (result === null) {
-                            templateData.value.replaceChild($('span.placeholder-for-deleted-thing'), existingElement);
-                        }
-                        else {
-                            templateData.value.replaceChild(result.element, existingElement);
-                        }
-                    }
-                    else if (result) {
-                        templateData.value.appendChild(result.element);
-                    }
-                    if (result) {
-                        disposables.add(result);
-                    }
-                });
+                this.traceLayout('doNextProgressiveRender', `doing progressive render, ${partsToRender.length} parts to render`);
+                this.renderChatContentDiff(partsToRender, contentForThisTurn, element, templateData);
             }
             else {
                 return false;
@@ -618,420 +468,230 @@ let ChatListItemRenderer = class ChatListItemRenderer extends Disposable {
         }
         return isFullyRendered;
     }
-    renderTreeData(data, element, templateData, treeDataIndex) {
-        const treeDisposables = ( (new DisposableStore()));
-        const ref = treeDisposables.add(this._treePool.get());
-        const tree = ref.object;
-        treeDisposables.add(tree.onDidOpen((e) => {
-            if (e.element && !('children' in e.element)) {
-                this.openerService.open(e.element.uri);
+    renderChatContentDiff(partsToRender, contentForThisTurn, element, templateData) {
+        const renderedParts = templateData.renderedParts ?? [];
+        templateData.renderedParts = renderedParts;
+        partsToRender.forEach((partToRender, index) => {
+            if (!partToRender) {
+                return;
             }
-        }));
-        treeDisposables.add(tree.onDidChangeCollapseState(() => {
-            this.updateItemHeight(templateData);
-        }));
-        treeDisposables.add(tree.onContextMenu((e) => {
-            e.browserEvent.preventDefault();
-            e.browserEvent.stopPropagation();
-        }));
-        tree.setInput(data).then(() => {
-            if (!ref.isStale()) {
-                tree.layout();
-                this.updateItemHeight(templateData);
+            const alreadyRenderedPart = templateData.renderedParts?.[index];
+            if (alreadyRenderedPart) {
+                alreadyRenderedPart.dispose();
             }
-        });
-        if (isResponseVM(element)) {
-            const fileTreeFocusInfo = {
-                treeDataId: ( (data.uri.toString())),
-                treeIndex: treeDataIndex,
-                focus() {
-                    tree.domFocus();
-                }
+            const preceedingContentParts = renderedParts.slice(0, index);
+            const context = {
+                element,
+                content: contentForThisTurn,
+                preceedingContentParts,
+                index
             };
-            treeDisposables.add(tree.onDidFocus(() => {
-                this.focusedFileTreesByResponseId.set(element.id, fileTreeFocusInfo.treeIndex);
-            }));
-            const fileTrees = this.fileTreesByResponseId.get(element.id) ?? [];
-            fileTrees.push(fileTreeFocusInfo);
-            this.fileTreesByResponseId.set(element.id, distinct(fileTrees, (v) => v.treeDataId));
-            treeDisposables.add(toDisposable(() => this.fileTreesByResponseId.set(element.id, fileTrees.filter(v => v.treeDataId !== ( (data.uri.toString()))))));
-        }
-        return {
-            element: tree.getHTMLElement().parentElement,
-            dispose: () => {
-                treeDisposables.dispose();
+            const newPart = this.renderChatContentPart(partToRender, templateData, context);
+            if (newPart) {
+                if (alreadyRenderedPart) {
+                    try {
+                        alreadyRenderedPart.domNode.replaceWith(newPart.domNode);
+                    }
+                    catch (err) {
+                        this.logService.error('ChatListItemRenderer#renderChatContentDiff: error replacing part', err);
+                    }
+                }
+                else {
+                    templateData.value.appendChild(newPart.domNode);
+                }
+                renderedParts[index] = newPart;
             }
-        };
+            else if (alreadyRenderedPart) {
+                alreadyRenderedPart.domNode.remove();
+            }
+        });
     }
-    renderContentReferencesIfNeeded(element, templateData, disposables) {
-        if (isResponseVM(element) && this._usedReferencesEnabled && element.contentReferences.length) {
-            show(templateData.referencesListContainer);
-            const contentReferencesListResult = this.renderContentReferencesListData(null, element.contentReferences, element, templateData);
-            if (templateData.referencesListContainer.firstChild) {
-                templateData.referencesListContainer.replaceChild(contentReferencesListResult.element, templateData.referencesListContainer.firstChild);
+    getNextProgressiveRenderContent(element) {
+        const data = this.getDataForProgressiveRender(element);
+        const renderableResponse = annotateSpecialMarkdownContent(element.response.value);
+        this.traceLayout('getNextProgressiveRenderContent', `Want to render ${data.numWordsToRender}, counting...`);
+        let numNeededWords = data.numWordsToRender;
+        const partsToRender = [];
+        if (element.contentReferences.length) {
+            partsToRender.push({ kind: 'references', references: element.contentReferences });
+        }
+        for (const part of renderableResponse) {
+            if (numNeededWords <= 0) {
+                break;
+            }
+            if (part.kind === 'markdownContent') {
+                const wordCountResult = getNWords(part.content.value, numNeededWords);
+                if (wordCountResult.isFullString) {
+                    partsToRender.push(part);
+                }
+                else {
+                    partsToRender.push({ kind: 'markdownContent', content: ( (new MarkdownString(wordCountResult.value, part.content))) });
+                }
+                this.traceLayout('getNextProgressiveRenderContent', `  Want to render ${numNeededWords} words and found ${wordCountResult.returnedWordCount} words. Total words in chunk: ${wordCountResult.totalWordCount}`);
+                numNeededWords -= wordCountResult.returnedWordCount;
             }
             else {
-                templateData.referencesListContainer.appendChild(contentReferencesListResult.element);
+                partsToRender.push(part);
             }
-            disposables.add(contentReferencesListResult);
         }
-        else {
-            hide(templateData.referencesListContainer);
+        this.traceLayout('getNextProgressiveRenderContent', `Want to render ${data.numWordsToRender} words and ${data.numWordsToRender - numNeededWords} words available`);
+        const newRenderedWordCount = data.numWordsToRender - numNeededWords;
+        if (newRenderedWordCount !== element.renderData?.renderedWordCount) {
+            element.renderData = { lastRenderTime: Date.now(), renderedWordCount: newRenderedWordCount, renderedParts: partsToRender };
         }
+        return partsToRender;
     }
-    renderContentReferencesListData(task, data, element, templateData) {
-        const listDisposables = ( (new DisposableStore()));
-        const referencesLabel = task?.content.value ?? (data.length > 1 ?
-            ( localizeWithPath(_moduleId, 2, "Used {0} references", data.length)) :
-            ( localizeWithPath(_moduleId, 3, "Used {0} reference", 1)));
-        const iconElement = $('.chat-used-context-icon');
-        const icon = (element) => element.usedReferencesExpanded ? Codicon.chevronDown : Codicon.chevronRight;
-        iconElement.classList.add(...ThemeIcon.asClassNameArray(icon(element)));
-        const buttonElement = $('.chat-used-context-label', undefined);
-        const collapseButton = listDisposables.add(( (new Button(buttonElement, {
-            buttonBackground: undefined,
-            buttonBorder: undefined,
-            buttonForeground: undefined,
-            buttonHoverBackground: undefined,
-            buttonSecondaryBackground: undefined,
-            buttonSecondaryForeground: undefined,
-            buttonSecondaryHoverBackground: undefined,
-            buttonSeparator: undefined
-        }))));
-        const container = $('.chat-used-context', undefined, buttonElement);
-        collapseButton.label = referencesLabel;
-        collapseButton.element.prepend(iconElement);
-        this.updateAriaLabel(collapseButton.element, referencesLabel, element.usedReferencesExpanded);
-        container.classList.toggle('chat-used-context-collapsed', !element.usedReferencesExpanded);
-        listDisposables.add(collapseButton.onDidClick(() => {
-            iconElement.classList.remove(...ThemeIcon.asClassNameArray(icon(element)));
-            element.usedReferencesExpanded = !element.usedReferencesExpanded;
-            iconElement.classList.add(...ThemeIcon.asClassNameArray(icon(element)));
-            container.classList.toggle('chat-used-context-collapsed', !element.usedReferencesExpanded);
-            this.updateItemHeight(templateData);
-            this.updateAriaLabel(collapseButton.element, referencesLabel, element.usedReferencesExpanded);
-        }));
-        const ref = listDisposables.add(this._contentReferencesListPool.get());
-        const list = ref.object;
-        container.appendChild(list.getHTMLElement().parentElement);
-        listDisposables.add(list.onDidOpen((e) => {
-            if (e.element && 'reference' in e.element) {
-                const uriOrLocation = 'variableName' in e.element.reference ? e.element.reference.value : e.element.reference;
-                const uri = URI.isUri(uriOrLocation) ? uriOrLocation :
-                    uriOrLocation?.uri;
-                if (uri) {
-                    this.openerService.open(uri, {
-                        fromUserGesture: true,
-                        editorOptions: {
-                            ...e.editorOptions,
-                            ...{
-                                selection: uriOrLocation && 'range' in uriOrLocation ? uriOrLocation.range : undefined
-                            }
-                        }
-                    });
-                }
-            }
-        }));
-        listDisposables.add(list.onContextMenu((e) => {
-            e.browserEvent.preventDefault();
-            e.browserEvent.stopPropagation();
-        }));
-        const maxItemsShown = 6;
-        const itemsShown = Math.min(data.length, maxItemsShown);
-        const height = itemsShown * 22;
-        list.layout(height);
-        list.getHTMLElement().style.height = `${height}px`;
-        list.splice(0, list.length, data);
+    getDataForProgressiveRender(element) {
+        const renderData = element.renderData ?? { lastRenderTime: 0, renderedWordCount: 0 };
+        const rate = this.getProgressiveRenderRate(element);
+        const numWordsToRender = renderData.lastRenderTime === 0 ?
+            1 :
+            renderData.renderedWordCount +
+                Math.floor((Date.now() - renderData.lastRenderTime) / 1000 * rate);
         return {
-            element: container,
-            dispose: () => {
-                listDisposables.dispose();
-            }
+            numWordsToRender,
+            rate
         };
     }
-    updateAriaLabel(element, label, expanded) {
-        element.ariaLabel = expanded ? ( localizeWithPath(_moduleId, 4, "{0}, expanded", label)) : ( localizeWithPath(_moduleId, 5, "{0}, collapsed", label));
+    diff(renderedParts, contentToRender, element) {
+        const diff = [];
+        for (let i = 0; i < contentToRender.length; i++) {
+            const content = contentToRender[i];
+            const renderedPart = renderedParts[i];
+            if (!renderedPart || !renderedPart.hasSameContent(content, contentToRender.slice(i + 1), element)) {
+                diff.push(content);
+            }
+            else {
+                diff.push(null);
+            }
+        }
+        return diff;
     }
-    renderProgressTask(task, showSpinner, element, templateData) {
-        if (!isResponseVM(element)) {
-            return;
+    renderChatContentPart(content, templateData, context) {
+        if (content.kind === 'treeData') {
+            return this.renderTreeData(content, templateData, context);
         }
-        if (task.progress.length) {
-            const refs = this.renderContentReferencesListData(task, task.progress, element, templateData);
-            const node = $$1('.chat-progress-task');
-            node.appendChild(refs.element);
-            return { element: node, dispose: refs.dispose };
+        else if (content.kind === 'progressMessage') {
+            return this.instantiationService.createInstance(ChatProgressContentPart, content, this.renderer, context);
         }
-        return this.renderProgressMessage(task, showSpinner);
-    }
-    renderProgressMessage(progress, showSpinner) {
-        if (showSpinner) {
-            alert(progress.content.value);
+        else if (content.kind === 'progressTask') {
+            return this.renderProgressTask(content, templateData, context);
         }
-        const codicon = showSpinner ? ThemeIcon.modify(Codicon.loading, 'spin').id : Codicon.check.id;
-        const markdown = ( (new MarkdownString(`$(${codicon}) ${progress.content.value}`, {
-            supportThemeIcons: true
-        })));
-        const result = this.renderer.render(markdown);
-        result.element.classList.add('progress-step');
-        return result;
-    }
-    renderCommandButton(element, commandButton) {
-        const container = $('.chat-command-button');
-        const disposables = ( (new DisposableStore()));
-        const enabled = !isResponseVM(element) || !element.isStale;
-        const tooltip = enabled ?
-            commandButton.command.tooltip :
-            ( localizeWithPath(_moduleId, 6, "Button not available in restored chat"));
-        const button = disposables.add(( (new Button(container, { ...defaultButtonStyles, supportIcons: true, title: tooltip }))));
-        button.label = commandButton.command.title;
-        button.enabled = enabled;
-        disposables.add(button.onDidClick(() => this.commandService.executeCommand(commandButton.command.id, ...(commandButton.command.arguments ?? []))));
-        return {
-            dispose() {
-                disposables.dispose();
-            },
-            element: container
-        };
-    }
-    renderNotification(kind, content) {
-        const container = $('.chat-notification-widget');
-        let icon;
-        let iconClass;
-        switch (kind) {
-            case 'warning':
-                icon = Codicon.warning;
-                iconClass = '.chat-warning-codicon';
-                break;
-            case 'error':
-                icon = Codicon.error;
-                iconClass = '.chat-error-codicon';
-                break;
-            case 'info':
-                icon = Codicon.info;
-                iconClass = '.chat-info-codicon';
-                break;
+        else if (content.kind === 'command') {
+            return this.instantiationService.createInstance(ChatCommandButtonContentPart, content, context);
         }
-        container.appendChild($(iconClass, undefined, renderIcon(icon)));
-        const markdownContent = this.renderer.render(content);
-        container.appendChild(markdownContent.element);
-        return {
-            element: container,
-            dispose() { markdownContent.dispose(); }
-        };
+        else if (content.kind === 'textEditGroup') {
+            return this.renderTextEdit(context, content, templateData);
+        }
+        else if (content.kind === 'confirmation') {
+            return this.renderConfirmation(context, content, templateData);
+        }
+        else if (content.kind === 'warning') {
+            return this.instantiationService.createInstance(ChatWarningContentPart, 'warning', content.content, this.renderer);
+        }
+        else if (content.kind === 'markdownContent') {
+            return this.renderMarkdown(content.content, templateData, context);
+        }
+        else if (content.kind === 'references') {
+            return this.renderContentReferencesListData(content, undefined, context, templateData);
+        }
+        return undefined;
     }
-    renderConfirmation(element, confirmation, templateData) {
-        const store = ( (new DisposableStore()));
-        const confirmationWidget = store.add(this.instantiationService.createInstance(ChatConfirmationWidget, confirmation.title, confirmation.message, [
-            { label: ( localizeWithPath(_moduleId, 7, "Accept")), data: confirmation.data },
-            { label: ( localizeWithPath(_moduleId, 8, "Dismiss")), data: confirmation.data, isSecondary: true },
-        ]));
-        confirmationWidget.setShowButtons(!confirmation.isUsed);
-        store.add(confirmationWidget.onDidClick(async (e) => {
-            if (isResponseVM(element)) {
-                const prompt = `${e.label}: "${confirmation.title}"`;
-                const data = e.isSecondary ?
-                    { rejectedConfirmationData: [e.data] } :
-                    { acceptedConfirmationData: [e.data] };
-                data.agentId = element.agent?.id;
-                if (await this.chatService.sendRequest(element.sessionId, prompt, data)) {
-                    confirmation.isUsed = true;
-                    confirmationWidget.setShowButtons(false);
-                    this.updateItemHeight(templateData);
-                }
-            }
+    renderTreeData(content, templateData, context) {
+        const data = content.treeData;
+        const treeDataIndex = context.preceedingContentParts.filter(part => part instanceof ChatTreeContentPart).length;
+        const treePart = this.instantiationService.createInstance(ChatTreeContentPart, data, context.element, this._treePool, treeDataIndex);
+        treePart.addDisposable(treePart.onDidChangeHeight(() => {
+            this.updateItemHeight(templateData);
         }));
-        return {
-            element: confirmationWidget.domNode,
-            dispose() { store.dispose(); }
-        };
-    }
-    renderTextEdit(element, chatTextEdit, templateData) {
-        if (this.rendererOptions.renderTextEditsAsSummary?.(chatTextEdit.uri)) {
-            if (isResponseVM(element) && element.response.value.every(item => item.kind === 'textEditGroup')) {
-                return {
-                    element: $('.interactive-edits-summary', undefined, !element.isComplete ? ( localizeWithPath(_moduleId, 9, "Making changes...")) : ( localizeWithPath(_moduleId, 10, "Made changes."))),
-                    dispose() { }
-                };
-            }
-            return undefined;
+        if (isResponseVM(context.element)) {
+            const fileTreeFocusInfo = {
+                treeDataId: ( (data.uri.toString())),
+                treeIndex: treeDataIndex,
+                focus() {
+                    treePart.domFocus();
+                }
+            };
+            treePart.addDisposable(treePart.onDidFocus(() => {
+                this.focusedFileTreesByResponseId.set(context.element.id, fileTreeFocusInfo.treeIndex);
+            }));
+            const fileTrees = this.fileTreesByResponseId.get(context.element.id) ?? [];
+            fileTrees.push(fileTreeFocusInfo);
+            this.fileTreesByResponseId.set(context.element.id, distinct(fileTrees, (v) => v.treeDataId));
+            treePart.addDisposable(toDisposable(() => this.fileTreesByResponseId.set(context.element.id, fileTrees.filter(v => v.treeDataId !== ( (data.uri.toString()))))));
         }
-        const store = ( (new DisposableStore()));
-        const cts = ( (new CancellationTokenSource()));
-        let isDisposed = false;
-        store.add(toDisposable(() => {
-            isDisposed = true;
-            cts.dispose(true);
-        }));
-        const ref = this._diffEditorPool.get();
-        store.add(ref.object.onDidChangeContentHeight(() => {
-            ref.object.layout(this._currentLayoutWidth);
+        return treePart;
+    }
+    renderContentReferencesListData(references, labelOverride, context, templateData) {
+        const referencesPart = this.instantiationService.createInstance(ChatReferencesContentPart, references.references, labelOverride, context.element, this._contentReferencesListPool);
+        referencesPart.addDisposable(referencesPart.onDidChangeHeight(() => {
             this.updateItemHeight(templateData);
         }));
-        const data = {
-            element,
-            edit: chatTextEdit,
-            diffData: (async () => {
-                const ref = await this.textModelService.createModelReference(chatTextEdit.uri);
-                if (isDisposed) {
-                    ref.dispose();
-                    return;
-                }
-                store.add(ref);
-                const original = ref.object.textEditorModel;
-                let originalSha1 = '';
-                if (chatTextEdit.state) {
-                    originalSha1 = chatTextEdit.state.sha1;
-                }
-                else {
-                    const sha1 = ( (new DefaultModelSHA1Computer()));
-                    if (sha1.canComputeSHA1(original)) {
-                        originalSha1 = sha1.computeSHA1(original);
-                        chatTextEdit.state = { sha1: originalSha1, applied: 0 };
-                    }
-                }
-                const modified = this.modelService.createModel(createTextBufferFactoryFromSnapshot(original.createSnapshot()), { languageId: original.getLanguageId(), onDidChange: Event.None }, ( (URI.from(
-                    { scheme: Schemas.vscodeChatCodeBlock, path: original.uri.path, query: generateUuid() }
-                ))), false);
-                const modRef = await this.textModelService.createModelReference(modified.uri);
-                store.add(modRef);
-                const editGroups = [];
-                if (isResponseVM(element)) {
-                    const chatModel = this.chatService.getSession(element.sessionId);
-                    for (const request of chatModel.getRequests()) {
-                        if (!request.response) {
-                            continue;
-                        }
-                        for (const item of request.response.response.value) {
-                            if (item.kind !== 'textEditGroup' || item.state?.applied || !isEqual(item.uri, chatTextEdit.uri)) {
-                                continue;
-                            }
-                            for (const group of item.edits) {
-                                const edits = ( (group.map(TextEdit.asEditOperation)));
-                                editGroups.push(edits);
-                            }
-                        }
-                        if (request.response === element.model) {
-                            break;
-                        }
-                    }
-                }
-                for (const edits of editGroups) {
-                    modified.pushEditOperations(null, edits, () => null);
-                }
-                return {
-                    modified,
-                    original,
-                    originalSha1
-                };
-            })()
-        };
-        ref.object.render(data, this._currentLayoutWidth, cts.token);
-        return {
-            element: ref.object.element,
-            dispose() {
-                store.dispose();
-                ref.dispose();
-            },
-        };
+        return referencesPart;
     }
-    renderMarkdown(markdown, element, templateData, fillInIncompleteTokens = false, codeBlockStartIndex = 0) {
-        const disposables = ( (new DisposableStore()));
-        const orderedDisposablesList = [];
-        const codeblocks = [];
-        let codeBlockIndex = codeBlockStartIndex;
-        const result = this.renderer.render(markdown, {
-            fillInIncompleteTokens,
-            codeBlockRendererSync: (languageId, text) => {
-                const index = codeBlockIndex++;
-                let textModel;
-                let range;
-                let vulns;
-                if (equalsIgnoreCase(languageId, localFileLanguageId)) {
-                    try {
-                        const parsedBody = parseLocalFileData(text);
-                        range = parsedBody.range && Range.lift(parsedBody.range);
-                        textModel = this.textModelService.createModelReference(parsedBody.uri).then(ref => ref.object);
-                    }
-                    catch (e) {
-                        return $('div');
-                    }
-                }
-                else {
-                    if (!isRequestVM(element) && !isResponseVM(element)) {
-                        console.error('Trying to render code block in welcome', element.id, index);
-                        return $('div');
-                    }
-                    const sessionId = isResponseVM(element) || isRequestVM(element) ? element.sessionId : '';
-                    const modelEntry = this.codeBlockModelCollection.getOrCreate(sessionId, element, index);
-                    vulns = modelEntry.vulns;
-                    textModel = modelEntry.model;
-                }
-                const hideToolbar = isResponseVM(element) && element.errorDetails?.responseIsFiltered;
-                const ref = this.renderCodeBlock({ languageId, textModel, codeBlockIndex: index, element, range, hideToolbar, parentContextKeyService: templateData.contextKeyService, vulns }, text);
-                disposables.add(ref.object.onDidChangeContentHeight(() => {
-                    ref.object.layout(this._currentLayoutWidth);
-                    this.updateItemHeight(templateData);
-                }));
-                if (isResponseVM(element)) {
-                    const info = {
-                        codeBlockIndex: index,
-                        element,
-                        focus() {
-                            ref.object.focus();
-                        }
-                    };
-                    codeblocks.push(info);
-                    if (ref.object.uri) {
-                        const uri = ref.object.uri;
-                        this.codeBlocksByEditorUri.set(uri, info);
-                        disposables.add(toDisposable(() => this.codeBlocksByEditorUri.delete(uri)));
-                    }
-                }
-                orderedDisposablesList.push(ref);
-                return ref.object.element;
-            },
-            asyncRenderCallback: () => this.updateItemHeight(templateData),
-        });
-        if (isResponseVM(element)) {
-            this.codeBlocksByResponseId.set(element.id, codeblocks);
-            disposables.add(toDisposable(() => this.codeBlocksByResponseId.delete(element.id)));
+    renderProgressTask(task, templateData, context) {
+        if (!isResponseVM(context.element)) {
+            return;
         }
-        disposables.add(this.markdownDecorationsRenderer.walkTreeAndAnnotateReferenceLinks(result.element));
-        orderedDisposablesList.reverse().forEach(d => disposables.add(d));
-        return {
-            codeBlockCount: codeBlockIndex - codeBlockStartIndex,
-            element: result.element,
-            dispose() {
-                result.dispose();
-                disposables.dispose();
-            }
-        };
+        const taskPart = this.instantiationService.createInstance(ChatTaskContentPart, task, this._contentReferencesListPool, this.renderer, context);
+        taskPart.addDisposable(taskPart.onDidChangeHeight(() => {
+            this.updateItemHeight(templateData);
+        }));
+        return taskPart;
     }
-    renderCodeBlock(data, text) {
-        const ref = this._editorPool.get();
-        const editorInfo = ref.object;
-        if (isResponseVM(data.element)) {
-            this.codeBlockModelCollection.update(data.element.sessionId, data.element, data.codeBlockIndex, { text, languageId: data.languageId });
-        }
-        editorInfo.render(data, this._currentLayoutWidth, this.rendererOptions.editableCodeBlock);
-        return ref;
+    renderConfirmation(context, confirmation, templateData) {
+        const part = this.instantiationService.createInstance(ChatConfirmationContentPart, confirmation, context);
+        part.addDisposable(part.onDidChangeHeight(() => this.updateItemHeight(templateData)));
+        return part;
     }
-    getDataForProgressiveRender(element, data, renderData) {
-        const rate = this.getProgressiveRenderRate(element);
-        const numWordsToRender = renderData.lastRenderTime === 0 ?
-            1 :
-            renderData.renderedWordCount +
-                Math.floor((Date.now() - renderData.lastRenderTime) / 1000 * rate);
-        if (numWordsToRender === renderData.renderedWordCount) {
-            return undefined;
-        }
-        return {
-            ...getNWords(data.value, numWordsToRender),
-            rate
-        };
+    renderTextEdit(context, chatTextEdit, templateData) {
+        const textEditPart = this.instantiationService.createInstance(ChatTextEditContentPart, chatTextEdit, context, this.rendererOptions, this._diffEditorPool, this._currentLayoutWidth);
+        textEditPart.addDisposable(textEditPart.onDidChangeHeight(() => {
+            textEditPart.layout(this._currentLayoutWidth);
+            this.updateItemHeight(templateData);
+        }));
+        return textEditPart;
+    }
+    renderMarkdown(markdown, templateData, context) {
+        const element = context.element;
+        const fillInIncompleteTokens = isResponseVM(element) && (!element.isComplete || element.isCanceled || element.errorDetails?.responseIsFiltered || element.errorDetails?.responseIsIncomplete || !!element.renderData);
+        const codeBlockStartIndex = context.preceedingContentParts.reduce((acc, part) => acc + (part instanceof ChatMarkdownContentPart ? part.codeblocks.length : 0), 0);
+        const markdownPart = this.instantiationService.createInstance(ChatMarkdownContentPart, markdown, context, this._editorPool, fillInIncompleteTokens, codeBlockStartIndex, this.renderer, this._currentLayoutWidth, this.codeBlockModelCollection, this.rendererOptions);
+        markdownPart.addDisposable(markdownPart.onDidChangeHeight(() => {
+            markdownPart.layout(this._currentLayoutWidth);
+            this.updateItemHeight(templateData);
+        }));
+        const codeBlocksByResponseId = this.codeBlocksByResponseId.get(element.id) ?? [];
+        this.codeBlocksByResponseId.set(element.id, codeBlocksByResponseId);
+        markdownPart.addDisposable(toDisposable(() => {
+            const codeBlocksByResponseId = this.codeBlocksByResponseId.get(element.id);
+            if (codeBlocksByResponseId) {
+                markdownPart.codeblocks.forEach((info, i) => delete codeBlocksByResponseId[codeBlockStartIndex + i]);
+            }
+        }));
+        markdownPart.codeblocks.forEach((info, i) => {
+            codeBlocksByResponseId[codeBlockStartIndex + i] = info;
+            if (info.uri) {
+                const uri = info.uri;
+                this.codeBlocksByEditorUri.set(uri, info);
+                markdownPart.addDisposable(toDisposable(() => this.codeBlocksByEditorUri.delete(uri)));
+            }
+        });
+        return markdownPart;
     }
     disposeElement(node, index, templateData) {
+        this.traceLayout('disposeElement', `Disposing element, index=${index}`);
+        if (templateData.renderedParts) {
+            try {
+                dispose(coalesce(templateData.renderedParts));
+                templateData.renderedParts = undefined;
+                clearNode(templateData.value);
+            }
+            catch (err) {
+                throw err;
+            }
+        }
+        templateData.currentElement = undefined;
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -1042,14 +702,10 @@ ChatListItemRenderer = ChatListItemRenderer_1 = ( (__decorate([
     ( (__param(6, IInstantiationService))),
     ( (__param(7, IConfigurationService))),
     ( (__param(8, ILogService))),
-    ( (__param(9, IOpenerService))),
-    ( (__param(10, IContextKeyService))),
-    ( (__param(11, IThemeService))),
-    ( (__param(12, ICommandService))),
-    ( (__param(13, ITextModelService))),
-    ( (__param(14, IModelService))),
-    ( (__param(15, IHoverService))),
-    ( (__param(16, IChatService)))
+    ( (__param(9, IContextKeyService))),
+    ( (__param(10, IThemeService))),
+    ( (__param(11, ICommandService))),
+    ( (__param(12, IHoverService)))
 ], ChatListItemRenderer)));
 let ChatListDelegate = class ChatListDelegate {
     constructor(defaultElementHeight, logService) {
@@ -1077,393 +733,10 @@ let ChatListDelegate = class ChatListDelegate {
 ChatListDelegate = ( (__decorate([
     ( (__param(1, ILogService)))
 ], ChatListDelegate)));
-let EditorPool = class EditorPool extends Disposable {
-    inUse() {
-        return this._pool.inUse;
-    }
-    constructor(options, delegate, overflowWidgetsDomNode, instantiationService) {
-        super();
-        this._pool = this._register(( (new ResourcePool(() => {
-            return instantiationService.createInstance(CodeBlockPart, options, MenuId.ChatCodeBlock, delegate, overflowWidgetsDomNode);
-        }))));
-    }
-    get() {
-        const codeBlock = this._pool.get();
-        let stale = false;
-        return {
-            object: codeBlock,
-            isStale: () => stale,
-            dispose: () => {
-                codeBlock.reset();
-                stale = true;
-                this._pool.release(codeBlock);
-            }
-        };
-    }
-};
-EditorPool = ( (__decorate([
-    ( (__param(3, IInstantiationService)))
-], EditorPool)));
-let DiffEditorPool = class DiffEditorPool extends Disposable {
-    inUse() {
-        return this._pool.inUse;
-    }
-    constructor(options, delegate, overflowWidgetsDomNode, instantiationService) {
-        super();
-        this._pool = this._register(( (new ResourcePool(() => {
-            return instantiationService.createInstance(CodeCompareBlockPart, options, MenuId.ChatCompareBlock, delegate, overflowWidgetsDomNode);
-        }))));
-    }
-    get() {
-        const codeBlock = this._pool.get();
-        let stale = false;
-        return {
-            object: codeBlock,
-            isStale: () => stale,
-            dispose: () => {
-                codeBlock.reset();
-                stale = true;
-                this._pool.release(codeBlock);
-            }
-        };
-    }
-};
-DiffEditorPool = ( (__decorate([
-    ( (__param(3, IInstantiationService)))
-], DiffEditorPool)));
-let TreePool = class TreePool extends Disposable {
-    get inUse() {
-        return this._pool.inUse;
-    }
-    constructor(_onDidChangeVisibility, instantiationService, configService, themeService) {
-        super();
-        this._onDidChangeVisibility = _onDidChangeVisibility;
-        this.instantiationService = instantiationService;
-        this.configService = configService;
-        this.themeService = themeService;
-        this._pool = this._register(( (new ResourcePool(() => this.treeFactory()))));
-    }
-    treeFactory() {
-        const resourceLabels = this._register(this.instantiationService.createInstance(ResourceLabels, { onDidChangeVisibility: this._onDidChangeVisibility }));
-        const container = $('.interactive-response-progress-tree');
-        this._register(createFileIconThemableTreeContainerScope(container, this.themeService));
-        const tree = this.instantiationService.createInstance((WorkbenchCompressibleAsyncDataTree), 'ChatListRenderer', container, ( (new ChatListTreeDelegate())), ( (new ChatListTreeCompressionDelegate())), [( (new ChatListTreeRenderer(resourceLabels, this.configService.getValue('explorer.decorations'))))], ( (new ChatListTreeDataSource())), {
-            collapseByDefault: () => false,
-            expandOnlyOnTwistieClick: () => false,
-            identityProvider: {
-                getId: (e) => ( (e.uri.toString()))
-            },
-            accessibilityProvider: {
-                getAriaLabel: (element) => element.label,
-                getWidgetAriaLabel: () => ( localizeWithPath(_moduleId, 11, "File Tree"))
-            },
-            alwaysConsumeMouseWheel: false
-        });
-        return tree;
-    }
-    get() {
-        const object = this._pool.get();
-        let stale = false;
-        return {
-            object,
-            isStale: () => stale,
-            dispose: () => {
-                stale = true;
-                this._pool.release(object);
-            }
-        };
-    }
-};
-TreePool = ( (__decorate([
-    ( (__param(1, IInstantiationService))),
-    ( (__param(2, IConfigurationService))),
-    ( (__param(3, IThemeService)))
-], TreePool)));
-let ContentReferencesListPool = class ContentReferencesListPool extends Disposable {
-    get inUse() {
-        return this._pool.inUse;
-    }
-    constructor(_onDidChangeVisibility, instantiationService, themeService) {
-        super();
-        this._onDidChangeVisibility = _onDidChangeVisibility;
-        this.instantiationService = instantiationService;
-        this.themeService = themeService;
-        this._pool = this._register(( (new ResourcePool(() => this.listFactory()))));
-    }
-    listFactory() {
-        const resourceLabels = this._register(this.instantiationService.createInstance(ResourceLabels, { onDidChangeVisibility: this._onDidChangeVisibility }));
-        const container = $('.chat-used-context-list');
-        this._register(createFileIconThemableTreeContainerScope(container, this.themeService));
-        const list = this.instantiationService.createInstance((WorkbenchList), 'ChatListRenderer', container, ( (new ContentReferencesListDelegate())), [this.instantiationService.createInstance(ContentReferencesListRenderer, resourceLabels)], {
-            alwaysConsumeMouseWheel: false,
-            accessibilityProvider: {
-                getAriaLabel: (element) => {
-                    if (element.kind === 'warning') {
-                        return element.content.value;
-                    }
-                    const reference = element.reference;
-                    if ('variableName' in reference) {
-                        return reference.variableName;
-                    }
-                    else if (URI.isUri(reference)) {
-                        return basename(reference.path);
-                    }
-                    else {
-                        return basename(reference.uri.path);
-                    }
-                },
-                getWidgetAriaLabel: () => ( localizeWithPath(_moduleId, 12, "Used References"))
-            },
-            dnd: {
-                getDragURI: (element) => {
-                    if (element.kind === 'warning') {
-                        return null;
-                    }
-                    const { reference } = element;
-                    if ('variableName' in reference) {
-                        return null;
-                    }
-                    else if (URI.isUri(reference)) {
-                        return (
-                             (reference.toString())
-                        );
-                    }
-                    else {
-                        return (
-                             (reference.uri.toString())
-                        );
-                    }
-                },
-                dispose: () => { },
-                onDragOver: () => false,
-                drop: () => { },
-            },
-        });
-        return list;
-    }
-    get() {
-        const object = this._pool.get();
-        let stale = false;
-        return {
-            object,
-            isStale: () => stale,
-            dispose: () => {
-                stale = true;
-                this._pool.release(object);
-            }
-        };
-    }
-};
-ContentReferencesListPool = ( (__decorate([
-    ( (__param(1, IInstantiationService))),
-    ( (__param(2, IThemeService)))
-], ContentReferencesListPool)));
-class ContentReferencesListDelegate {
-    getHeight(element) {
-        return 22;
-    }
-    getTemplateId(element) {
-        return ContentReferencesListRenderer.TEMPLATE_ID;
-    }
-}
-let ContentReferencesListRenderer = class ContentReferencesListRenderer {
-    static { ContentReferencesListRenderer_1 = this; }
-    static { this.TEMPLATE_ID = 'contentReferencesListRenderer'; }
-    constructor(labels, themeService, chatVariablesService) {
-        this.labels = labels;
-        this.themeService = themeService;
-        this.chatVariablesService = chatVariablesService;
-        this.templateId = ContentReferencesListRenderer_1.TEMPLATE_ID;
-    }
-    renderTemplate(container) {
-        const templateDisposables = ( (new DisposableStore()));
-        const label = templateDisposables.add(this.labels.create(container, { supportHighlights: true }));
-        return { templateDisposables, label };
-    }
-    getReferenceIcon(data) {
-        if (ThemeIcon.isThemeIcon(data.iconPath)) {
-            return data.iconPath;
-        }
-        else {
-            return this.themeService.getColorTheme().type === ColorScheme.DARK && data.iconPath?.dark
-                ? data.iconPath?.dark
-                : data.iconPath?.light;
-        }
-    }
-    renderElement(data, index, templateData, height) {
-        if (data.kind === 'warning') {
-            templateData.label.setResource({ name: data.content.value }, { icon: Codicon.warning });
-            return;
-        }
-        const reference = data.reference;
-        const icon = this.getReferenceIcon(data);
-        templateData.label.element.style.display = 'flex';
-        if ('variableName' in reference) {
-            if (reference.value) {
-                const uri = URI.isUri(reference.value) ? reference.value : reference.value.uri;
-                templateData.label.setResource({
-                    resource: uri,
-                    name: basenameOrAuthority(uri),
-                    description: `#${reference.variableName}`,
-                    range: 'range' in reference.value ? reference.value.range : undefined,
-                }, { icon });
-            }
-            else {
-                const variable = this.chatVariablesService.getVariable(reference.variableName);
-                templateData.label.setLabel(`#${reference.variableName}`, undefined, { title: variable?.description });
-            }
-        }
-        else {
-            const uri = 'uri' in reference ? reference.uri : reference;
-            if (matchesSomeScheme(uri, Schemas.mailto, Schemas.http, Schemas.https)) {
-                templateData.label.setResource({ resource: uri, name: ( (uri.toString())) }, { icon: icon ?? Codicon.globe });
-            }
-            else {
-                templateData.label.setFile(uri, {
-                    fileKind: FileKind.FILE,
-                    fileDecorations: { badges: false, colors: false },
-                    range: 'range' in reference ? reference.range : undefined
-                });
-            }
-        }
-    }
-    disposeTemplate(templateData) {
-        templateData.templateDisposables.dispose();
-    }
-};
-ContentReferencesListRenderer = ContentReferencesListRenderer_1 = ( (__decorate([
-    ( (__param(1, IThemeService))),
-    ( (__param(2, IChatVariablesService)))
-], ContentReferencesListRenderer)));
-class ResourcePool extends Disposable {
-    get inUse() {
-        return this._inUse;
-    }
-    constructor(_itemFactory) {
-        super();
-        this._itemFactory = _itemFactory;
-        this.pool = [];
-        this._inUse = ( (new Set()));
-    }
-    get() {
-        if (this.pool.length > 0) {
-            const item = this.pool.pop();
-            this._inUse.add(item);
-            return item;
-        }
-        const item = this._register(this._itemFactory());
-        this._inUse.add(item);
-        return item;
-    }
-    release(item) {
-        this._inUse.delete(item);
-        this.pool.push(item);
-    }
-}
 class ChatVoteButton extends MenuEntryActionViewItem {
     render(container) {
         super.render(container);
         container.classList.toggle('checked', this.action.checked);
     }
 }
-class ChatListTreeDelegate {
-    static { this.ITEM_HEIGHT = 22; }
-    getHeight(element) {
-        return ChatListTreeDelegate.ITEM_HEIGHT;
-    }
-    getTemplateId(element) {
-        return 'chatListTreeTemplate';
-    }
-}
-class ChatListTreeCompressionDelegate {
-    isIncompressible(element) {
-        return !element.children;
-    }
-}
-class ChatListTreeRenderer {
-    constructor(labels, decorations) {
-        this.labels = labels;
-        this.decorations = decorations;
-        this.templateId = 'chatListTreeTemplate';
-    }
-    renderCompressedElements(element, index, templateData, height) {
-        templateData.label.element.style.display = 'flex';
-        const label = ( (element.element.elements.map((e) => e.label)));
-        templateData.label.setResource({ resource: element.element.elements[0].uri, name: label }, {
-            title: element.element.elements[0].label,
-            fileKind: element.children ? FileKind.FOLDER : FileKind.FILE,
-            extraClasses: ['explorer-item'],
-            fileDecorations: this.decorations
-        });
-    }
-    renderTemplate(container) {
-        const templateDisposables = ( (new DisposableStore()));
-        const label = templateDisposables.add(this.labels.create(container, { supportHighlights: true }));
-        return { templateDisposables, label };
-    }
-    renderElement(element, index, templateData, height) {
-        templateData.label.element.style.display = 'flex';
-        if (!element.children.length && element.element.type !== FileType.Directory) {
-            templateData.label.setFile(element.element.uri, {
-                fileKind: FileKind.FILE,
-                hidePath: true,
-                fileDecorations: this.decorations,
-            });
-        }
-        else {
-            templateData.label.setResource({ resource: element.element.uri, name: element.element.label }, {
-                title: element.element.label,
-                fileKind: FileKind.FOLDER,
-                fileDecorations: this.decorations
-            });
-        }
-    }
-    disposeTemplate(templateData) {
-        templateData.templateDisposables.dispose();
-    }
-}
-class ChatListTreeDataSource {
-    hasChildren(element) {
-        return !!element.children;
-    }
-    async getChildren(element) {
-        return element.children ?? [];
-    }
-}
-function isInteractiveProgressTreeData(item) {
-    return 'label' in item;
-}
-function contentToMarkdown(str) {
-    return typeof str === 'string' ? { value: str } : str;
-}
-function isProgressMessage(item) {
-    return item && 'kind' in item && item.kind === 'progressMessage';
-}
-function isProgressTaskRenderData(item) {
-    return item && 'isSettled' in item;
-}
-function isWarningRenderData(item) {
-    return item && 'kind' in item && item.kind === 'warning';
-}
-function isProgressMessageRenderData(item) {
-    return item && 'isAtEndOfResponse' in item;
-}
-function isCommandButtonRenderData(item) {
-    return item && 'kind' in item && item.kind === 'command';
-}
-function isTextEditRenderData(item) {
-    return item && 'kind' in item && item.kind === 'textEditGroup';
-}
-function isConfirmationRenderData(item) {
-    return item && 'kind' in item && item.kind === 'confirmation';
-}
-function isMarkdownRenderData(item) {
-    return item && 'renderedWordCount' in item;
-}
-function onlyProgressMessagesAfterI(items, i) {
-    return items.slice(i).every(isProgressMessage);
-}
-function onlyProgressMessageRenderDatasAfterI(items, i) {
-    return items.slice(i).every(isProgressMessageRenderData);
-}
 export { ChatListDelegate, ChatListItemRenderer };