@lvce-editor/chat-view 6.63.0 → 6.65.0

package/dist/chatViewWorkerMain.js

@@ -1198,6 +1198,7 @@ const Reference = 100;
 
 const ClientX = 'event.clientX';
 const ClientY = 'event.clientY';
+const DataTransferFiles2 = 'event.dataTransfer.files2';
 const DefaultPrevented = 'event.defaultPrevented';
 const Key = 'event.key';
 const ShiftKey = 'event.shiftKey';
@@ -1307,6 +1308,10 @@ const showContextMenu2 = async (uid, menuId, x, y, args) => {
   number(y);
   await invoke('ContextMenu.show2', uid, menuId, x, y, args);
 };
+const getFileHandles = async fileIds => {
+  const files = await invoke('FileSystemHandle.getFileHandles', fileIds);
+  return files;
+};
 const sendMessagePortToClipBoardWorker$1 = async (port, rpcId) => {
   const command = 'ClipBoard.handleMessagePort';
   await invokeAndTransfer('SendMessagePortToExtensionHostWorker.sendMessagePortToClipBoardWorker', port, command, rpcId);
@@ -1860,7 +1865,8 @@ const StartConversationByTypingBelow = 'Start a conversation by typing below.';
 const NoMatchingModelsFound = 'No matching models have been found.';
 const ComposePlaceholder = 'Type your message. Enter to send.';
 const AttachImageAsContext = 'Attach Image as Context';
-const RemoveImageAttachment = 'Remove image attachment';
+const OpenImageInNewTab = 'Open image in new tab';
+const RemoveAttachment = 'Remove attachment';
 const ImageCouldNotBeLoaded = 'image could not be loaded';
 const OpenRouterApiKeyPlaceholder = 'Enter OpenRouter API key';
 const OpenApiApiKeyPlaceholder = 'Enter OpenAI API key';
@@ -1955,8 +1961,11 @@ const composePlaceholder = () => {
 const attachImageAsContext = () => {
   return i18nString(AttachImageAsContext);
 };
-const removeImageAttachment = () => {
-  return i18nString(RemoveImageAttachment);
+const openImageInNewTab = () => {
+  return i18nString(OpenImageInNewTab);
+};
+const removeAttachment = () => {
+  return i18nString(RemoveAttachment);
 };
 const imageCouldNotBeLoaded = () => {
   return i18nString(ImageCouldNotBeLoaded);
@@ -3240,6 +3249,24 @@ const getKeyBindings = () => {
   }];
 };
 
+const getMenuEntriesChatAttachment = (attachmentId, previewSrc) => {
+  return [{
+    args: [previewSrc],
+    command: 'Chat.openChatAttachmentInNewTab',
+    flags: None,
+    id: 'openImageInNewTab',
+    // @ts-ignore
+    label: openImageInNewTab()
+  }, {
+    args: [attachmentId],
+    command: 'Chat.removeComposerAttachment',
+    flags: None,
+    id: 'removeAttachment',
+    // @ts-ignore
+    label: removeAttachment()
+  }];
+};
+
 const getMenuEntriesChatHeader = () => {
   // TODO
   return [{
@@ -3299,6 +3326,7 @@ const Composer = 'composer';
 const Search = 'search';
 const ComposerDropTarget = 'composer-drop-target';
 const ComposerAttachmentPrefix = 'composer-attachment:';
+const ComposerAttachmentPreviewPrefix = 'composer-attachment-preview:';
 const ComposerAttachmentRemovePrefix = 'composer-attachment-remove:';
 const AddContext = 'add-context';
 const Dictate = 'dictate';
@@ -3372,6 +3400,12 @@ const getComposerAttachmentInputName = attachmentId => {
 const getComposerAttachmentRemoveInputName = attachmentId => {
   return `${ComposerAttachmentRemovePrefix}${attachmentId}`;
 };
+const isComposerAttachmentPreviewInputName = name => {
+  return name.startsWith(ComposerAttachmentPreviewPrefix);
+};
+const getAttachmentIdFromComposerAttachmentPreviewInputName = name => {
+  return name.slice(ComposerAttachmentPreviewPrefix.length);
+};
 const isComposerAttachmentRemoveInputName = name => {
   return name.startsWith(ComposerAttachmentRemovePrefix);
 };
@@ -3447,12 +3481,15 @@ const MenuChatHeader = 2179;
 const MenuChatInput = 2180;
 const MenuProjectAddButton = 2181;
 const MenuChatProjectList = 2182;
+const MenuChatAttachment = 2183;
 const getMenuEntryIds = () => {
-  return [Chat$2, MenuChatList, MenuChatHeader, MenuChatInput, MenuProjectAddButton, MenuChatProjectList];
+  return [Chat$2, MenuChatList, MenuChatHeader, MenuChatInput, MenuProjectAddButton, MenuChatProjectList, MenuChatAttachment];
 };
 
 const getMenuEntries = (menuId, props) => {
   switch (props.menuId) {
+    case MenuChatAttachment:
+      return getMenuEntriesChatAttachment(props.attachmentId, props.previewSrc);
     case MenuChatHeader:
       return getMenuEntriesChatHeader();
     case MenuChatInput:
@@ -6519,9 +6556,11 @@ const ChatModelPickerItemSelected = 'ChatModelPickerItemSelected';
 const ChatModelPickerItemUsageCost = 'ChatModelPickerItemUsageCost';
 const ChatModelPickerList = 'ChatModelPickerList';
 const ChatName = 'ChatName';
+const ChatOverlays = 'ChatOverlays';
 const ChatOrderedList = 'ChatOrderedList';
 const ChatOrderedListItem = 'ChatOrderedListItem';
 const ChatOrderedListItemContent = 'ChatOrderedListItemContent';
+const ChatOrderedListItemPrefix = 'ChatOrderedListItemPrefix';
 const ChatOrderedListMarker = 'ChatOrderedListMarker';
 const ChatComposerAttachment = 'ChatComposerAttachment';
 const ChatComposerAttachmentImage = 'ChatComposerAttachmentImage';
@@ -8973,7 +9012,8 @@ const handleRemoveComposerAttachment = async (state, attachmentId) => {
   }
   return {
     ...state,
-    composerAttachments: nextComposerAttachments
+    composerAttachments: nextComposerAttachments,
+    composerAttachmentsHeight: getComposerAttachmentsHeight(nextComposerAttachments, state.width)
   };
 };
 
@@ -9417,7 +9457,23 @@ const handleClickSettings = async () => {
   await invoke('Main.openUri', 'app://settings.json');
 };
 
-const handleContextMenuChatImageAttachment = async state => {
+const handleContextMenuChatImageAttachment = async (state, name, eventX, eventY) => {
+  const getFallbackAttachment = () => {
+    const attachmentsWithPreview = state.composerAttachments.filter(attachment => attachment.previewSrc);
+    if (attachmentsWithPreview.length !== 1) {
+      return undefined;
+    }
+    return attachmentsWithPreview[0];
+  };
+  const attachment = isComposerAttachmentPreviewInputName(name) ? state.composerAttachments.find(item => item.attachmentId === getAttachmentIdFromComposerAttachmentPreviewInputName(name)) : getFallbackAttachment();
+  if (!attachment?.previewSrc) {
+    return state;
+  }
+  await showContextMenu2(state.uid, MenuChatAttachment, eventX, eventY, {
+    attachmentId: attachment.attachmentId,
+    menuId: MenuChatAttachment,
+    previewSrc: attachment.previewSrc
+  });
   return state;
 };
 
@@ -9488,7 +9544,23 @@ const handleDragOver = async (state, name, hasFiles = true) => {
   };
 };
 
-const handleDropFiles = async (state, name, files = []) => {
+const getDroppedFiles = async fileHandles => {
+  // TODO adjust e2e test and remove this code
+  if (fileHandles.some(item => typeof item !== 'number')) {
+    return fileHandles.map(item => {
+      return {
+        getFile() {
+          return item;
+        }
+      };
+    });
+  }
+  const actualHandles = await getFileHandles(fileHandles);
+  return actualHandles.map(item => item.value).filter(item => item.kind === 'file');
+};
+
+const handleDropFiles = async (state, name, fileHandles = []) => {
+  const droppedFileHandles = await getDroppedFiles(fileHandles);
   const {
     composerDropActive,
     composerDropEnabled,
@@ -9508,11 +9580,12 @@ const handleDropFiles = async (state, name, files = []) => {
     ...state,
     composerDropActive: false
   };
-  if (!selectedSessionId || files.length === 0) {
+  if (!selectedSessionId || fileHandles.length === 0) {
     return nextState;
   }
   const nextAttachments = [];
-  for (const file of files) {
+  for (const droppedFileHandle of droppedFileHandles) {
+    const file = await droppedFileHandle.getFile();
     const attachmentId = crypto.randomUUID();
     const displayType = await getComposerAttachmentDisplayType(file, file.name, file.type);
     const previewSrc = await getComposerAttachmentPreviewSrc(file, displayType, file.type);
@@ -10649,6 +10722,10 @@ const registerMockResponse = (state, mockResponse) => {
   return state;
 };
 
+const removeComposerAttachment = async (state, attachmentId) => {
+  return handleRemoveComposerAttachment(state, attachmentId);
+};
+
 const getCss = (composerHeight, composerAttachmentsHeight, modelPickerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily, chatFocusContentMaxWidth, textAreaPaddingTop, textAreaPaddingLeft, textAreaPaddingRight, textAreaPaddingBottom, chatSendAreaPaddingTop, chatSendAreaPaddingLeft, chatSendAreaPaddingRight, chatSendAreaPaddingBottom, renderHtmlCss) => {
   const buttonsHeight = 20;
   const gap = 10;
@@ -10758,6 +10835,16 @@ const getCss = (composerHeight, composerAttachmentsHeight, modelPickerHeight, li
   justify-content: flex-end;
 }
 
+.ChatOverlays{
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+}
+
+.ChatOverlays > *{
+  pointer-events: auto;
+}
+
 .RunModePickerPopOver{
   overflow: hidden;
   border: 1px solid var(--vscode-widget-border, var(--vscode-panel-border));
@@ -10770,6 +10857,26 @@ const getCss = (composerHeight, composerAttachmentsHeight, modelPickerHeight, li
   color: var(--vscode-textLink-foreground);
 }
 
+.ChatOrderedListItem{
+  align-items: flex-start;
+  display: flex;
+  gap: 8px;
+}
+
+.ChatOrderedListMarker{
+  flex: none;
+  min-width: 1.5em;
+}
+
+.ChatOrderedListItemContent{
+  flex: 1;
+  min-width: 0;
+}
+
+.ChatOrderedListItemPrefix{
+  white-space: nowrap;
+}
+
 .ChatToolCalls .ChatOrderedList{
   list-style: none;
   margin: 0;
@@ -10929,57 +11036,6 @@ const HandleClickReasoningEffortPickerToggle = 56;
 const HandleClickAgentModePickerToggle = 57;
 const HandleContextMenuChatImageAttachment = 58;
 
-const getCustomSelectOptionVirtualDom = (name, label, selected, detail = '') => {
-  const className = mergeClassNames(ChatModelPickerItem, selected ? ChatModelPickerItemSelected : '');
-  const hasDetail = detail !== '';
-  return [{
-    childCount: 1,
-    type: Li
-  }, {
-    childCount: hasDetail ? 2 : 1,
-    className,
-    inputType: 'button',
-    name,
-    onClick: HandleClick,
-    type: Button$1
-  }, {
-    childCount: 1,
-    className: ChatModelPickerItemLabel,
-    name,
-    type: Span
-  }, text(label), ...(hasDetail ? [{
-    childCount: 1,
-    className: ChatModelPickerItemUsageCost,
-    name,
-    type: Span
-  }, text(detail)] : [])];
-};
-
-const getCustomSelectPopOverVirtualDom = (optionCount, height, optionNodes, containerClassName = '', popOverClassName = '') => {
-  return [{
-    childCount: 1,
-    className: mergeClassNames(ChatModelPickerContainer, containerClassName),
-    type: Div
-  }, {
-    childCount: 1,
-    className: mergeClassNames(ChatModelPicker, popOverClassName),
-    style: `height: ${height}px;`,
-    type: Div
-  }, {
-    childCount: optionCount,
-    className: ChatModelPickerList,
-    type: Ul
-  }, ...optionNodes];
-};
-
-const agentModePickerHeight = agentModes.length * 28;
-const getAgentModeOptionsVirtualDom = selectedAgentMode => {
-  return agentModes.flatMap(agentMode => getCustomSelectOptionVirtualDom(getAgentModePickerItemInputName(agentMode), getAgentModeLabel(agentMode), agentMode === selectedAgentMode));
-};
-const getAgentModePickerPopOverVirtualDom = selectedAgentMode => {
-  return getCustomSelectPopOverVirtualDom(agentModes.length, agentModePickerHeight, getAgentModeOptionsVirtualDom(selectedAgentMode));
-};
-
 const getAddContextButtonDom = () => {
   return [{
     childCount: 1,
@@ -11052,6 +11108,32 @@ const getCreatePullRequestButtonDom = () => {
   }];
 };
 
+const getCustomSelectOptionVirtualDom = (name, label, selected, detail = '') => {
+  const className = mergeClassNames(ChatModelPickerItem, selected ? ChatModelPickerItemSelected : '');
+  const hasDetail = detail !== '';
+  return [{
+    childCount: 1,
+    type: Li
+  }, {
+    childCount: hasDetail ? 2 : 1,
+    className,
+    inputType: 'button',
+    name,
+    onClick: HandleClick,
+    type: Button$1
+  }, {
+    childCount: 1,
+    className: ChatModelPickerItemLabel,
+    name,
+    type: Span
+  }, text(label), ...(hasDetail ? [{
+    childCount: 1,
+    className: ChatModelPickerItemUsageCost,
+    name,
+    type: Span
+  }, text(detail)] : [])];
+};
+
 const reasoningEffortPickerHeight = reasoningEfforts.length * 28;
 const getReasoningEffortOptionsVirtualDom = selectedReasoningEffort => {
   return reasoningEfforts.flatMap(reasoningEffort => {
@@ -11210,16 +11292,13 @@ const getComposerAttachmentClassName = displayType => {
   }
 };
 const getComposerAttachmentRemoveButtonDom = attachment => {
-  if (attachment.displayType !== 'image') {
-    return [];
-  }
   return [{
     buttonType: 'button',
     childCount: 1,
     className: ChatComposerAttachmentRemoveButton,
     name: getComposerAttachmentRemoveInputName(attachment.attachmentId),
     onClick: HandleClick,
-    title: removeImageAttachment(),
+    title: removeAttachment(),
     type: Button$1
   }, {
     text: 'x',
@@ -11234,6 +11313,8 @@ const getComposerAttachmentPreviewDom = attachment => {
     alt: `Image preview for ${attachment.name}`,
     childCount: 0,
     className: ChatComposerAttachmentPreview,
+    name: getComposerAttachmentInputName(attachment.attachmentId),
+    onContextMenu: HandleContextMenuChatImageAttachment,
     src: attachment.previewSrc,
     type: Img
   }];
@@ -11309,6 +11390,31 @@ const getChatSendAreaDom = (composerValue, composerAttachments, agentMode, agent
   }, ...(showAgentModePicker ? getAgentModePickerVirtualDom(agentMode, agentModePickerOpen) : []), ...getChatModelPickerToggleVirtualDom(models, selectedModelId, modelPickerOpen), ...(reasoningPickerEnabled ? getReasoningEffortPickerVirtualDom(reasoningEffort, reasoningEffortPickerOpen) : []), ...(showResponsiveRunModePicker ? getRunModePickerVirtualDom(runMode, runModePickerOpen) : []), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...(addContextButtonEnabled ? getAddContextButtonDom() : []), ...(showCreatePullRequestButton ? getCreatePullRequestButtonDom() : []), ...getSendButtonDom(isSendDisabled, voiceDictationEnabled)];
 };
 
+const getCustomSelectPopOverVirtualDom = (optionCount, height, optionNodes, containerClassName = '', popOverClassName = '') => {
+  return [{
+    childCount: 1,
+    className: mergeClassNames(ChatModelPickerContainer, containerClassName),
+    type: Div
+  }, {
+    childCount: 1,
+    className: mergeClassNames(ChatModelPicker, popOverClassName),
+    style: `height: ${height}px;`,
+    type: Div
+  }, {
+    childCount: optionCount,
+    className: ChatModelPickerList,
+    type: Ul
+  }, ...optionNodes];
+};
+
+const agentModePickerHeight = agentModes.length * 28;
+const getAgentModeOptionsVirtualDom = selectedAgentMode => {
+  return agentModes.flatMap(agentMode => getCustomSelectOptionVirtualDom(getAgentModePickerItemInputName(agentMode), getAgentModeLabel(agentMode), agentMode === selectedAgentMode));
+};
+const getAgentModePickerPopOverVirtualDom = selectedAgentMode => {
+  return getCustomSelectPopOverVirtualDom(agentModes.length, agentModePickerHeight, getAgentModeOptionsVirtualDom(selectedAgentMode));
+};
+
 const getUsageCostLabel = model => {
   return `${model.usageCost ?? 1}x`;
 };
@@ -11375,6 +11481,51 @@ const getChatModelPickerPopOverVirtualDom = (models, selectedModelId, modelPicke
   }, ...getModelPickerHeaderDom(modelPickerSearchValue), ...getChatModelListVirtualDom(visibleModels, selectedModelId)];
 };
 
+const runModes = ['local', 'background', 'cloud'];
+const runModePickerHeight = runModes.length * 28;
+const getRunModeOptionsVirtualDom = selectedRunMode => {
+  return runModes.flatMap(runMode => getCustomSelectOptionVirtualDom(getRunModePickerItemInputName(runMode), runMode, runMode === selectedRunMode));
+};
+const getRunModePickerPopOverVirtualDom = selectedRunMode => {
+  return getCustomSelectPopOverVirtualDom(runModes.length, runModePickerHeight, getRunModeOptionsVirtualDom(selectedRunMode), RunModePickerContainer, RunModePickerPopOver);
+};
+
+const getDropOverlayVirtualDom = () => {
+  return [{
+    childCount: 1,
+    className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
+    name: ComposerDropTarget,
+    onDragLeave: HandleDragLeave,
+    onDragOver: HandleDragOver,
+    onDrop: HandleDrop,
+    type: Div
+  }, {
+    text: attachImageAsContext(),
+    type: Text
+  }];
+};
+const getChatOverlaysVirtualDom = ({
+  agentMode,
+  agentModePickerVisible,
+  dropOverlayVisible,
+  modelPickerSearchValue,
+  modelPickerVisible,
+  runMode,
+  runModePickerVisible,
+  selectedModelId,
+  visibleModels
+}) => {
+  const overlayChildCount = (dropOverlayVisible ? 1 : 0) + (agentModePickerVisible ? 1 : 0) + (modelPickerVisible ? 1 : 0) + (runModePickerVisible ? 1 : 0);
+  if (!overlayChildCount) {
+    return [];
+  }
+  return [{
+    childCount: overlayChildCount,
+    className: ChatOverlays,
+    type: Div
+  }, ...(dropOverlayVisible ? getDropOverlayVirtualDom() : []), ...(agentModePickerVisible ? getAgentModePickerPopOverVirtualDom(agentMode) : []), ...(modelPickerVisible ? getChatModelPickerPopOverVirtualDom(visibleModels, selectedModelId, modelPickerSearchValue) : []), ...(runModePickerVisible ? getRunModePickerPopOverVirtualDom(runMode) : [])];
+};
+
 const getBoldInlineNodeDom = (inlineNode, useChatMathWorker, renderInlineNodeDom) => {
   return [{
     childCount: inlineNode.children.length,
@@ -11538,24 +11689,69 @@ const getHeadingDom = (node, useChatMathWorker) => {
   }, ...node.children.flatMap(child => getInlineNodeDom(child, useChatMathWorker))];
 };
 
+const leadingPunctuationRegex = /^([:;,.!?]+)([\s\S]*)$/;
+const splitLeadingPunctuation = children => {
+  const [firstChild, secondChild, ...restChildren] = children;
+  if (firstChild?.type !== 'bold' || secondChild?.type !== 'text') {
+    return {
+      prefixChildren: [],
+      remainingChildren: children
+    };
+  }
+  const match = secondChild.text.match(leadingPunctuationRegex);
+  if (!match) {
+    return {
+      prefixChildren: [],
+      remainingChildren: children
+    };
+  }
+  const [, punctuation, remainingText] = match;
+  const nextChildren = restChildren;
+  if (remainingText) {
+    nextChildren.unshift({
+      text: remainingText,
+      type: 'text'
+    });
+  }
+  return {
+    prefixChildren: [firstChild, {
+      text: punctuation,
+      type: 'text'
+    }],
+    remainingChildren: nextChildren
+  };
+};
 const getOrderedListItemDom = (item, useChatMathWorker, fallbackIndex, recurseOrdered, recurseUnordered) => {
   const hasNestedList = (item.nestedItems?.length || 0) > 0;
   const nestedListType = item.nestedListType || 'unordered-list';
+  const {
+    prefixChildren,
+    remainingChildren
+  } = splitLeadingPunctuation(item.children);
   const nestedListDom = hasNestedList ? [{
     childCount: item.nestedItems?.length || 0,
     className: nestedListType === 'ordered-list' ? ChatOrderedList : ChatUnorderedList,
     type: nestedListType === 'ordered-list' ? Ol : Ul
   }, ...(item.nestedItems || []).flatMap((nestedItem, index) => nestedListType === 'ordered-list' ? recurseOrdered(nestedItem, useChatMathWorker, index + 1) : recurseUnordered(nestedItem, useChatMathWorker))] : [];
   const marker = `${item.index ?? fallbackIndex}.`;
+  const prefixDom = prefixChildren.length === 0 ? [] : [{
+    childCount: prefixChildren.length,
+    className: ChatOrderedListItemPrefix,
+    type: Span
+  }, ...prefixChildren.flatMap(child => getInlineNodeDom(child, useChatMathWorker))];
   return [{
-    childCount: item.children.length + (hasNestedList ? 1 : 0) + 1,
+    childCount: 2,
     className: ChatOrderedListItem,
     type: Li
   }, {
     childCount: 1,
     className: ChatOrderedListMarker,
     type: Span
-  }, text(marker), ...item.children.flatMap(child => getInlineNodeDom(child, useChatMathWorker)), ...nestedListDom];
+  }, text(marker), {
+    childCount: (prefixDom.length === 0 ? 0 : 1) + remainingChildren.length + (hasNestedList ? 1 : 0),
+    className: ChatOrderedListItemContent,
+    type: Div
+  }, ...prefixDom, ...remainingChildren.flatMap(child => getInlineNodeDom(child, useChatMathWorker)), ...nestedListDom];
 };
 
 const getTableHeadCellDom = (cell, useChatMathWorker) => {
@@ -12761,6 +12957,7 @@ const getMessagesDom = (messages, parsedMessages, openRouterApiKeyInput, openApi
     className: 'ChatMessages',
     onContextMenu: HandleMessagesContextMenu,
     onScroll: HandleMessagesScroll,
+    role: 'log',
     scrollTop: messagesScrollTop,
     type: Div
   }, ...displayMessages.flatMap(item => getChatMessageDom(item.message, item.parsedContent, openRouterApiKeyInput, openApiApiKeyInput, openApiApiKeyState, openApiApiKeysSettingsUrl, openApiApiKeyInputPattern, openRouterApiKeyState, useChatMathWorker))];
@@ -12870,15 +13067,6 @@ const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProje
   }, text('+ Add Project'), ...(showBackToChatsButton ? getBackToChatsButtonDom() : [])];
 };
 
-const runModes = ['local', 'background', 'cloud'];
-const runModePickerHeight = runModes.length * 28;
-const getRunModeOptionsVirtualDom = selectedRunMode => {
-  return runModes.flatMap(runMode => getCustomSelectOptionVirtualDom(getRunModePickerItemInputName(runMode), runMode, runMode === selectedRunMode));
-};
-const getRunModePickerPopOverVirtualDom = selectedRunMode => {
-  return getCustomSelectPopOverVirtualDom(runModes.length, runModePickerHeight, getRunModeOptionsVirtualDom(selectedRunMode), RunModePickerContainer, RunModePickerPopOver);
-};
-
 const getChatModeChatFocusVirtualDom = ({
   addContextButtonEnabled,
   agentMode,
@@ -12936,25 +13124,25 @@ const getChatModeChatFocusVirtualDom = ({
   const isAgentModePickerVisible = hasSpaceForAgentModePicker && agentModePickerOpen;
   const isNewModelPickerVisible = modelPickerOpen;
   const isRunModePickerVisible = showRunMode && hasSpaceForRunModePicker && runModePickerOpen;
-  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isAgentModePickerVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0) + (isRunModePickerVisible ? 1 : 0);
+  const hasVisibleOverlays = isDropOverlayVisible || isAgentModePickerVisible || isNewModelPickerVisible || isRunModePickerVisible;
+  const chatRootChildCount = 3 + (hasVisibleOverlays ? 1 : 0);
   return [{
     childCount: chatRootChildCount,
     className: mergeClassNames(Viewlet, Chat, ChatFocus),
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop, true), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openApiApiKeyState, openApiApiKeysSettingsUrl, openApiApiKeyInputPattern, openRouterApiKeyState, messagesScrollTop, useChatMathWorker, true), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, showCreatePullRequestButton, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
-    childCount: 1,
-    className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
-    name: ComposerDropTarget,
-    onDragLeave: HandleDragLeave,
-    onDragOver: HandleDragOver,
-    onDrop: HandleDrop,
-    type: Div
-  }, {
-    text: attachImageAsContext(),
-    type: Text
-  }] : []), ...(isAgentModePickerVisible ? getAgentModePickerPopOverVirtualDom(agentMode) : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(visibleModels, selectedModelId, modelPickerSearchValue) : []), ...(isRunModePickerVisible ? getRunModePickerPopOverVirtualDom(runMode) : [])];
+  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop, true), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openApiApiKeyState, openApiApiKeysSettingsUrl, openApiApiKeyInputPattern, openRouterApiKeyState, messagesScrollTop, useChatMathWorker, true), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, showCreatePullRequestButton, voiceDictationEnabled), ...getChatOverlaysVirtualDom({
+    agentMode,
+    agentModePickerVisible: isAgentModePickerVisible,
+    dropOverlayVisible: isDropOverlayVisible,
+    modelPickerSearchValue,
+    modelPickerVisible: isNewModelPickerVisible,
+    runMode,
+    runModePickerVisible: isRunModePickerVisible,
+    selectedModelId,
+    visibleModels
+  })];
 };
 
 const arrowLeft = {
@@ -13041,6 +13229,7 @@ const getChatHeaderActionsDom = (viewMode, authEnabled = false, authStatus = 'si
     title: closeChat()
   }];
   return [{
+    'aria-label': 'chat actions',
     childCount: items.length,
     className: ChatActions,
     role: ToolBar,
@@ -13130,25 +13319,25 @@ const getChatModeDetailVirtualDom = ({
   const isAgentModePickerVisible = hasSpaceForAgentModePicker && agentModePickerOpen;
   const isNewModelPickerVisible = modelPickerOpen;
   const isRunModePickerVisible = showRunMode && hasSpaceForRunModePicker && runModePickerOpen;
-  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isAgentModePickerVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0) + (isRunModePickerVisible ? 1 : 0);
+  const hasVisibleOverlays = isDropOverlayVisible || isAgentModePickerVisible || isNewModelPickerVisible || isRunModePickerVisible;
+  const chatRootChildCount = 3 + (hasVisibleOverlays ? 1 : 0);
   return [{
     childCount: chatRootChildCount,
     className: mergeClassNames(Viewlet, Chat),
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getChatHeaderDomDetailMode(selectedSessionTitle, authEnabled, authStatus, authErrorMessage), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openApiApiKeyState, openApiApiKeysSettingsUrl, openApiApiKeyInputPattern, openRouterApiKeyState, messagesScrollTop, useChatMathWorker), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, showCreatePullRequestButton, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
-    childCount: 1,
-    className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
-    name: ComposerDropTarget,
-    onDragLeave: HandleDragLeave,
-    onDragOver: HandleDragOver,
-    onDrop: HandleDrop,
-    type: Div
-  }, {
-    text: attachImageAsContext(),
-    type: Text
-  }] : []), ...(isAgentModePickerVisible ? getAgentModePickerPopOverVirtualDom(agentMode) : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(visibleModels, selectedModelId, modelPickerSearchValue) : []), ...(isRunModePickerVisible ? getRunModePickerPopOverVirtualDom(runMode) : [])];
+  }, ...getChatHeaderDomDetailMode(selectedSessionTitle, authEnabled, authStatus, authErrorMessage), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openApiApiKeyState, openApiApiKeysSettingsUrl, openApiApiKeyInputPattern, openRouterApiKeyState, messagesScrollTop, useChatMathWorker), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, showCreatePullRequestButton, voiceDictationEnabled), ...getChatOverlaysVirtualDom({
+    agentMode,
+    agentModePickerVisible: isAgentModePickerVisible,
+    dropOverlayVisible: isDropOverlayVisible,
+    modelPickerSearchValue,
+    modelPickerVisible: isNewModelPickerVisible,
+    runMode,
+    runModePickerVisible: isRunModePickerVisible,
+    selectedModelId,
+    visibleModels
+  })];
 };
 
 const getChatSearchDom = (hasSearchField, searchValue) => {
@@ -13277,23 +13466,6 @@ const getChatListDom = (sessions, selectedSessionId, listFocusedIndex, chatListS
   }, ...sessions.flatMap((session, index) => getSessionDom(session, index === listFocusedIndex))];
 };
 
-const getDropOverlayVirtualDom = isDropOverlayVisible => {
-  if (!isDropOverlayVisible) {
-    return [];
-  }
-  return [{
-    childCount: 1,
-    className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
-    name: ComposerDropTarget,
-    onDragLeave: HandleDragLeave,
-    onDragOver: HandleDragOver,
-    onDrop: HandleDrop,
-    type: Div
-  }, {
-    text: attachImageAsContext(),
-    type: Text
-  }];
-};
 const getChatModeListVirtualDom = ({
   addContextButtonEnabled,
   agentMode,
@@ -13340,7 +13512,8 @@ const getChatModeListVirtualDom = ({
   const isAgentModePickerVisible = hasSpaceForAgentModePicker && agentModePickerOpen;
   const isNewModelPickerVisible = modelPickerOpen;
   const isRunModePickerVisible = showRunMode && hasSpaceForRunModePicker && runModePickerOpen;
-  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isAgentModePickerVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0) + (isRunModePickerVisible ? 1 : 0);
+  const hasVisibleOverlays = isDropOverlayVisible || isAgentModePickerVisible || isNewModelPickerVisible || isRunModePickerVisible;
+  const chatRootChildCount = 3 + (hasVisibleOverlays ? 1 : 0);
   const searchValueTrimmed = searchValue.trim().toLowerCase();
   const visibleSessions = searchEnabled && searchValueTrimmed ? sessions.filter(session => session.title.toLowerCase().includes(searchValueTrimmed)) : sessions;
   return [{
@@ -13349,7 +13522,17 @@ const getChatModeListVirtualDom = ({
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getChatHeaderListModeDom(authEnabled, authStatus, authErrorMessage, searchEnabled, searchFieldVisible, searchValue), ...getChatListDom(visibleSessions, selectedSessionId, listFocusedIndex, chatListScrollTop), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, false, voiceDictationEnabled), ...getDropOverlayVirtualDom(isDropOverlayVisible), ...(isAgentModePickerVisible ? getAgentModePickerPopOverVirtualDom(agentMode) : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(visibleModels, selectedModelId, modelPickerSearchValue) : []), ...(isRunModePickerVisible ? getRunModePickerPopOverVirtualDom(runMode) : [])];
+  }, ...getChatHeaderListModeDom(authEnabled, authStatus, authErrorMessage, searchEnabled, searchFieldVisible, searchValue), ...getChatListDom(visibleSessions, selectedSessionId, listFocusedIndex, chatListScrollTop), ...getChatSendAreaDom(composerValue, composerAttachments, agentMode, agentModePickerOpen, hasSpaceForAgentModePicker, modelPickerOpen, models, selectedModelId, reasoningPickerEnabled, reasoningEffort, reasoningEffortPickerOpen, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, hasSpaceForRunModePicker, runMode, runModePickerOpen, todoListToolEnabled, todoListItems, false, voiceDictationEnabled), ...getChatOverlaysVirtualDom({
+    agentMode,
+    agentModePickerVisible: isAgentModePickerVisible,
+    dropOverlayVisible: isDropOverlayVisible,
+    modelPickerSearchValue,
+    modelPickerVisible: isNewModelPickerVisible,
+    runMode,
+    runModePickerVisible: isRunModePickerVisible,
+    selectedModelId,
+    visibleModels
+  })];
 };
 
 const getChatModeUnsupportedVirtualDom = () => {
@@ -13909,11 +14092,11 @@ const renderEventListeners = () => {
     params: ['handleSearchValueChange', TargetValue]
   }, {
     name: HandleDragEnter,
-    params: ['handleDragEnter', TargetName, 'Array.from(event.dataTransfer?.files || []).length > 0'],
+    params: ['handleDragEnter', TargetName, DataTransferFiles2],
     preventDefault: true
   }, {
     name: HandleDragOver,
-    params: ['handleDragOver', TargetName, 'Array.from(event.dataTransfer?.files || []).length > 0'],
+    params: ['handleDragOver', TargetName, DataTransferFiles2],
     preventDefault: true
   }, {
     name: HandleDragLeave,
@@ -13921,15 +14104,15 @@ const renderEventListeners = () => {
     preventDefault: true
   }, {
     name: HandleDrop,
-    params: ['handleDropFiles', TargetName, 'Array.from(event.dataTransfer?.files || [])'],
+    params: ['handleDropFiles', TargetName, DataTransferFiles2],
     preventDefault: true
   }, {
     name: HandleDragEnterChatView,
-    params: ['handleDragEnter', 'composer-drop-target', 'Array.from(event.dataTransfer?.files || []).length > 0'],
+    params: ['handleDragEnter', 'composer-drop-target', DataTransferFiles2],
     preventDefault: true
   }, {
     name: HandleDragOverChatView,
-    params: ['handleDragOver', 'composer-drop-target', 'Array.from(event.dataTransfer?.files || []).length > 0'],
+    params: ['handleDragOver', 'composer-drop-target', DataTransferFiles2],
     preventDefault: true
   }, {
     name: HandleModelChange,
@@ -14017,7 +14200,7 @@ const renderEventListeners = () => {
     params: ['handleModelInputBlur']
   }, {
     name: HandleContextMenuChatImageAttachment,
-    params: ['handleContextMenuChatImageAttachment'],
+    params: ['handleContextMenuChatImageAttachment', TargetName, ClientX, ClientY],
     preventDefault: true
   }];
 };
@@ -14418,6 +14601,7 @@ const commandMap = {
   'Chat.openRunModePicker': wrapCommand(openRunModePicker),
   'Chat.pasteInput': wrapCommand(pasteInput),
   'Chat.registerMockResponse': wrapCommand(registerMockResponse),
+  'Chat.removeComposerAttachment': wrapCommand(removeComposerAttachment),
   'Chat.render2': render2,
   'Chat.renderEventListeners': renderEventListeners,
   'Chat.rerender': wrapCommand(rerender),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/chat-view",
-  "version": "6.63.0",
+  "version": "6.65.0",
   "description": "Chat View Worker",
   "repository": {
     "type": "git",