@lvce-editor/chat-view 6.15.0 → 6.17.0

package/dist/chatViewWorkerMain.js

@@ -1702,7 +1702,10 @@ const createDefaultState = () => {
     messagesScrollTop: 0,
     mockAiResponseDelay: 800,
     mockApiCommandId: '',
+    modelPickerOpen: false,
+    modelPickerSearchValue: '',
     models: getDefaultModels(),
+    newChatModelPickerEnabled: false,
     nextMessageId: 1,
     openApiApiBaseUrl: 'https://api.openai.com/v1',
     openApiApiKey: '',
@@ -2560,7 +2563,7 @@ const isEqualProjectExpandedIds = (a, b) => {
   return true;
 };
 const isEqual = (oldState, newState) => {
-  return oldState.addContextButtonEnabled === newState.addContextButtonEnabled && oldState.authEnabled === newState.authEnabled && oldState.authErrorMessage === newState.authErrorMessage && oldState.authStatus === newState.authStatus && oldState.composerDropActive === newState.composerDropActive && oldState.composerDropEnabled === newState.composerDropEnabled && oldState.composerValue === newState.composerValue && oldState.initial === newState.initial && isEqualProjectExpandedIds(oldState.projectExpandedIds, newState.projectExpandedIds) && oldState.projectListScrollTop === newState.projectListScrollTop && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedModelId === newState.selectedModelId && oldState.selectedProjectId === newState.selectedProjectId && oldState.selectedSessionId === newState.selectedSessionId && oldState.showRunMode === newState.showRunMode && oldState.runMode === newState.runMode && oldState.sessions === newState.sessions && oldState.tokensMax === newState.tokensMax && oldState.tokensUsed === newState.tokensUsed && oldState.usageOverviewEnabled === newState.usageOverviewEnabled && oldState.useChatMathWorker === newState.useChatMathWorker && oldState.viewMode === newState.viewMode && oldState.voiceDictationEnabled === newState.voiceDictationEnabled;
+  return oldState.addContextButtonEnabled === newState.addContextButtonEnabled && oldState.authEnabled === newState.authEnabled && oldState.authErrorMessage === newState.authErrorMessage && oldState.authStatus === newState.authStatus && oldState.composerDropActive === newState.composerDropActive && oldState.composerDropEnabled === newState.composerDropEnabled && oldState.composerValue === newState.composerValue && oldState.initial === newState.initial && oldState.modelPickerOpen === newState.modelPickerOpen && oldState.modelPickerSearchValue === newState.modelPickerSearchValue && oldState.newChatModelPickerEnabled === newState.newChatModelPickerEnabled && isEqualProjectExpandedIds(oldState.projectExpandedIds, newState.projectExpandedIds) && oldState.projectListScrollTop === newState.projectListScrollTop && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedModelId === newState.selectedModelId && oldState.selectedProjectId === newState.selectedProjectId && oldState.selectedSessionId === newState.selectedSessionId && oldState.showRunMode === newState.showRunMode && oldState.runMode === newState.runMode && oldState.sessions === newState.sessions && oldState.tokensMax === newState.tokensMax && oldState.tokensUsed === newState.tokensUsed && oldState.usageOverviewEnabled === newState.usageOverviewEnabled && oldState.useChatMathWorker === newState.useChatMathWorker && oldState.viewMode === newState.viewMode && oldState.voiceDictationEnabled === newState.voiceDictationEnabled;
 };
 
 const diffScrollTop = (oldState, newState) => {
@@ -7688,6 +7691,9 @@ const Dictate = 'dictate';
 const Send = 'send';
 const Back = 'back';
 const Model = 'model';
+const ModelPickerToggle = 'model-picker-toggle';
+const ModelPickerSearch = 'model-picker-search';
+const ModelPickerSettings = 'model-picker-settings';
 const RunMode = 'runMode';
 const ToggleChatFocus = 'toggle-chat-focus';
 const ToggleSearch = 'toggle-search';
@@ -7703,6 +7709,7 @@ const SessionDelete = 'SessionDelete';
 const ProjectPrefix = 'project:';
 const SessionPrefix = 'session:';
 const RenamePrefix = 'session-rename:';
+const ModelPickerItemPrefix = 'model-picker-item:';
 const getProjectInputName = projectId => {
   return `${ProjectPrefix}${projectId}`;
 };
@@ -7736,6 +7743,15 @@ const isRenameInputName = name => {
 const getRenameIdFromInputName = name => {
   return name.slice(RenamePrefix.length);
 };
+const getModelPickerItemInputName = modelId => {
+  return `${ModelPickerItemPrefix}${modelId}`;
+};
+const isModelPickerItemInputName = name => {
+  return name.startsWith(ModelPickerItemPrefix);
+};
+const getModelIdFromModelPickerItemInputName = name => {
+  return name.slice(ModelPickerItemPrefix.length);
+};
 
 const OpenApiApiKeyInput = 'open-api-api-key';
 const SaveOpenApiApiKey = 'save-openapi-api-key';
@@ -7875,6 +7891,22 @@ const handleClick = async (state, name, id = '') => {
         searchFieldVisible: !state.searchFieldVisible,
         searchValue: state.searchFieldVisible ? '' : state.searchValue
       };
+    case name === ModelPickerToggle:
+      return {
+        ...state,
+        modelPickerOpen: !state.modelPickerOpen,
+        modelPickerSearchValue: state.modelPickerOpen ? '' : state.modelPickerSearchValue
+      };
+    case isModelPickerItemInputName(name):
+      {
+        const modelId = getModelIdFromModelPickerItemInputName(name);
+        return {
+          ...state,
+          modelPickerOpen: false,
+          modelPickerSearchValue: '',
+          selectedModelId: modelId
+        };
+      }
     case isProjectInputName(name):
       {
         const projectId = getProjectIdFromInputName(name);
@@ -7940,19 +7972,13 @@ const handleClickDictationButton = async state => {
   return state;
 };
 
-const handleClickNew = async state => {
-  const newState = await createSession(state);
-  const clearedState = await clearInput(newState);
-  return focusInput(clearedState);
-};
-
 const normalizeFileReferenceUri = uri => {
   if (uri.startsWith('vscode-references://')) {
     return `file://${uri.slice('vscode-references://'.length)}`;
   }
   return uri;
 };
-const handleClickReadFile = async uri => {
+const handleClickFileName = async uri => {
   if (!uri) {
     return;
   }
@@ -7960,6 +7986,12 @@ const handleClickReadFile = async uri => {
   await invoke$1('Main.openUri', normalizedUri);
 };
 
+const handleClickNew = async state => {
+  const newState = await createSession(state);
+  const clearedState = await clearInput(newState);
+  return focusInput(clearedState);
+};
+
 const handleClickSessionDebug = async state => {
   await invoke$1('Main.openUri', `chat-debug://${state.selectedSessionId}`);
   return state;
@@ -8078,6 +8110,12 @@ const handleInput = async (state, name, value, inputSource = 'user') => {
   if (name === Search) {
     return handleSearchValueChange(state, value);
   }
+  if (name === ModelPickerSearch) {
+    return {
+      ...state,
+      modelPickerSearchValue: value
+    };
+  }
   if (name !== Composer) {
     return state;
   }
@@ -8208,6 +8246,8 @@ const handleMissingApiKeySubmit = async (state, submitterName = '') => {
 const handleModelChange = async (state, value) => {
   return {
     ...state,
+    modelPickerOpen: false,
+    modelPickerSearchValue: '',
     selectedModelId: value
   };
 };
@@ -8779,6 +8819,9 @@ const loadContent = async (state, savedState) => {
     initial: false,
     lastNormalViewMode,
     messagesScrollTop,
+    modelPickerOpen: false,
+    modelPickerSearchValue: '',
+    newChatModelPickerEnabled: state.newChatModelPickerEnabled,
     openApiApiKey,
     openApiApiKeyInput: openApiApiKey,
     openRouterApiKey,
@@ -8914,7 +8957,10 @@ const registerMockResponse = (state, mockResponse) => {
 };
 
 const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily, textAreaPaddingTop, textAreaPaddingLeft, textAreaPaddingRight, textAreaPaddingBottom, chatSendAreaPaddingTop, chatSendAreaPaddingLeft, chatSendAreaPaddingRight, chatSendAreaPaddingBottom, renderHtmlCss) => {
-  const chatSendAreaHeight = composerHeight + chatSendAreaPaddingTop + chatSendAreaPaddingBottom;
+  const buttonsHeight = 20;
+  const gap = 10;
+  const contentPadding = 10;
+  const chatSendAreaHeight = composerHeight + chatSendAreaPaddingTop + chatSendAreaPaddingBottom + buttonsHeight + gap + contentPadding * 2;
   const baseCss = `:root {
   --ChatInputBoxHeight: ${composerHeight}px;
   --ChatTextAreaHeight: ${composerHeight}px;
@@ -8931,168 +8977,14 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   --ChatMessageFontSize: ${chatMessageFontSize}px;
   --ChatMessageLineHeight: ${chatMessageLineHeight}px;
   --ChatMessageFontFamily: ${chatMessageFontFamily};
-}`;
-  if (!renderHtmlCss.trim()) {
-    return `${baseCss}
-
-.ChatTodoList {
-  background: var(--vscode-editorWidget-background);
-  border: 1px solid var(--vscode-editorWidget-border);
-  border-radius: 6px;
-  margin-bottom: 8px;
-  overflow: hidden;
-}
-
-.ChatTodoListHeader {
-  border-bottom: 1px solid var(--vscode-editorWidget-border);
-  color: var(--vscode-descriptionForeground);
-  font-size: 12px;
-  line-height: 18px;
-  padding: 6px 10px;
-}
-
-.ChatTodoListItems {
-  list-style: none;
-  margin: 0;
-  max-height: 180px;
-  overflow: auto;
-  padding: 4px 0;
-}
-
-.ChatTodoListItem {
-  align-items: center;
-  color: var(--vscode-foreground);
-  display: flex;
-  font-size: 12px;
-  line-height: 18px;
-  min-height: 24px;
-  padding: 0 10px;
-}
-
-.ChatTodoListItem::before {
-  color: var(--vscode-descriptionForeground);
-  content: "○";
-  display: inline-block;
-  margin-right: 8px;
-  width: 1em;
 }
 
-.ChatTodoListItemTodo::before {
-  content: "○";
+.ChatSendAreaBottom{
+  height: ${buttonsHeight}px;
 }
-
-.ChatTodoListItem.todo::before {
-  content: "○";
-}
-
-.ChatTodoListItemInProgress::before {
-  color: var(--vscode-textLink-foreground);
-  content: "◐";
-}
-
-.ChatTodoListItem.inProgress::before {
-  color: var(--vscode-textLink-foreground);
-  content: "◐";
-}
-
-.ChatTodoListItemCompleted {
-  color: var(--vscode-disabledForeground);
-}
-
-.ChatTodoListItem.completed {
-  color: var(--vscode-disabledForeground);
-}
-
-.ChatTodoListItemCompleted::before {
-  color: var(--vscode-testing-iconPassed);
-  content: "✓";
-}
-
-.ChatTodoListItem.completed::before {
-  color: var(--vscode-testing-iconPassed);
-  content: "✓";
-}`;
-  }
+`;
   return `${baseCss}
 
-.ChatTodoList {
-  background: var(--vscode-editorWidget-background);
-  border: 1px solid var(--vscode-editorWidget-border);
-  border-radius: 6px;
-  margin-bottom: 8px;
-  overflow: hidden;
-}
-
-.ChatTodoListHeader {
-  border-bottom: 1px solid var(--vscode-editorWidget-border);
-  color: var(--vscode-descriptionForeground);
-  font-size: 12px;
-  line-height: 18px;
-  padding: 6px 10px;
-}
-
-.ChatTodoListItems {
-  list-style: none;
-  margin: 0;
-  max-height: 180px;
-  overflow: auto;
-  padding: 4px 0;
-}
-
-.ChatTodoListItem {
-  align-items: center;
-  color: var(--vscode-foreground);
-  display: flex;
-  font-size: 12px;
-  line-height: 18px;
-  min-height: 24px;
-  padding: 0 10px;
-}
-
-.ChatTodoListItem::before {
-  color: var(--vscode-descriptionForeground);
-  content: "○";
-  display: inline-block;
-  margin-right: 8px;
-  width: 1em;
-}
-
-.ChatTodoListItemTodo::before {
-  content: "○";
-}
-
-.ChatTodoListItem.todo::before {
-  content: "○";
-}
-
-.ChatTodoListItemInProgress::before {
-  color: var(--vscode-textLink-foreground);
-  content: "◐";
-}
-
-.ChatTodoListItem.inProgress::before {
-  color: var(--vscode-textLink-foreground);
-  content: "◐";
-}
-
-.ChatTodoListItemCompleted {
-  color: var(--vscode-disabledForeground);
-}
-
-.ChatTodoListItem.completed {
-  color: var(--vscode-disabledForeground);
-}
-
-.ChatTodoListItemCompleted::before {
-  color: var(--vscode-testing-iconPassed);
-  content: "✓";
-}
-
-.ChatTodoListItem.completed::before {
-  color: var(--vscode-testing-iconPassed);
-  content: "✓";
-}
-
 /* render_html tool css */
 ${renderHtmlCss}`;
 };
@@ -9157,6 +9049,12 @@ const ChatViewDropOverlay = 'ChatViewDropOverlay';
 const ChatViewDropOverlayActive = 'ChatViewDropOverlayActive';
 const SendButtonDisabled = 'SendButtonDisabled';
 const ChatSendAreaBottom = 'ChatSendAreaBottom';
+const ChatModelPickerContainer = 'ChatModelPickerContainer';
+const ChatModelPicker = 'ChatModelPicker';
+const ChatModelPickerHeader = 'ChatModelPickerHeader';
+const ChatModelPickerList = 'ChatModelPickerList';
+const ChatModelPickerItem = 'ChatModelPickerItem';
+const ChatModelPickerItemSelected = 'ChatModelPickerItemSelected';
 const ChatSendAreaContent = 'ChatSendAreaContent';
 const ChatTodoList = 'ChatTodoList';
 const ChatTodoListHeader = 'ChatTodoListHeader';
@@ -9201,6 +9099,7 @@ const Markdown = 'Markdown';
 const MarkdownQuote = 'MarkdownQuote';
 const MarkdownMathBlock = 'MarkdownMathBlock';
 const MarkdownTable = 'MarkdownTable';
+const ChatTableWrapper = 'ChatTableWrapper';
 const Message = 'Message';
 const ChatMessageContent = 'ChatMessageContent';
 const ChatToolCalls = 'ChatToolCalls';
@@ -9256,6 +9155,7 @@ const HandleChatListScroll = 21;
 const HandleMessagesScroll = 22;
 const HandleClickSessionDebug = 23;
 const HandleClickReadFile = 24;
+const HandleClickFileName = 38;
 const HandleMessagesContextMenu = 25;
 const HandleDragEnter = 26;
 const HandleDragOver = 27;
@@ -9280,6 +9180,66 @@ const getModelLabel = model => {
   return model.name;
 };
 
+const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen, modelPickerSearchValue) => {
+  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,
+    className: ChatModelPickerContainer,
+    type: Div
+  }, {
+    childCount: 2,
+    className: Select,
+    name: ModelPickerToggle,
+    onClick: HandleClick,
+    title: selectedModelLabel,
+    type: Button$1
+  }, {
+    childCount: 0,
+    className: 'MaskIcon MaskIconChevronUp',
+    type: Div
+  }, text(selectedModelLabel), ...(modelPickerOpen ? [{
+    childCount: 3 + visibleModels.length,
+    className: ChatModelPicker,
+    type: Div
+  }, {
+    childCount: 2,
+    className: ChatModelPickerHeader,
+    type: Div
+  }, {
+    childCount: 0,
+    className: InputBox,
+    name: ModelPickerSearch,
+    onInput: HandleInput,
+    placeholder: 'Search models',
+    type: Input,
+    value: modelPickerSearchValue
+  }, {
+    childCount: 1,
+    className: IconButton,
+    name: ModelPickerSettings,
+    onClick: HandleClick,
+    title: 'Settings',
+    type: Button$1
+  }, {
+    childCount: 0,
+    className: 'MaskIcon MaskIconSettingsGear',
+    type: Div
+  }, {
+    childCount: visibleModels.length,
+    className: ChatModelPickerList,
+    type: Div
+  }, ...visibleModels.flatMap(model => [{
+    childCount: 1,
+    className: `${ChatModelPickerItem}${model.id === selectedModelId ? ` ${ChatModelPickerItemSelected}` : ''}`,
+    name: getModelPickerItemInputName(model.id),
+    onClick: HandleClick,
+    type: Button$1
+  }, text(getModelLabel(model))])] : [])];
+};
+
 const getModelOptionDOm = (model, selectedModelId) => {
   return [{
     childCount: 1,
@@ -9403,7 +9363,7 @@ const getUsageOverviewDom = (tokensUsed, tokensMax) => {
   }, text(usageLabel)];
 };
 
-const getChatSendAreaDom = (composerValue, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled = false) => {
+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);
   const hasTodoList = todoListToolEnabled && todoListItems.length > 0;
@@ -9457,7 +9417,7 @@ const getChatSendAreaDom = (composerValue, models, selectedModelId, usageOvervie
     childCount: voiceDictationEnabled ? controlsCount + 1 : controlsCount,
     className: ChatSendAreaBottom,
     type: Div
-  }, ...getChatSelectVirtualDom(models, selectedModelId), ...(showRunMode ? getRunModeSelectVirtualDom(runMode) : []), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...(addContextButtonEnabled ? getAddContextButtonDom() : []), ...getSendButtonDom(isSendDisabled, voiceDictationEnabled)];
+  }, ...(newChatModelPickerEnabled ? getChatModelPickerVirtualDom(models, selectedModelId, modelPickerOpen, modelPickerSearchValue) : getChatSelectVirtualDom(models, selectedModelId)), ...(showRunMode ? getRunModeSelectVirtualDom(runMode) : []), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...(addContextButtonEnabled ? getAddContextButtonDom() : []), ...getSendButtonDom(isSendDisabled, voiceDictationEnabled)];
 };
 
 const getImageAltText = alt => {
@@ -9694,6 +9654,9 @@ const highlightCode = (code, language) => {
   }];
 };
 
+const hasVisibleInlineContent = children => {
+  return children.some(child => child.type !== 'text' || child.text.trim() !== '');
+};
 const getTokenDom = token => {
   if (!token.className) {
     return [text(token.text)];
@@ -9755,6 +9718,11 @@ const getTableRowDom = (row, useChatMathWorker) => {
 };
 const getTableDom = (node, useChatMathWorker) => {
   return [{
+    childCount: 1,
+    className: ChatTableWrapper,
+    style: 'padding-bottom: 8px;',
+    type: Div
+  }, {
     childCount: 2,
     className: MarkdownTable,
     type: Table
@@ -9800,6 +9768,9 @@ const getBlockQuoteDom = (node, useChatMathWorker) => {
 };
 const getMessageNodeDom = (node, useChatMathWorker = false) => {
   if (node.type === 'text') {
+    if (!hasVisibleInlineContent(node.children)) {
+      return [];
+    }
     return [{
       childCount: node.children.length,
       className: Markdown,
@@ -10106,7 +10077,7 @@ const getToolCallEditFileVirtualDom = toolCall => {
   const fileName = getFileNameFromUri(target.title);
   const fileNameClickableProps = target.clickableUri ? {
     'data-uri': target.clickableUri,
-    onClick: HandleClickReadFile
+    onClick: HandleClickFileName
   } : {};
   return [{
     childCount: 3,
@@ -10126,6 +10097,7 @@ const getToolCallEditFileVirtualDom = toolCall => {
   }, {
     childCount: 1,
     className: ChatToolCallFileName,
+    ...fileNameClickableProps,
     type: Span
   }, text(fileName)];
 };
@@ -10136,6 +10108,10 @@ const getToolCallGetWorkspaceUriVirtualDom = toolCall => {
   }
   const statusLabel = getToolCallStatusLabel(toolCall);
   const fileName = getFileNameFromUri(toolCall.result);
+  const fileNameClickableProps = {
+    'data-uri': toolCall.result,
+    onClick: HandleClickFileName
+  };
   return [{
     childCount: statusLabel ? 4 : 3,
     className: ChatOrderedListItem,
@@ -10148,12 +10124,12 @@ const getToolCallGetWorkspaceUriVirtualDom = toolCall => {
   }, text('get_workspace_uri '), {
     childCount: 1,
     className: ChatToolCallReadFileLink,
-    'data-uri': toolCall.result,
-    onClick: HandleClickReadFile,
+    ...fileNameClickableProps,
     type: Span
   }, {
     childCount: 1,
     className: ChatToolCallFileName,
+    ...fileNameClickableProps,
     type: Span
   }, text(fileName), ...(statusLabel ? [text(statusLabel)] : [])];
 };
@@ -10224,7 +10200,7 @@ const getToolCallReadFileVirtualDom = toolCall => {
   const statusLabel = getToolCallStatusLabel(toolCall);
   const fileNameClickableProps = target.clickableUri ? {
     'data-uri': target.clickableUri,
-    onClick: HandleClickReadFile
+    onClick: HandleClickFileName
   } : {};
   return [{
     childCount: statusLabel ? 4 : 3,
@@ -10243,6 +10219,7 @@ const getToolCallReadFileVirtualDom = toolCall => {
   }, {
     childCount: 1,
     className: ChatToolCallFileName,
+    ...fileNameClickableProps,
     type: Span
   }, text(fileName), ...(statusLabel ? [text(statusLabel)] : [])];
 };
@@ -10602,7 +10579,7 @@ const getToolCallWriteFileVirtualDom = toolCall => {
   } = parseWriteFileLineCounts(toolCall.result);
   const fileNameClickableProps = target.clickableUri ? {
     'data-uri': target.clickableUri,
-    onClick: HandleClickReadFile
+    onClick: HandleClickFileName
   } : {};
   return [{
     childCount: showDiffStats ? statusLabel ? 6 : 5 : statusLabel ? 4 : 3,
@@ -10621,6 +10598,7 @@ const getToolCallWriteFileVirtualDom = toolCall => {
   }, {
     childCount: 1,
     className: ChatToolCallFileName,
+    ...fileNameClickableProps,
     type: Span
   }, text(fileName), ...(showDiffStats ? [{
     childCount: 1,
@@ -10706,7 +10684,8 @@ const getChatMessageDom = (message, parsedMessageContent, _openRouterApiKeyInput
   const messageDom = getMessageContentDom(parsedMessageContent, useChatMathWorker);
   const toolCallsDom = getToolCallsDom(message);
   const toolCallsChildCount = toolCallsDom.length > 0 ? 1 : 0;
-  const extraChildCount = isOpenApiApiKeyMissingMessage || isOpenRouterApiKeyMissingMessage || isOpenRouterRequestFailedMessage || isOpenRouterTooManyRequestsMessage ? parsedMessageContent.length + 1 + toolCallsChildCount : parsedMessageContent.length + toolCallsChildCount;
+  const messageDomChildCount = messageDom.filter(node => node.type !== Text).length;
+  const extraChildCount = isOpenApiApiKeyMissingMessage || isOpenRouterApiKeyMissingMessage || isOpenRouterRequestFailedMessage || isOpenRouterTooManyRequestsMessage ? messageDomChildCount + 1 + toolCallsChildCount : messageDomChildCount + toolCallsChildCount;
   return [{
     childCount: 1,
     className: mergeClassNames(Message, roleClassName),
@@ -10880,7 +10859,10 @@ const getChatModeChatFocusVirtualDom = ({
   composerLineHeight = 20,
   composerValue,
   messagesScrollTop = 0,
+  modelPickerOpen = false,
+  modelPickerSearchValue = '',
   models,
+  newChatModelPickerEnabled = false,
   openApiApiKeyInput,
   openRouterApiKeyInput,
   openRouterApiKeyState = 'idle',
@@ -10911,7 +10893,7 @@ const getChatModeChatFocusVirtualDom = ({
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop, useChatMathWorker, true), ...getChatSendAreaDom(composerValue, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
+  }, ...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), ...(isDropOverlayVisible ? [{
     childCount: 1,
     className: mergeClassNames(ChatViewDropOverlay, ChatViewDropOverlayActive),
     name: ComposerDropTarget,
@@ -11045,7 +11027,10 @@ const getChatModeDetailVirtualDom = ({
   composerLineHeight = 20,
   composerValue,
   messagesScrollTop = 0,
+  modelPickerOpen = false,
+  modelPickerSearchValue = '',
   models,
+  newChatModelPickerEnabled = false,
   openApiApiKeyInput,
   openRouterApiKeyInput,
   openRouterApiKeyState = 'idle',
@@ -11073,7 +11058,7 @@ const getChatModeDetailVirtualDom = ({
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getChatHeaderDomDetailMode(selectedSessionTitle, authEnabled, authStatus, authErrorMessage), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop, useChatMathWorker), ...getChatSendAreaDom(composerValue, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
+  }, ...getChatHeaderDomDetailMode(selectedSessionTitle, authEnabled, authStatus, authErrorMessage), ...getMessagesDom(messages, parsedMessages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop, useChatMathWorker), ...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,
@@ -11187,7 +11172,10 @@ const getChatModeListVirtualDom = ({
   composerHeight = 28,
   composerLineHeight = 20,
   composerValue,
+  modelPickerOpen = false,
+  modelPickerSearchValue = '',
   models,
+  newChatModelPickerEnabled = false,
   runMode,
   searchEnabled = false,
   searchFieldVisible = false,
@@ -11212,7 +11200,7 @@ const getChatModeListVirtualDom = ({
     onDragEnter: HandleDragEnterChatView,
     onDragOver: HandleDragOverChatView,
     type: Div
-  }, ...getChatHeaderListModeDom(authEnabled, authStatus, authErrorMessage, searchEnabled, searchFieldVisible, searchValue), ...getChatListDom(visibleSessions, selectedSessionId, chatListScrollTop), ...getChatSendAreaDom(composerValue, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, addContextButtonEnabled, showRunMode, runMode, todoListToolEnabled, todoListItems, voiceDictationEnabled), ...(isDropOverlayVisible ? [{
+  }, ...getChatHeaderListModeDom(authEnabled, authStatus, authErrorMessage, searchEnabled, searchFieldVisible, searchValue), ...getChatListDom(visibleSessions, selectedSessionId, chatListScrollTop), ...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,
@@ -11320,7 +11308,10 @@ const getChatVirtualDom = options => {
     composerLineHeight,
     composerValue,
     messagesScrollTop,
+    modelPickerOpen = false,
+    modelPickerSearchValue = '',
     models,
+    newChatModelPickerEnabled = false,
     openApiApiKeyInput,
     openRouterApiKeyInput,
     openRouterApiKeyState,
@@ -11362,7 +11353,10 @@ const getChatVirtualDom = options => {
         composerLineHeight,
         composerValue,
         messagesScrollTop,
+        modelPickerOpen,
+        modelPickerSearchValue,
         models,
+        newChatModelPickerEnabled,
         openApiApiKeyInput,
         openRouterApiKeyInput,
         openRouterApiKeyState,
@@ -11398,7 +11392,10 @@ const getChatVirtualDom = options => {
         composerLineHeight,
         composerValue,
         messagesScrollTop,
+        modelPickerOpen,
+        modelPickerSearchValue,
         models,
+        newChatModelPickerEnabled,
         openApiApiKeyInput,
         openRouterApiKeyInput,
         openRouterApiKeyState,
@@ -11430,7 +11427,10 @@ const getChatVirtualDom = options => {
         composerHeight,
         composerLineHeight,
         composerValue,
+        modelPickerOpen,
+        modelPickerSearchValue,
         models,
+        newChatModelPickerEnabled,
         runMode,
         searchEnabled,
         searchFieldVisible,
@@ -11467,7 +11467,10 @@ const renderItems = (oldState, newState) => {
     composerValue,
     initial,
     messagesScrollTop,
+    modelPickerOpen,
+    modelPickerSearchValue,
     models,
+    newChatModelPickerEnabled,
     openApiApiKeyInput,
     openRouterApiKeyInput,
     openRouterApiKeyState,
@@ -11510,7 +11513,10 @@ const renderItems = (oldState, newState) => {
     composerLineHeight,
     composerValue,
     messagesScrollTop,
+    modelPickerOpen,
+    modelPickerSearchValue,
     models,
+    newChatModelPickerEnabled,
     openApiApiKeyInput,
     openRouterApiKeyInput,
     openRouterApiKeyState,
@@ -11686,7 +11692,10 @@ const renderEventListeners = () => {
     params: ['handleClickDictationButton', handleDictateClickExpression]
   }, {
     name: HandleClickReadFile,
-    params: ['handleClickReadFile', 'event.target.dataset.uri']
+    params: ['handleClickFileName', 'event.target.dataset.uri']
+  }, {
+    name: HandleClickFileName,
+    params: ['handleClickFileName', 'event.target.dataset.uri']
   }, {
     name: HandleClickDelete,
     params: ['handleClickDelete', 'event.target.dataset.id']
@@ -11789,6 +11798,8 @@ const reset = async state => {
     composerHeight: getMinComposerHeightForState(state),
     composerValue: '',
     mockAiResponseDelay: 0,
+    modelPickerOpen: false,
+    modelPickerSearchValue: '',
     openApiApiKey: '',
     openRouterApiKey: '',
     openRouterApiKeyInput: '',
@@ -11897,6 +11908,15 @@ const setEmitStreamingFunctionCallEvents = (state, emitStreamingFunctionCallEven
   };
 };
 
+const setNewChatModelPickerEnabled = (state, newChatModelPickerEnabled) => {
+  return {
+    ...state,
+    modelPickerOpen: newChatModelPickerEnabled ? state.modelPickerOpen : false,
+    modelPickerSearchValue: newChatModelPickerEnabled ? state.modelPickerSearchValue : '',
+    newChatModelPickerEnabled
+  };
+};
+
 const setQuestionToolEnabled = (state, questionToolEnabled) => {
   return {
     ...state,
@@ -12005,9 +12025,10 @@ const commandMap = {
   'Chat.handleClickClose': handleClickClose,
   'Chat.handleClickDelete': wrapCommand(handleClickDelete),
   'Chat.handleClickDictationButton': wrapCommand(handleClickDictationButton),
+  'Chat.handleClickFileName': handleClickFileName,
   'Chat.handleClickList': wrapCommand(handleClickList),
   'Chat.handleClickNew': wrapCommand(handleClickNew),
-  'Chat.handleClickReadFile': handleClickReadFile,
+  'Chat.handleClickReadFile': handleClickFileName,
   'Chat.handleClickSessionDebug': wrapCommand(handleClickSessionDebug),
   'Chat.handleClickSettings': handleClickSettings,
   'Chat.handleDragEnter': wrapCommand(handleDragEnter),
@@ -12050,6 +12071,7 @@ const commandMap = {
   'Chat.setBackendUrl': wrapCommand(setBackendUrl),
   'Chat.setChatList': wrapCommand(setChatList),
   'Chat.setEmitStreamingFunctionCallEvents': wrapCommand(setEmitStreamingFunctionCallEvents),
+  'Chat.setNewChatModelPickerEnabled': wrapCommand(setNewChatModelPickerEnabled),
   'Chat.setOpenRouterApiKey': wrapCommand(setOpenRouterApiKey),
   'Chat.setQuestionToolEnabled': wrapCommand(setQuestionToolEnabled),
   'Chat.setSearchEnabled': wrapCommand(setSearchEnabled),
@@ -12097,6 +12119,18 @@ const initializeChatNetworkWorker = async () => {
   set$6(rpc);
 };
 
+const sendMessagePortToChatStorageWorker = async port => {
+  // @ts-ignore
+  await undefined(port, 0);
+};
+const initializeChatStorageWorker = async () => {
+  const rpc = await create$4({
+    commandMap: {},
+    send: sendMessagePortToChatStorageWorker
+  });
+  set$3(rpc);
+};
+
 const send = port => {
   return sendMessagePortToChatToolWorker(port);
 };
@@ -12125,7 +12159,7 @@ const listen = async () => {
     commandMap: commandMap
   });
   set$2(rpc);
-  await Promise.all([initializeChatNetworkWorker(), initializeChatMathWorker(), initializeChatCoordinatorWorker(), initializeChatToolWorker(), initializeOpenerWorker()]);
+  await Promise.all([initializeChatNetworkWorker(), initializeChatMathWorker(), initializeChatCoordinatorWorker(), initializeChatToolWorker(), initializeOpenerWorker(), initializeChatStorageWorker()]);
 };
 
 const main = async () => {

package/package.json

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