@lvce-editor/chat-view 6.22.0 → 6.24.0

package/dist/chatViewWorkerMain.js

@@ -1197,9 +1197,7 @@ const Shift = 1 << 10 >>> 0;
 
 const Chat$1 = 97;
 
-const Separator = 1;
 const None = 0;
-const RestoreFocus = 6;
 
 const ChatNetworkWorker = 6002;
 const ChatToolWorker = 6005;
@@ -1593,7 +1591,7 @@ const chats = () => {
 const newChat = () => {
   return i18nString('New Chat');
 };
-const addProject = () => {
+const addProject$1 = () => {
   return i18nString('Add Project');
 };
 const debug = () => {
@@ -3079,22 +3077,12 @@ const getKeyBindings = () => {
 };
 
 const Copy = 'Copy';
-const CopyPath = 'Copy Path';
-const CopyRelativePath = 'Copy Relative Path';
 const Cut = 'Cut';
-const Delete = 'Delete';
-const OpenContainingFolder = 'Open Containing Folder';
-const OpenInIntegratedTerminal = 'Open in integrated Terminal';
 const Paste = 'Paste';
 const Rename = 'Rename';
 const Archive = 'Archive';
+const AddProject = 'Add Project...';
 
-const openContainingFolder = () => {
-  return i18nString(OpenContainingFolder);
-};
-const openInIntegratedTerminal = () => {
-  return i18nString(OpenInIntegratedTerminal);
-};
 const cut = () => {
   return i18nString(Cut);
 };
@@ -3104,20 +3092,14 @@ const copy = () => {
 const paste = () => {
   return i18nString(Paste);
 };
-const copyPath = () => {
-  return i18nString(CopyPath);
-};
-const copyRelativePath = () => {
-  return i18nString(CopyRelativePath);
-};
 const rename = () => {
   return i18nString(Rename);
 };
 const archive = () => {
   return i18nString(Archive);
 };
-const deleteItem = () => {
-  return i18nString(Delete);
+const addProject = () => {
+  return i18nString(AddProject);
 };
 
 const getMenuEntriesChatHeader = () => {
@@ -3251,7 +3233,7 @@ const menuEntryAddProject = {
   command: 'Chat.handleClick',
   flags: None,
   id: 'addProject',
-  label: addProject()
+  label: addProject$1()
 };
 const getMenuEntriesChatProjectList = (projectId = '') => {
   if (!projectId) {
@@ -3266,84 +3248,25 @@ const getMenuEntriesChatProjectList = (projectId = '') => {
   }, menuEntryAddProject];
 };
 
+const getMenuEntriesProjectAddButton = () => {
+  return [{
+    args: [CreateProject],
+    command: 'Chat.handleClick',
+    flags: None,
+    id: 'addProject',
+    label: addProject()
+  }];
+};
+
 const MenuChatList = 2178;
 const MenuChatHeader = 2179;
 const MenuChatInput = 2180;
-const MenuChatProjectList = 2181;
+const MenuProjectAddButton = 2181;
+const MenuChatProjectList = 2182;
 const getMenuEntryIds = () => {
-  return [Chat$1, MenuChatList, MenuChatHeader, MenuChatInput, MenuChatProjectList];
+  return [Chat$1, MenuChatList, MenuChatHeader, MenuChatInput, MenuProjectAddButton, MenuChatProjectList];
 };
 
-const menuEntrySeparator = {
-  command: '',
-  flags: Separator,
-  id: 'separator',
-  label: ''
-};
-
-const menuEntryOpenContainingFolder = {
-  command: 'Explorer.openContainingFolder',
-  flags: RestoreFocus,
-  id: 'openContainingFolder',
-  label: openContainingFolder()
-};
-const menuEntryOpenInIntegratedTerminal = {
-  command: /* TODO */'-1',
-  flags: None,
-  id: 'openInIntegratedTerminal',
-  label: openInIntegratedTerminal()
-};
-const menuEntryCut = {
-  command: 'Explorer.handleCut',
-  flags: RestoreFocus,
-  id: 'cut',
-  label: cut()
-};
-const menuEntryCopy = {
-  command: 'Explorer.handleCopy',
-  flags: RestoreFocus,
-  id: 'copy',
-  label: copy()
-};
-const menuEntryPaste = {
-  command: 'Explorer.handlePaste',
-  flags: None,
-  id: 'paste',
-  label: paste()
-};
-const menuEntryCopyPath = {
-  command: 'Explorer.copyPath',
-  flags: RestoreFocus,
-  id: 'copyPath',
-  label: copyPath()
-};
-const menuEntryCopyAsE2eTest = {
-  command: 'Chat.copyAsE2eTest',
-  flags: None,
-  id: 'copyAsE2eTest',
-  label: copyPath()
-};
-const menuEntryCopyRelativePath = {
-  command: 'Explorer.copyRelativePath',
-  flags: RestoreFocus,
-  id: 'copyRelativePath',
-  label: copyRelativePath()
-};
-const menuEntryRename = {
-  command: 'Explorer.renameDirent',
-  flags: None,
-  id: 'rename',
-  label: rename()
-};
-const menuEntryDelete = {
-  command: 'Explorer.removeDirent',
-  flags: None,
-  id: 'delete',
-  label: deleteItem()
-};
-const getMenuEntriesFile = () => {
-  return [menuEntryCopyAsE2eTest, menuEntryOpenContainingFolder, menuEntryOpenInIntegratedTerminal, menuEntrySeparator, menuEntryCut, menuEntryCopy, menuEntryPaste, menuEntrySeparator, menuEntryCopyPath, menuEntryCopyRelativePath, menuEntrySeparator, menuEntryRename, menuEntryDelete];
-};
 const getMenuEntries = (menuId, props) => {
   switch (props.menuId) {
     case MenuChatHeader:
@@ -3354,8 +3277,10 @@ const getMenuEntries = (menuId, props) => {
       return getMenuEntriesChatList();
     case MenuChatProjectList:
       return getMenuEntriesChatProjectList(props.projectId);
+    case MenuProjectAddButton:
+      return getMenuEntriesProjectAddButton();
     default:
-      return getMenuEntriesFile();
+      return [];
   }
 };
 
@@ -3375,7 +3300,13 @@ const handleChatHeaderContextMenu = async state => {
   return state;
 };
 
-const handleChatInputContextMenu = async state => {
+const handleChatInputContextMenu = async (state, eventX, eventY) => {
+  const {
+    uid
+  } = state;
+  await showContextMenu2(uid, MenuChatInput, eventX, eventY, {
+    menuId: MenuChatInput
+  });
   return state;
 };
 
@@ -3415,7 +3346,12 @@ const handleChatListContextMenu = async (state, eventX, eventY) => {
     menuId: MenuChatList,
     sessionId: item.id
   });
-  return state;
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: index
+  };
 };
 
 const generateSessionId = () => {
@@ -8550,11 +8486,11 @@ const handleMessagesContextMenu = async (state, button, x, y) => {
   return state;
 };
 
-const handleMissingApiKeySubmit = async (state, submitterName = '') => {
-  if (!submitterName) {
-    return state;
-  }
-  return handleClick(state, submitterName);
+const handleMissingOpenAiApiKeyFormSubmit = async state => {
+  return handleClickSaveOpenApiApiKey(state);
+};
+const handleMissingOpenRouterApiKeyFormSubmit = async state => {
+  return handleClickSaveOpenRouterApiKey(state);
 };
 
 const handleModelChange = async (state, value) => {
@@ -8573,47 +8509,60 @@ const handleNewline = async state => {
   return handleInput(state, Composer, `${composerValue}\n`);
 };
 
-const getProjectRowIds = (projects, sessions, projectExpandedIds) => {
+const handleProjectAddButtonContextMenu = async (state, button, x, y) => {
+  const {
+    uid
+  } = state;
+  await showContextMenu2(uid, MenuProjectAddButton, x, y, {
+    menuId: MenuProjectAddButton
+  });
+  return state;
+};
+
+const getProjectIdAtIndex = (state, index) => {
+  const {
+    projectExpandedIds,
+    projects,
+    sessions
+  } = state;
   const blankProjectId = projects.find(project => project.name === '_blank')?.id || projects[0]?.id || '';
-  const projectRowIds = [];
+  let currentIndex = 0;
   for (const project of projects) {
-    projectRowIds.push(project.id);
-    if (!projectExpandedIds.includes(project.id)) {
-      continue;
-    }
-    for (const session of sessions) {
-      const sessionProjectId = session.projectId || blankProjectId;
-      if (sessionProjectId === project.id) {
-        projectRowIds.push(project.id);
+    if (currentIndex === index) {
+      return project.id;
+    }
+    currentIndex++;
+    if (projectExpandedIds.includes(project.id)) {
+      for (const session of sessions) {
+        const sessionProjectId = session.projectId || blankProjectId;
+        if (sessionProjectId !== project.id) {
+          continue;
+        }
+        if (currentIndex === index) {
+          return project.id;
+        }
+        currentIndex++;
       }
     }
   }
-  return projectRowIds;
+  return '';
 };
-const getProjectIdAtPosition = (state, eventY) => {
+const handleProjectListContextMenu = async (state, button, x, y) => {
   const {
     headerHeight,
     listItemHeight,
-    projectExpandedIds,
     projectListScrollTop,
-    projects,
-    sessions,
-    y
-  } = state;
-  const relativeY = eventY - y - headerHeight + projectListScrollTop;
-  if (relativeY < 0) {
-    return '';
-  }
-  const index = Math.floor(relativeY / listItemHeight);
-  const projectRowIds = getProjectRowIds(projects, sessions, projectExpandedIds);
-  return projectRowIds[index] || '';
-};
-const handleProjectListContextMenu = async (state, button, eventX, eventY) => {
-  const {
     uid
   } = state;
-  const projectId = getProjectIdAtPosition(state, eventY);
-  await showContextMenu2(uid, MenuChatProjectList, eventX, eventY, {
+  const index = Math.floor((y - headerHeight + projectListScrollTop) / listItemHeight);
+  if (index < 0) {
+    return state;
+  }
+  const projectId = getProjectIdAtIndex(state, index);
+  if (!projectId) {
+    return state;
+  }
+  await showContextMenu2(uid, MenuChatProjectList, x, y, {
     menuId: MenuChatProjectList,
     projectId
   });
@@ -9363,13 +9312,25 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   border-color: darkcyan;
 }
 
+.SendButtonDisabled{
+  background: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-disabledForeground);
+  cursor: default;
+}
+
+.ChatModelPicker{
+  border: 1px solid white;
+}
+
 .ChatListItem{
   display:flex;
   align-items:center;
+  box-shadow: inset 0 0 0 1px transparent;
 }
 
 .ChatListItemFocused{
   background: var(--vscode-list-activeSelectionBackground);
+  box-shadow: inset 0 0 0 1px var(--vscode-focusBorder);
   color: var(--vscode-list-activeSelectionForeground);
 }
 
@@ -9381,6 +9342,10 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   padding-top: 10px;
 }
 
+a.Button{
+  text-decoration: none;
+}
+
 .ChatHeaderLabel{
   margin: 0;
   font-size: 14px;
@@ -9425,6 +9390,46 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   text-overflow: ellipsis;
 }
 
+.ChatModelPickerList{
+  scrollbar-width: thin;
+  scrollbar-color: var(--vscode-scrollbarSlider-background) transparent;
+}
+
+.ChatModelPickerList::-webkit-scrollbar{
+  width: 10px;
+}
+
+.ChatModelPickerList::-webkit-scrollbar-track{
+  background: transparent;
+}
+
+.ChatModelPickerList::-webkit-scrollbar-thumb{
+  background: var(--vscode-scrollbarSlider-background);
+  border: 2px solid transparent;
+  border-radius: 999px;
+  background-clip: content-box;
+}
+
+.ChatModelPickerList::-webkit-scrollbar-thumb:hover{
+  background: var(--vscode-scrollbarSlider-hoverBackground);
+  border: 2px solid transparent;
+  background-clip: content-box;
+}
+
+.ChatModelPickerList::-webkit-scrollbar-thumb:active{
+  background: var(--vscode-scrollbarSlider-activeBackground);
+  border: 2px solid transparent;
+  background-clip: content-box;
+}
+
+.ChatModelPickerItem{
+  display: block;
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 `;
   return `${baseCss}
 
@@ -9523,6 +9528,14 @@ const ChatTodoListItemCompleted = 'ChatTodoListItemCompleted';
 const Chat = 'Chat';
 const ChatHeader = 'ChatHeader';
 const ChatHeaderLabel = 'ChatHeaderLabel';
+const MaskIconDebugPause = 'MaskIconDebugPause';
+const MaskIconAccount = 'MaskIconAccount';
+const MaskIconAdd = 'MaskIconAdd';
+const MaskIconClose = 'MaskIconClose';
+const MaskIconLayoutPanelLeft = 'MaskIconLayoutPanelLeft';
+const MaskIconSearch = 'MaskIconSearch';
+const MaskIconSettingsGear = 'MaskIconSettingsGear';
+const MaskIconSignOut = 'MaskIconSignOut';
 const Button = 'Button';
 const ButtonPrimary = 'ButtonPrimary';
 const ButtonSecondary = 'ButtonSecondary';
@@ -9565,6 +9578,7 @@ const MarkdownQuote = 'MarkdownQuote';
 const MarkdownMathBlock = 'MarkdownMathBlock';
 const MarkdownTable = 'MarkdownTable';
 const ChatTableWrapper = 'ChatTableWrapper';
+const MaskIcon = 'MaskIcon';
 const Message = 'Message';
 const MissingApiKeyForm = 'MissingApiKeyForm';
 const ChatMessageContent = 'ChatMessageContent';
@@ -9630,15 +9644,17 @@ const HandleDrop = 29;
 const HandleDragEnterChatView = 30;
 const HandleDragOverChatView = 31;
 const HandleProjectListScroll = 32;
-const HandleProjectListContextMenu = 33;
 const HandleClickDictationButton = 34;
-const HandleMissingApiKeySubmit = 35;
+const HandleMissingOpenAiApiKeyFormSubmit = 35;
 const HandleRunModeChange = 36;
 const HandleSearchInput = 37;
 const HandleChatWelcomeContextMenu = 39;
 const HandleChatHeaderContextMenu = 40;
 const HandleChatInputContextMenu = 41;
 const HandleContextMenuChatSendAreaBottom = 42;
+const HandleProjectAddButtonContextMenu = 43;
+const HandleProjectListContextMenu = 44;
+const HandleMissingOpenRouterApiKeyFormSubmit = 45;
 
 const getModelLabel = model => {
   if (model.provider === 'openRouter') {
@@ -9650,13 +9666,11 @@ const getModelLabel = model => {
   return model.name;
 };
 
-const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen, modelPickerSearchValue) => {
+const getChatModelPickerToggleVirtualDom = (models, selectedModelId, modelPickerOpen) => {
   const selectedModel = models.find(model => model.id === selectedModelId);
   const selectedModelLabel = selectedModel ? selectedModel.name : selectedModelId;
-  const normalizedSearch = modelPickerSearchValue.trim().toLowerCase();
-  const visibleModels = normalizedSearch ? models.filter(model => getModelLabel(model).toLowerCase().includes(normalizedSearch)) : models;
   return [{
-    childCount: modelPickerOpen ? 2 : 1,
+    childCount: 1,
     className: ChatModelPickerContainer,
     type: Div
   }, {
@@ -9665,12 +9679,26 @@ const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen,
     name: ModelPickerToggle,
     onClick: HandleClick,
     title: selectedModelLabel,
-    type: Button$1
+    type: Div
   }, {
+    childCount: 1,
+    type: Span
+  }, text(selectedModelLabel), {
     childCount: 0,
-    className: 'MaskIcon MaskIconChevronUp',
+    className: modelPickerOpen ? 'MaskIcon MaskIconChevronUp' : 'MaskIcon MaskIconChevronDown',
+    role: 'none',
+    type: Div
+  }];
+};
+const getChatModelPickerPopOverVirtualDom = (models, selectedModelId, modelPickerSearchValue) => {
+  const normalizedSearch = modelPickerSearchValue.trim().toLowerCase();
+  const visibleModels = normalizedSearch ? models.filter(model => getModelLabel(model).toLowerCase().includes(normalizedSearch)) : models;
+  return [{
+    childCount: 2,
+    className: ChatModelPickerContainer,
+    style: 'position:absolute;',
     type: Div
-  }, text(selectedModelLabel), ...(modelPickerOpen ? [{
+  }, {
     childCount: 3 + visibleModels.length,
     className: ChatModelPicker,
     type: Div
@@ -9681,6 +9709,7 @@ const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen,
   }, {
     childCount: 0,
     className: InputBox,
+    inputType: 'search',
     name: ModelPickerSearch,
     onInput: HandleInput,
     placeholder: 'Search models',
@@ -9700,14 +9729,14 @@ const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen,
   }, {
     childCount: visibleModels.length,
     className: ChatModelPickerList,
-    type: Div
+    type: Ul
   }, ...visibleModels.flatMap(model => [{
     childCount: 1,
     className: `${ChatModelPickerItem}${model.id === selectedModelId ? ` ${ChatModelPickerItemSelected}` : ''}`,
     name: getModelPickerItemInputName(model.id),
     onClick: HandleClick,
-    type: Button$1
-  }, text(getModelLabel(model))])] : [])];
+    type: Li
+  }, text(getModelLabel(model))])];
 };
 
 const getModelOptionDOm = (model, selectedModelId) => {
@@ -9781,7 +9810,8 @@ const getSendButtonDom = (isSendDisabled, voiceDictationEnabled) => {
     type: Button$1
   }, {
     childCount: 0,
-    className: 'MaskIcon MaskIconSend',
+    className: 'MaskIcon MaskIconArrowUp',
+    role: 'none',
     type: Div
   }];
 };
@@ -9847,20 +9877,20 @@ const getUsageOverviewDom = (tokensUsed, tokensMax) => {
   }, text(usageLabel)];
 };
 
-const getChatSendAreaDom = (composerValue, modelPickerOpen, modelPickerSearchValue, models, newChatModelPickerEnabled, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled = false, showBackToChatsButton = false) => {
+const getTodoItemClassName = status => {
+  if (status === 'completed') {
+    return `${ChatTodoListItem} ${ChatTodoListItemCompleted} completed`;
+  }
+  if (status === 'inProgress') {
+    return `${ChatTodoListItem} ${ChatTodoListItemInProgress} inProgress`;
+  }
+  return `${ChatTodoListItem} ${ChatTodoListItemTodo} todo`;
+};
+const getChatSendAreaDom = (composerValue, modelPickerOpen, modelPickerSearchValue, models, newChatModelPickerEnabled, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled = false) => {
   const isSendDisabled = composerValue.trim() === '';
-  const controlsCount = 2 + (usageOverviewEnabled ? 1 : 0) + (showRunMode ? 1 : 0) + (addContextButtonEnabled ? 1 : 0) + (showBackToChatsButton ? 1 : 0);
+  const controlsCount = 2 + (usageOverviewEnabled ? 1 : 0) + (showRunMode ? 1 : 0) + (addContextButtonEnabled ? 1 : 0);
   const hasTodoList = todoListToolEnabled && todoListItems.length > 0;
   const todoHeaderText = `Todos (${todoListItems.filter(item => item.status === 'completed').length}/${todoListItems.length})`;
-  const getTodoItemClassName = status => {
-    if (status === 'completed') {
-      return `${ChatTodoListItem} ${ChatTodoListItemCompleted} completed`;
-    }
-    if (status === 'inProgress') {
-      return `${ChatTodoListItem} ${ChatTodoListItemInProgress} inProgress`;
-    }
-    return `${ChatTodoListItem} ${ChatTodoListItemTodo} todo`;
-  };
   return [{
     childCount: 1,
     className: ChatSendArea,
@@ -9903,7 +9933,14 @@ const getChatSendAreaDom = (composerValue, modelPickerOpen, modelPickerSearchVal
     className: ChatSendAreaBottom,
     onContextMenu: HandleContextMenuChatSendAreaBottom,
     type: Div
-  }, ...(newChatModelPickerEnabled ? getChatModelPickerVirtualDom(models, selectedModelId, modelPickerOpen, modelPickerSearchValue) : getChatSelectVirtualDom(models, selectedModelId)), ...(showRunMode ? getRunModeSelectVirtualDom(runMode) : []), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...(addContextButtonEnabled ? getAddContextButtonDom() : []), ...(showBackToChatsButton ? getBackToChatsButtonDom() : []), ...getSendButtonDom(isSendDisabled, voiceDictationEnabled)];
+  }, ...(newChatModelPickerEnabled ? getChatModelPickerToggleVirtualDom(models, selectedModelId, modelPickerOpen) : getChatSelectVirtualDom(models, selectedModelId)), ...(showRunMode ? getRunModeSelectVirtualDom(runMode) : []), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...(addContextButtonEnabled ? getAddContextButtonDom() : []), ...getSendButtonDom(isSendDisabled, voiceDictationEnabled)];
+};
+
+const getBoldInlineNodeDom = (inlineNode, useChatMathWorker, renderInlineNodeDom) => {
+  return [{
+    childCount: inlineNode.children.length,
+    type: Strong
+  }, ...inlineNode.children.flatMap(child => renderInlineNodeDom(child, useChatMathWorker))];
 };
 
 const getImageAltText = alt => {
@@ -9912,55 +9949,37 @@ const getImageAltText = alt => {
   }
   return `${alt} (image could not be loaded)`;
 };
+
+const getImageInlineNodeDom = inlineNode => {
+  return [{
+    alt: getImageAltText(inlineNode.alt),
+    childCount: 0,
+    className: ImageElement,
+    src: inlineNode.src,
+    type: Img
+  }];
+};
+
+const getInlineCodeInlineNodeDom = inlineNode => {
+  return [{
+    childCount: 1,
+    type: Code
+  }, text(inlineNode.text)];
+};
+
+const getItalicInlineNodeDom = (inlineNode, useChatMathWorker, renderInlineNodeDom) => {
+  return [{
+    childCount: inlineNode.children.length,
+    type: Em
+  }, ...inlineNode.children.flatMap(child => renderInlineNodeDom(child, useChatMathWorker))];
+};
+
 const isFileReferenceUri = href => {
   const normalized = href.trim().toLowerCase();
   return normalized.startsWith('file://') || normalized.startsWith('vscode-references://');
 };
-const getInlineNodeDom = (inlineNode, useChatMathWorker = false) => {
-  if (inlineNode.type === 'text') {
-    return [text(inlineNode.text)];
-  }
-  if (inlineNode.type === 'image') {
-    return [{
-      alt: getImageAltText(inlineNode.alt),
-      childCount: 0,
-      className: ImageElement,
-      src: inlineNode.src,
-      type: Img
-    }];
-  }
-  if (inlineNode.type === 'bold') {
-    return [{
-      childCount: inlineNode.children.length,
-      type: Strong
-    }, ...inlineNode.children.flatMap(child => getInlineNodeDom(child, useChatMathWorker))];
-  }
-  if (inlineNode.type === 'italic') {
-    return [{
-      childCount: inlineNode.children.length,
-      type: Em
-    }, ...inlineNode.children.flatMap(child => getInlineNodeDom(child, useChatMathWorker))];
-  }
-  if (inlineNode.type === 'strikethrough') {
-    return [{
-      childCount: inlineNode.children.length,
-      className: StrikeThrough,
-      type: Span
-    }, ...inlineNode.children.flatMap(child => getInlineNodeDom(child, useChatMathWorker))];
-  }
-  if (inlineNode.type === 'inline-code') {
-    return [{
-      childCount: 1,
-      type: Code
-    }, text(inlineNode.text)];
-  }
-  if (inlineNode.type === 'math-inline') {
-    const fallback = inlineNode.displayMode ? `$$${inlineNode.text}$$` : `$${inlineNode.text}$`;
-    return [text(fallback)];
-  }
-  if (inlineNode.type === 'math-inline-dom') {
-    return inlineNode.dom;
-  }
+
+const getLinkInlineNodeDom = inlineNode => {
   if (isFileReferenceUri(inlineNode.href)) {
     return [{
       childCount: 1,
@@ -9983,6 +10002,48 @@ const getInlineNodeDom = (inlineNode, useChatMathWorker = false) => {
   }, text(inlineNode.text)];
 };
 
+const getMathInlineNodeDom = inlineNode => {
+  const fallback = inlineNode.displayMode ? `$$${inlineNode.text}$$` : `$${inlineNode.text}$`;
+  return [text(fallback)];
+};
+
+const getStrikethroughInlineNodeDom = (inlineNode, useChatMathWorker, renderInlineNodeDom) => {
+  return [{
+    childCount: inlineNode.children.length,
+    className: StrikeThrough,
+    type: Span
+  }, ...inlineNode.children.flatMap(child => renderInlineNodeDom(child, useChatMathWorker))];
+};
+
+const getTextInlineNodeDom = inlineNode => {
+  return [text(inlineNode.text)];
+};
+
+const getInlineNodeDom = (inlineNode, useChatMathWorker = false) => {
+  switch (inlineNode.type) {
+    case 'bold':
+      return getBoldInlineNodeDom(inlineNode, useChatMathWorker, getInlineNodeDom);
+    case 'image':
+      return getImageInlineNodeDom(inlineNode);
+    case 'inline-code':
+      return getInlineCodeInlineNodeDom(inlineNode);
+    case 'italic':
+      return getItalicInlineNodeDom(inlineNode, useChatMathWorker, getInlineNodeDom);
+    case 'link':
+      return getLinkInlineNodeDom(inlineNode);
+    case 'math-inline':
+      return getMathInlineNodeDom(inlineNode);
+    case 'math-inline-dom':
+      return inlineNode.dom;
+    case 'strikethrough':
+      return getStrikethroughInlineNodeDom(inlineNode, useChatMathWorker, getInlineNodeDom);
+    case 'text':
+      return getTextInlineNodeDom(inlineNode);
+  }
+  const exhaustiveCheck = inlineNode;
+  return exhaustiveCheck;
+};
+
 const jsRules = [{
   className: TokenComment,
   regex: /\/\/[^\n]*/
@@ -10309,11 +10370,41 @@ const getMessageContentDom = (nodes, useChatMathWorker = false) => {
   return nodes.flatMap(node => getMessageNodeDom(node, useChatMathWorker));
 };
 
+const getMissingApiActionsDom = ({
+  getApiKeyText,
+  openSettingsButtonName,
+  openSettingsUrl,
+  saveButtonDisabled = false,
+  saveButtonName,
+  saveButtonText = save()
+}) => {
+  return [{
+    childCount: 2,
+    className: Actions,
+    type: Div
+  }, {
+    childCount: 1,
+    className: mergeClassNames(Button, ButtonPrimary),
+    disabled: saveButtonDisabled,
+    inputType: 'submit',
+    name: saveButtonName,
+    type: Button$1
+  }, text(saveButtonText), {
+    childCount: 1,
+    className: mergeClassNames(Button, ButtonSecondary),
+    href: openSettingsUrl,
+    name: openSettingsButtonName,
+    rel: 'noopener noreferrer',
+    target: '_blank',
+    type: A
+  }, text(getApiKeyText)];
+};
 const getMissingApiKeyDom = ({
   getApiKeyText,
   inputName,
   inputPattern,
   inputRequired = false,
+  onSubmit,
   openSettingsButtonName,
   openSettingsUrl,
   placeholder,
@@ -10325,7 +10416,7 @@ const getMissingApiKeyDom = ({
     childCount: 2,
     className: MissingApiKeyForm,
     method: 'GET',
-    onSubmit: HandleMissingApiKeySubmit,
+    onSubmit,
     type: Form
   }, {
     autocapitalize: 'off',
@@ -10342,26 +10433,14 @@ const getMissingApiKeyDom = ({
     required: inputRequired,
     spellcheck: false,
     type: Input
-  }, {
-    childCount: 2,
-    className: Actions,
-    type: Div
-  }, {
-    childCount: 1,
-    className: mergeClassNames(Button, ButtonPrimary),
-    disabled: saveButtonDisabled,
-    inputType: 'submit',
-    name: saveButtonName,
-    type: Button$1
-  }, text(saveButtonText), {
-    childCount: 1,
-    className: mergeClassNames(Button, ButtonSecondary),
-    href: openSettingsUrl,
-    name: openSettingsButtonName,
-    rel: 'noopener noreferrer',
-    target: '_blank',
-    type: A
-  }, text(getApiKeyText)];
+  }, ...getMissingApiActionsDom({
+    getApiKeyText,
+    openSettingsButtonName,
+    openSettingsUrl,
+    saveButtonDisabled,
+    saveButtonName,
+    saveButtonText
+  })];
 };
 
 const getMissingOpenApiApiKeyDom = () => {
@@ -10370,6 +10449,7 @@ const getMissingOpenApiApiKeyDom = () => {
     inputName: OpenApiApiKeyInput,
     inputPattern: '^sk-.+',
     inputRequired: true,
+    onSubmit: HandleMissingOpenAiApiKeyFormSubmit,
     openSettingsButtonName: OpenOpenApiApiKeyWebsite,
     openSettingsUrl: 'https://platform.openai.com/api-keys',
     placeholder: openApiApiKeyPlaceholder(),
@@ -10382,6 +10462,7 @@ const getMissingOpenRouterApiKeyDom = (openRouterApiKeyState = 'idle') => {
   return getMissingApiKeyDom({
     getApiKeyText: getOpenRouterApiKey(),
     inputName: OpenRouterApiKeyInput,
+    onSubmit: HandleMissingOpenRouterApiKeyFormSubmit,
     openSettingsButtonName: OpenOpenRouterApiKeySettings,
     openSettingsUrl: 'https://openrouter.ai/settings/keys',
     placeholder: openRouterApiKeyPlaceholder(),
@@ -11268,6 +11349,7 @@ const getProjectSessionDom = (session, selectedSessionId) => {
     className: ProjectSessionItemLabel,
     name: getSessionInputName(session.id),
     onClick: HandleClick,
+    onContextMenu: HandleProjectListContextMenu,
     tabIndex: 0,
     type: Div
   }, text(session.title)];
@@ -11288,6 +11370,7 @@ const getProjectGroupDom = (project, sessions, projectExpandedIds, selectedProje
     className: ProjectListItemLabel,
     name: getProjectInputName(project.id),
     onClick: HandleClick,
+    onContextMenu: HandleProjectListContextMenu,
     tabIndex: 0,
     type: Div
   }, {
@@ -11312,7 +11395,7 @@ const getProjectGroupDom = (project, sessions, projectExpandedIds, selectedProje
     type: Button$1
   }, text('+'), ...(expanded ? sessions.flatMap(session => getProjectSessionDom(session, selectedSessionId)) : [])];
 };
-const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop) => {
+const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop, showBackToChatsButton = false) => {
   const blankProjectId = projects.find(project => project.name === '_blank')?.id || projects[0]?.id || '';
   const projectGroups = projects.map(project => {
     const projectSessions = sessions.filter(session => {
@@ -11322,13 +11405,12 @@ const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProje
     return getProjectGroupDom(project, projectSessions, projectExpandedIds, selectedProjectId, selectedSessionId);
   });
   return [{
-    childCount: 2,
+    childCount: 2 + (showBackToChatsButton ? 1 : 0),
     className: ProjectSidebar,
     type: Div
   }, {
     childCount: projects.length,
     className: ProjectList,
-    onContextMenu: HandleProjectListContextMenu,
     onScroll: HandleProjectListScroll,
     scrollTop: projectListScrollTop,
     type: Div
@@ -11337,9 +11419,10 @@ const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProje
     className: ProjectAddButton,
     name: CreateProject,
     onClick: HandleClick,
+    onContextMenu: HandleProjectAddButtonContextMenu,
     tabIndex: 0,
     type: Button$1
-  }, text('+ Add Project')];
+  }, text('+ Add Project'), ...(showBackToChatsButton ? getBackToChatsButtonDom() : [])];
 };
 
 const getChatModeChatFocusVirtualDom = ({
@@ -11383,13 +11466,15 @@ const getChatModeChatFocusVirtualDom = ({
   const selectedSession = sessions.find(session => session.id === selectedSessionId);
   const messages = selectedSession ? selectedSession.messages : [];
   const isDropOverlayVisible = composerDropEnabled && composerDropActive;
+  const isNewModelPickerVisible = newChatModelPickerEnabled && modelPickerOpen;
+  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0);
   return [{
-    childCount: isDropOverlayVisible ? 4 : 3,
+    childCount: chatRootChildCount,
     className: mergeClassNames(Viewlet, Chat, 'ChatFocus'),
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop, useChatMathWorker, true), ...getChatSendAreaDom(composerValue, modelPickerOpen, modelPickerSearchValue, models, newChatModelPickerEnabled, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled, true), ...(isDropOverlayVisible ? [{
+  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop, true), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop, useChatMathWorker, true), ...getChatSendAreaDom(composerValue, modelPickerOpen, modelPickerSearchValue, models, newChatModelPickerEnabled, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
     childCount: 1,
     className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
     name: ComposerDropTarget,
@@ -11400,7 +11485,7 @@ const getChatModeChatFocusVirtualDom = ({
   }, {
     text: attachImageAsContext(),
     type: Text
-  }] : [])];
+  }] : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(models, selectedModelId, modelPickerSearchValue) : [])];
 };
 
 const getBackButtonVirtualDom = () => {
@@ -11440,44 +11525,44 @@ const getChatHeaderActionsDom = (viewMode, authEnabled = false, authStatus = 'si
   const isSigningIn = authStatus === 'signing-in';
   const authAction = authEnabled && authStatus !== 'signed-in' ? {
     disabled: isSigningIn,
-    icon: 'MaskIcon MaskIconAccount',
+    icon: mergeClassNames(MaskIcon, MaskIconAccount),
     name: Login,
     onClick: HandleClick,
     title: isSigningIn ? loggingInToBackend() : loginToBackend()
   } : authEnabled ? {
     disabled: false,
-    icon: 'MaskIcon MaskIconSignOut',
+    icon: mergeClassNames(MaskIcon, MaskIconSignOut),
     name: Logout,
     onClick: HandleClick,
     title: logoutFromBackend()
   } : undefined;
   const items = [{
-    icon: 'MaskIcon MaskIconLayoutPanelLeft',
+    icon: mergeClassNames(MaskIcon, MaskIconLayoutPanelLeft),
     name: ToggleChatFocus,
     onClick: HandleClick,
     title: toggleTitle
   }, ...(searchEnabled ? [{
-    icon: 'MaskIcon MaskIconSearch',
+    icon: mergeClassNames(MaskIcon, MaskIconSearch),
     name: ToggleSearch,
     onClick: HandleClick,
     title: search()
   }] : []), {
-    icon: 'MaskIcon MaskIconDebugPause',
+    icon: mergeClassNames(MaskIcon, MaskIconDebugPause),
     name: SessionDebug,
     onClick: HandleClickSessionDebug,
     title: debug()
   }, {
-    icon: 'MaskIcon MaskIconAdd',
+    icon: mergeClassNames(MaskIcon, MaskIconAdd),
     name: CreateSession,
     onClick: HandleClickNew,
     title: newChat()
   }, {
-    icon: 'MaskIcon MaskIconSettingsGear',
+    icon: mergeClassNames(MaskIcon, MaskIconSettingsGear),
     name: Settings,
     onClick: HandleClickSettings,
     title: settings()
   }, ...(authAction ? [authAction] : []), {
-    icon: 'MaskIcon MaskIconClose',
+    icon: mergeClassNames(MaskIcon, MaskIconClose),
     name: CloseChat,
     onClick: HandleClickClose,
     title: closeChat()
@@ -11550,8 +11635,10 @@ const getChatModeDetailVirtualDom = ({
   const selectedSessionTitle = selectedSession?.title || chatTitle();
   const messages = selectedSession ? selectedSession.messages : [];
   const isDropOverlayVisible = composerDropEnabled && composerDropActive;
+  const isNewModelPickerVisible = newChatModelPickerEnabled && modelPickerOpen;
+  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0);
   return [{
-    childCount: isDropOverlayVisible ? 4 : 3,
+    childCount: chatRootChildCount,
     className: mergeClassNames(Viewlet, Chat),
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
@@ -11567,7 +11654,7 @@ const getChatModeDetailVirtualDom = ({
   }, {
     text: attachImageAsContext(),
     type: Text
-  }] : [])];
+  }] : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(models, selectedModelId, modelPickerSearchValue) : [])];
 };
 
 const getChatHeaderListModeDom = (authEnabled = false, authStatus = 'signed-out', authErrorMessage = '', searchEnabled = false, searchFieldVisible = false, searchValue = '') => {
@@ -11721,10 +11808,12 @@ const getChatModeListVirtualDom = ({
   voiceDictationEnabled = false
 }) => {
   const isDropOverlayVisible = composerDropEnabled && composerDropActive;
+  const isNewModelPickerVisible = newChatModelPickerEnabled && modelPickerOpen;
+  const chatRootChildCount = 3 + (isDropOverlayVisible ? 1 : 0) + (isNewModelPickerVisible ? 1 : 0);
   const searchValueTrimmed = searchValue.trim().toLowerCase();
   const visibleSessions = searchEnabled && searchValueTrimmed ? sessions.filter(session => session.title.toLowerCase().includes(searchValueTrimmed)) : sessions;
   return [{
-    childCount: isDropOverlayVisible ? 4 : 3,
+    childCount: chatRootChildCount,
     className: mergeClassNames(Viewlet, Chat),
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
@@ -11740,7 +11829,7 @@ const getChatModeListVirtualDom = ({
   }, {
     text: attachImageAsContext(),
     type: Text
-  }] : [])];
+  }] : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(models, selectedModelId, modelPickerSearchValue) : [])];
 };
 
 const getChatModeUnsupportedVirtualDom = () => {
@@ -12295,6 +12384,10 @@ const renderEventListeners = () => {
   }, {
     name: HandleProjectListScroll,
     params: ['handleProjectListScroll', 'event.target.scrollTop']
+  }, {
+    name: HandleProjectAddButtonContextMenu,
+    params: ['handleProjectAddButtonContextMenu'],
+    preventDefault: true
   }, {
     name: HandleProjectListContextMenu,
     params: ['handleProjectListContextMenu'],
@@ -12330,8 +12423,12 @@ const renderEventListeners = () => {
     params: ['handleSubmit'],
     preventDefault: true
   }, {
-    name: HandleMissingApiKeySubmit,
-    params: ['handleMissingApiKeySubmit', 'event.submitter?.name || ""'],
+    name: HandleMissingOpenAiApiKeyFormSubmit,
+    params: ['handleMissingOpenAiApiKeyFormSubmit'],
+    preventDefault: true
+  }, {
+    name: HandleMissingOpenRouterApiKeyFormSubmit,
+    params: ['handleMissingOpenRouterApiKeyFormSubmit'],
     preventDefault: true
   }];
 };
@@ -12360,11 +12457,18 @@ const reset = async state => {
   };
 };
 
-const resize = (state, dimensions) => {
-  return {
+const resize = async (state, dimensions, getComposerHeightFn = getComposerHeight) => {
+  const nextState = {
     ...state,
     ...dimensions
   };
+  if (dimensions.width !== undefined && dimensions.width !== state.width && nextState.composerValue) {
+    return {
+      ...nextState,
+      composerHeight: await getComposerHeightFn(nextState, nextState.composerValue, nextState.width)
+    };
+  }
+  return nextState;
 };
 
 const saveState = state => {
@@ -12612,8 +12716,10 @@ const commandMap = {
   'Chat.handleKeyDown': wrapCommand(handleKeyDown),
   'Chat.handleMessagesContextMenu': wrapCommand(handleMessagesContextMenu),
   'Chat.handleMessagesScroll': wrapCommand(handleMessagesScroll),
-  'Chat.handleMissingApiKeySubmit': wrapCommand(handleMissingApiKeySubmit),
+  'Chat.handleMissingOpenAiApiKeyFormSubmit': wrapCommand(handleMissingOpenAiApiKeyFormSubmit),
+  'Chat.handleMissingOpenRouterApiKeyFormSubmit': wrapCommand(handleMissingOpenRouterApiKeyFormSubmit),
   'Chat.handleModelChange': wrapCommand(handleModelChange),
+  'Chat.handleProjectAddButtonContextMenu': wrapCommand(handleProjectAddButtonContextMenu),
   'Chat.handleProjectListContextMenu': wrapCommand(handleProjectListContextMenu),
   'Chat.handleProjectListScroll': wrapCommand(handleProjectListScroll),
   'Chat.handleRunModeChange': wrapCommand(handleRunModeChange),

package/package.json

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