@lvce-editor/chat-view 6.64.0 → 6.65.0

package/dist/chatViewWorkerMain.js

@@ -1865,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';
@@ -1960,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);
@@ -3245,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 [{
@@ -3304,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';
@@ -3377,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);
 };
@@ -3452,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:
@@ -6528,6 +6560,7 @@ const ChatOverlays = 'ChatOverlays';
 const ChatOrderedList = 'ChatOrderedList';
 const ChatOrderedListItem = 'ChatOrderedListItem';
 const ChatOrderedListItemContent = 'ChatOrderedListItemContent';
+const ChatOrderedListItemPrefix = 'ChatOrderedListItemPrefix';
 const ChatOrderedListMarker = 'ChatOrderedListMarker';
 const ChatComposerAttachment = 'ChatComposerAttachment';
 const ChatComposerAttachmentImage = 'ChatComposerAttachmentImage';
@@ -8979,7 +9012,8 @@ const handleRemoveComposerAttachment = async (state, attachmentId) => {
   }
   return {
     ...state,
-    composerAttachments: nextComposerAttachments
+    composerAttachments: nextComposerAttachments,
+    composerAttachmentsHeight: getComposerAttachmentsHeight(nextComposerAttachments, state.width)
   };
 };
 
@@ -9423,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;
 };
 
@@ -10672,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;
@@ -10803,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;
@@ -11218,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',
@@ -11242,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
   }];
@@ -11616,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) => {
@@ -12839,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))];
@@ -14081,7 +14200,7 @@ const renderEventListeners = () => {
     params: ['handleModelInputBlur']
   }, {
     name: HandleContextMenuChatImageAttachment,
-    params: ['handleContextMenuChatImageAttachment'],
+    params: ['handleContextMenuChatImageAttachment', TargetName, ClientX, ClientY],
     preventDefault: true
   }];
 };
@@ -14482,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.64.0",
+  "version": "6.65.0",
   "description": "Chat View Worker",
   "repository": {
     "type": "git",