@lvce-editor/static-server 0.76.10 → 0.77.0

package/static/{8ccae7d → bff92c8}/packages/chat-view/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;
@@ -1407,6 +1405,104 @@ const terminate = () => {
   globalThis.close();
 };
 
+const getVisibleSessions = (sessions, selectedProjectId) => {
+  if (!selectedProjectId) {
+    return sessions;
+  }
+  const hasAssignedProjects = sessions.some(session => !!session.projectId);
+  if (!hasAssignedProjects) {
+    return sessions;
+  }
+  return sessions.filter(session => session.projectId === selectedProjectId);
+};
+
+const chatListFocusFirst = async state => {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: 0
+  };
+};
+
+const chatListFocusLast = async state => {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: visibleSessions.length - 1
+  };
+};
+
+const getListFocusIndex = state => {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (visibleSessions.length === 0) {
+    return -1;
+  }
+  if (state.listFocusedIndex >= 0 && state.listFocusedIndex < visibleSessions.length) {
+    return state.listFocusedIndex;
+  }
+  return -1;
+};
+
+const chatListFocusNext = async state => {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  const currentIndex = getListFocusIndex(state);
+  const nextIndex = currentIndex === -1 ? 0 : Math.min(currentIndex + 1, visibleSessions.length - 1);
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: nextIndex
+  };
+};
+
+const chatListFocusPrevious = async state => {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  const currentIndex = getListFocusIndex(state);
+  const previousIndex = currentIndex === -1 ? visibleSessions.length - 1 : Math.max(currentIndex - 1, 0);
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: previousIndex
+  };
+};
+
 const measureTextBlockHeight = async (text, fontFamily, fontSize, lineHeight, width) => {
   // Upstream renderer types currently require number, but runtime accepts px strings.
   // Keep forwarding the string to preserve chat-view behavior until upstream is updated.
@@ -1495,12 +1591,18 @@ const chats = () => {
 const newChat = () => {
   return i18nString('New Chat');
 };
+const addProject$1 = () => {
+  return i18nString('Add Project');
+};
 const debug = () => {
   return i18nString('Debug');
 };
 const backToChats = () => {
   return i18nString('Back to chats');
 };
+const backToChatList = () => {
+  return i18nString('Back to chat list');
+};
 const settings = () => {
   return i18nString('Settings');
 };
@@ -1714,6 +1816,7 @@ const createDefaultState = () => {
     inputSource: 'script',
     lastNormalViewMode: 'list',
     lastSubmittedSessionId: '',
+    listFocusedIndex: -1,
     listItemHeight: 40,
     maxComposerRows: 5,
     messagesAutoScrollEnabled: true,
@@ -2485,17 +2588,6 @@ const getNextSelectedSessionId = (sessions, deletedId) => {
   return sessions[nextIndex].id;
 };
 
-const getVisibleSessions = (sessions, selectedProjectId) => {
-  if (!selectedProjectId) {
-    return sessions;
-  }
-  const hasAssignedProjects = sessions.some(session => !!session.projectId);
-  if (!hasAssignedProjects) {
-    return sessions;
-  }
-  return sessions.filter(session => session.projectId === selectedProjectId);
-};
-
 const deleteSession = async (state, id) => {
   const {
     renamingSessionId,
@@ -2613,7 +2705,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 && 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;
+  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 && oldState.listFocusedIndex === newState.listFocusedIndex && 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) => {
@@ -2985,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);
 };
@@ -3010,117 +3092,195 @@ 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 = () => {
+  // TODO
+  return [{
+    command: 'Chat.handleInputCut',
+    flags: None,
+    id: 'cut',
+    label: cut()
+  }, {
+    command: 'Chat.handleInputCopy',
+    flags: None,
+    id: 'copy',
+    label: copy()
+  }, {
+    command: 'Chat.handleInputPaste',
+    flags: None,
+    id: 'copy',
+    label: paste()
+  }];
+};
+
+const getMenuEntriesChatInput = () => {
+  return [{
+    command: 'Chat.handleInputCut',
+    flags: None,
+    id: 'cut',
+    label: cut()
+  }, {
+    command: 'Chat.handleInputCopy',
+    flags: None,
+    id: 'copy',
+    label: copy()
+  }, {
+    command: 'Chat.handleInputPaste',
+    flags: None,
+    id: 'copy',
+    label: paste()
+  }];
 };
 
-const getMenuEntriesChatList = () => {
+const getMenuEntriesChatList = (sessionId = '') => {
   return [{
+    args: [sessionId],
     command: 'Chat.handleClickRename',
     flags: None,
     id: 'rename',
     label: rename()
   }, {
-    command: 'Chat.handleClickArchive',
+    args: [sessionId],
+    command: 'Chat.handleClickDelete',
     flags: None,
     id: 'archive',
     label: archive()
   }];
 };
 
-const MenuChatList = 2178;
-const getMenuEntryIds = () => {
-  return [Chat$1, MenuChatList];
+const Composer = 'composer';
+const Search = 'search';
+const ComposerDropTarget = 'composer-drop-target';
+const AddContext = 'add-context';
+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';
+const ChatList$1 = 'chat-list';
+const CreateProject = 'create-project';
+const CreateSession = 'create-session';
+const CreateSessionInProjectPrefix = 'create-session-in-project:';
+const SessionDebug = 'session-debug';
+const Settings = 'settings';
+const Login = 'login';
+const Logout = 'logout';
+const CloseChat = 'close-chat';
+const SessionDelete = 'SessionDelete';
+const ProjectPrefix = 'project:';
+const SessionPrefix = 'session:';
+const RenamePrefix = 'session-rename:';
+const ModelPickerItemPrefix = 'model-picker-item:';
+const getProjectInputName = projectId => {
+  return `${ProjectPrefix}${projectId}`;
 };
-
-const menuEntrySeparator = {
-  command: '',
-  flags: Separator,
-  id: 'separator',
-  label: ''
+const getCreateSessionInProjectInputName = projectId => {
+  return `${CreateSessionInProjectPrefix}${projectId}`;
 };
-
-const menuEntryOpenContainingFolder = {
-  command: 'Explorer.openContainingFolder',
-  flags: RestoreFocus,
-  id: 'openContainingFolder',
-  label: openContainingFolder()
+const isCreateSessionInProjectInputName = name => {
+  return name.startsWith(CreateSessionInProjectPrefix);
 };
-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 getProjectIdFromCreateSessionInProjectInputName = name => {
+  return name.slice(CreateSessionInProjectPrefix.length);
+};
+const isProjectInputName = name => {
+  return name.startsWith(ProjectPrefix);
+};
+const getProjectIdFromInputName = name => {
+  return name.slice(ProjectPrefix.length);
 };
-const menuEntryCopyPath = {
-  command: 'Explorer.copyPath',
-  flags: RestoreFocus,
-  id: 'copyPath',
-  label: copyPath()
+const getSessionInputName = sessionId => {
+  return `${SessionPrefix}${sessionId}`;
 };
-const menuEntryCopyAsE2eTest = {
-  command: 'Chat.copyAsE2eTest',
-  flags: None,
-  id: 'copyAsE2eTest',
-  label: copyPath()
+const isSessionInputName = name => {
+  return name.startsWith(SessionPrefix);
+};
+const getSessionIdFromInputName = name => {
+  return name.slice(SessionPrefix.length);
 };
-const menuEntryCopyRelativePath = {
-  command: 'Explorer.copyRelativePath',
-  flags: RestoreFocus,
-  id: 'copyRelativePath',
-  label: copyRelativePath()
+const isRenameInputName = name => {
+  return name.startsWith(RenamePrefix);
 };
-const menuEntryRename = {
-  command: 'Explorer.renameDirent',
-  flags: None,
-  id: 'rename',
-  label: rename()
+const getRenameIdFromInputName = name => {
+  return name.slice(RenamePrefix.length);
+};
+const getModelPickerItemInputName = modelId => {
+  return `${ModelPickerItemPrefix}${modelId}`;
+};
+const isModelPickerItemInputName = name => {
+  return name.startsWith(ModelPickerItemPrefix);
 };
-const menuEntryDelete = {
-  command: 'Explorer.removeDirent',
+const getModelIdFromModelPickerItemInputName = name => {
+  return name.slice(ModelPickerItemPrefix.length);
+};
+
+const menuEntryAddProject = {
+  args: [CreateProject],
+  command: 'Chat.handleClick',
   flags: None,
-  id: 'delete',
-  label: deleteItem()
+  id: 'addProject',
+  label: addProject$1()
+};
+const getMenuEntriesChatProjectList = (projectId = '') => {
+  if (!projectId) {
+    return [menuEntryAddProject];
+  }
+  return [{
+    args: [getCreateSessionInProjectInputName(projectId)],
+    command: 'Chat.handleClick',
+    flags: None,
+    id: 'newChat',
+    label: newChat()
+  }, menuEntryAddProject];
 };
-const getMenuEntriesFile = () => {
-  return [menuEntryCopyAsE2eTest, menuEntryOpenContainingFolder, menuEntryOpenInIntegratedTerminal, menuEntrySeparator, menuEntryCut, menuEntryCopy, menuEntryPaste, menuEntrySeparator, menuEntryCopyPath, menuEntryCopyRelativePath, menuEntrySeparator, menuEntryRename, menuEntryDelete];
+
+const getMenuEntriesProjectAddButton = () => {
+  return [{
+    args: [CreateProject],
+    command: 'Chat.handleClick',
+    flags: None,
+    id: 'addProject',
+    label: addProject()
+  }];
+};
+
+const MenuChatList = 2178;
+const MenuChatHeader = 2179;
+const MenuChatInput = 2180;
+const MenuProjectAddButton = 2181;
+const MenuChatProjectList = 2182;
+const getMenuEntryIds = () => {
+  return [Chat$1, MenuChatList, MenuChatHeader, MenuChatInput, MenuProjectAddButton, MenuChatProjectList];
 };
-const getMenuEntries = menuId => {
-  switch (menuId) {
+
+const getMenuEntries = (menuId, props) => {
+  switch (props.menuId) {
+    case MenuChatHeader:
+      return getMenuEntriesChatHeader();
+    case MenuChatInput:
+      return getMenuEntriesChatInput();
     case MenuChatList:
       return getMenuEntriesChatList();
+    case MenuChatProjectList:
+      return getMenuEntriesChatProjectList(props.projectId);
+    case MenuProjectAddButton:
+      return getMenuEntriesProjectAddButton();
     default:
-      return getMenuEntriesFile();
+      return [];
   }
 };
 
@@ -3132,11 +3292,21 @@ const getSelectedSessionId = state => {
   return state.selectedSessionId;
 };
 
+const handleChatDetailWelcomeContextMenu = async state => {
+  return state;
+};
+
 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;
 };
 
@@ -3172,15 +3342,16 @@ const handleChatListContextMenu = async (state, eventX, eventY) => {
   if (!item) {
     return state;
   }
-  await showContextMenu2(uid, -1, eventX, eventY, {
-    menuId: -1,
+  await showContextMenu2(uid, MenuChatList, eventX, eventY, {
+    menuId: MenuChatList,
     sessionId: item.id
   });
-  return state;
-};
-
-const handleChatWelcomeContextMenu = async state => {
-  return state;
+  return {
+    ...state,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: index
+  };
 };
 
 const generateSessionId = () => {
@@ -7051,7 +7222,8 @@ const focusInput = state => {
   return {
     ...state,
     focus: 'composer',
-    focused: true
+    focused: true,
+    listFocusedIndex: -1
   };
 };
 
@@ -7776,76 +7948,6 @@ const handleClickSend = async state => {
   return handleSubmit(submitState);
 };
 
-const Composer = 'composer';
-const Search = 'search';
-const ComposerDropTarget = 'composer-drop-target';
-const AddContext = 'add-context';
-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';
-const CreateProject = 'create-project';
-const CreateSession = 'create-session';
-const CreateSessionInProjectPrefix = 'create-session-in-project:';
-const SessionDebug = 'session-debug';
-const Settings = 'settings';
-const Login = 'login';
-const Logout = 'logout';
-const CloseChat = 'close-chat';
-const SessionDelete = 'SessionDelete';
-const ProjectPrefix = 'project:';
-const SessionPrefix = 'session:';
-const RenamePrefix = 'session-rename:';
-const ModelPickerItemPrefix = 'model-picker-item:';
-const getProjectInputName = projectId => {
-  return `${ProjectPrefix}${projectId}`;
-};
-const getCreateSessionInProjectInputName = projectId => {
-  return `${CreateSessionInProjectPrefix}${projectId}`;
-};
-const isCreateSessionInProjectInputName = name => {
-  return name.startsWith(CreateSessionInProjectPrefix);
-};
-const getProjectIdFromCreateSessionInProjectInputName = name => {
-  return name.slice(CreateSessionInProjectPrefix.length);
-};
-const isProjectInputName = name => {
-  return name.startsWith(ProjectPrefix);
-};
-const getProjectIdFromInputName = name => {
-  return name.slice(ProjectPrefix.length);
-};
-const getSessionInputName = sessionId => {
-  return `${SessionPrefix}${sessionId}`;
-};
-const isSessionInputName = name => {
-  return name.startsWith(SessionPrefix);
-};
-const getSessionIdFromInputName = name => {
-  return name.slice(SessionPrefix.length);
-};
-const isRenameInputName = name => {
-  return name.startsWith(RenamePrefix);
-};
-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';
 const OpenOpenApiApiKeySettings = 'open-openapi-api-key-settings';
@@ -7954,11 +8056,34 @@ const selectListIndex = async (state, index) => {
     return state;
   }
   const session = visibleSessions[index];
-  return selectSession(state, session.id);
+  const nextState = await selectSession(state, session.id);
+  return {
+    ...nextState,
+    focus: 'list',
+    focused: true,
+    listFocusedIndex: index
+  };
 };
 
 const handleClickList = async (state, eventX, eventY) => {
   const index = getListIndex(state, eventX, eventY);
+  if (index === -1) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (index >= visibleSessions.length) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
   return selectListIndex(state, index);
 };
 
@@ -8241,21 +8366,37 @@ const handleInputFocus = async (state, name) => {
     return {
       ...state,
       focus: 'send-button',
-      focused: true
+      focused: true,
+      listFocusedIndex: -1
+    };
+  }
+  if (name === ChatList$1) {
+    return {
+      ...state,
+      focus: 'list',
+      focused: true,
+      listFocusedIndex: -1
     };
   }
   if (isSessionInputName(name) || name === SessionDelete) {
+    const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+    const sessionId = isSessionInputName(name) ? getSessionIdFromInputName(name) : '';
+    const focusedIndex = sessionId === '' ? -1 : visibleSessions.findIndex(session => {
+      return session.id === sessionId;
+    });
     return {
       ...state,
       focus: 'list',
-      focused: true
+      focused: true,
+      listFocusedIndex: focusedIndex
     };
   }
   if (name === CreateSession || name === SessionDebug || name === Settings || name === CloseChat || name === Back) {
     return {
       ...state,
       focus: 'header',
-      focused: true
+      focused: true,
+      listFocusedIndex: -1
     };
   }
   return {
@@ -8308,6 +8449,18 @@ const handleKeyDown = async (state, key, shiftKey) => {
     sessions,
     viewMode
   } = state;
+  if (state.focus === 'list' && viewMode === 'list') {
+    switch (key) {
+      case 'ArrowDown':
+        return chatListFocusNext(state);
+      case 'ArrowUp':
+        return chatListFocusPrevious(state);
+      case 'End':
+        return chatListFocusLast(state);
+      case 'Home':
+        return chatListFocusFirst(state);
+    }
+  }
   if (key !== 'Enter' || shiftKey) {
     return state;
   }
@@ -8333,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) => {
@@ -8356,7 +8509,63 @@ const handleNewline = async state => {
   return handleInput(state, Composer, `${composerValue}\n`);
 };
 
-const handleProjectListContextMenu = async state => {
+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 || '';
+  let currentIndex = 0;
+  for (const project of projects) {
+    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 '';
+};
+const handleProjectListContextMenu = async (state, button, x, y) => {
+  const {
+    headerHeight,
+    listItemHeight,
+    projectListScrollTop,
+    uid
+  } = state;
+  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
+  });
   return state;
 };
 
@@ -9059,6 +9268,14 @@ const openMockSession = async (state, mockSessionId, mockChatMessages) => {
   };
 };
 
+const openModelPicker = state => {
+  return {
+    ...state,
+    modelPickerOpen: !state.modelPickerOpen,
+    modelPickerSearchValue: state.modelPickerOpen ? '' : state.modelPickerSearchValue
+  };
+};
+
 const pasteInput = async state => {
   const text = await readText();
   return handleInput(state, Composer, text, 'script');
@@ -9099,19 +9316,66 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   height: ${buttonsHeight}px;
 }
 
+.ChatInputBox{
+  width: 100%;
+  margin: 0;
+  border: none;
+  outline: none;
+  flex: 1;
+  background: var(--InputBoxBackground);
+  padding: 4px 6px;
+  color: var(--InputBoxForeground);
+  font-size: 13px;
+  height: 24px;
+  contain: strict;
+  resize: none;
+  overflow: hidden;
+  white-space: pre;
+  text-overflow: ellipsis;
+}
 .ChatSendArea:focus-within{
   border-color: darkcyan;
 }
 
+.SendButtonDisabled{
+  background: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-disabledForeground);
+  cursor: default;
+}
+
+.ChatModelPicker{
+  border: 1px solid var(--vscode-widget-border, var(--vscode-panel-border));
+}
+
 .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);
 }
 
 .ChatMessageContent p + p{
   margin-top: 0.75em;
 }
 
+.MissingApiKeyForm{
+  padding-top: 10px;
+}
+
+a.Button{
+  text-decoration: none;
+}
+
+.ChatHeaderLabel{
+  margin: 0;
+  font-size: 14px;
+}
+
 .ChatListItemStatusRow{
   width: 16px;
   min-width: 16px;
@@ -9134,6 +9398,8 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
 
 .ChatListItemStatusFinished{
   color: var(--vscode-testing-iconPassed);
+}
+
 .ChatListItem .SessionArchiveButton{
   opacity: 0;
 }
@@ -9142,6 +9408,70 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
 .ChatListItem:focus-within .SessionArchiveButton{
   opacity: 1;
 }
+
+.ChatHeaderLabel{
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.ChatModelPickerList{
+  margin:0;
+  scrollbar-width: thin;
+  scrollbar-color: var(--vscode-scrollbarSlider-hoverBackground) var(--vscode-editorWidget-background, var(--vscode-editor-background));
+}
+
+.ChatModelPickerList::-webkit-scrollbar{
+  width: 10px;
+}
+
+.ChatModelPickerList::-webkit-scrollbar-track{
+  background: var(--vscode-editorWidget-background, var(--vscode-editor-background));
+}
+
+.ChatModelPickerList::-webkit-scrollbar-thumb{
+  background: var(--vscode-scrollbarSlider-hoverBackground);
+  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;
+}
+
+.ChatModelPickerContainer{
+  position: absolute;
+  inset:0;
+  display: flex;
+  flex-direction: column;
+  pointer-events: none;
+}
+
+.ChatModelPicker {
+  position: static;
+  background: var(--vscode-editorWidget-background, var(--vscode-editor-background));
+  margin-top: auto;
+  margin-bottom: 90px;
+  pointer-events: auto;
+}
+
 `;
   return `${baseCss}
 
@@ -9176,7 +9506,11 @@ const renderCss = (oldState, newState) => {
   return [SetCss, uid, css];
 };
 
-const getFocusSelector = focus => {
+const getFocusSelector = state => {
+  const {
+    focus,
+    listFocusedIndex
+  } = state;
   switch (focus) {
     case 'composer':
     case 'input':
@@ -9184,7 +9518,17 @@ const getFocusSelector = focus => {
     case 'header':
       return '[name="create-session"]';
     case 'list':
-      return '[name^="session:"]';
+      {
+        if (listFocusedIndex === -1) {
+          return `[name="${ChatList$1}"]`;
+        }
+        const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+        const session = visibleSessions[listFocusedIndex];
+        if (!session) {
+          return `[name="${ChatList$1}"]`;
+        }
+        return `[name="${getSessionInputName(session.id)}"]`;
+      }
     case 'send-button':
       return '[name="send"]';
     default:
@@ -9192,7 +9536,7 @@ const getFocusSelector = focus => {
   }
 };
 const renderFocus = (oldState, newState) => {
-  const selector = getFocusSelector(newState.focus);
+  const selector = getFocusSelector(newState);
   return [FocusSelector, selector];
 };
 
@@ -9225,6 +9569,15 @@ const ChatTodoListItemInProgress = 'ChatTodoListItemInProgress';
 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';
@@ -9241,6 +9594,7 @@ const LabelDetail = 'LabelDetail';
 const ChatList = 'ChatList';
 const ChatListEmpty = 'ChatListEmpty';
 const ChatListItem = 'ChatListItem';
+const ChatListItemFocused = 'ChatListItemFocused';
 const ChatListItemStatusRow = 'ChatListItemStatusRow';
 const ChatListItemStatusIcon = 'ChatListItemStatusIcon';
 const ChatListItemStatusStopped = 'ChatListItemStatusStopped';
@@ -9266,7 +9620,9 @@ const MarkdownQuote = 'MarkdownQuote';
 const MarkdownMathBlock = 'MarkdownMathBlock';
 const MarkdownTable = 'MarkdownTable';
 const ChatTableWrapper = 'ChatTableWrapper';
+const MaskIcon = 'MaskIcon';
 const Message = 'Message';
+const MissingApiKeyForm = 'MissingApiKeyForm';
 const ChatMessageContent = 'ChatMessageContent';
 const ChatToolCalls = 'ChatToolCalls';
 const ChatToolCallsLabel = 'ChatToolCallsLabel';
@@ -9285,7 +9641,8 @@ const ChatUnorderedList = 'ChatUnorderedList';
 const ChatUnorderedListItem = 'ChatUnorderedListItem';
 const MessageUser = 'MessageUser';
 const MessageAssistant = 'MessageAssistant';
-const MultilineInputBox = 'MultilineInputBox';
+const ChatInputBox = 'ChatInputBox';
+const MultiLineInputBox = 'MultilineInputBox';
 const Option = 'Option';
 const TokenUsageOverview = 'TokenUsageOverview';
 const TokenUsageRing = 'TokenUsageRing';
@@ -9330,15 +9687,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') {
@@ -9350,13 +9709,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
   }, {
@@ -9367,10 +9724,24 @@ const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen,
     title: selectedModelLabel,
     type: Button$1
   }, {
+    childCount: 1,
+    type: Span
+  }, text(selectedModelLabel), {
     childCount: 0,
-    className: 'MaskIcon MaskIconChevronUp',
+    className: modelPickerOpen ? 'MaskIcon MaskIconChevronUp' : 'MaskIcon MaskIconChevronDown',
+    role: 'none',
     type: Div
-  }, text(selectedModelLabel), ...(modelPickerOpen ? [{
+  }];
+};
+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
+  }, {
     childCount: 3 + visibleModels.length,
     className: ChatModelPicker,
     type: Div
@@ -9381,6 +9752,7 @@ const getChatModelPickerVirtualDom = (models, selectedModelId, modelPickerOpen,
   }, {
     childCount: 0,
     className: InputBox,
+    inputType: 'search',
     name: ModelPickerSearch,
     onInput: HandleInput,
     placeholder: 'Search models',
@@ -9400,14 +9772,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) => {
@@ -9481,7 +9853,8 @@ const getSendButtonDom = (isSendDisabled, voiceDictationEnabled) => {
     type: Button$1
   }, {
     childCount: 0,
-    className: 'MaskIcon MaskIconSend',
+    className: 'MaskIcon MaskIconArrowUp',
+    role: 'none',
     type: Div
   }];
 };
@@ -9497,6 +9870,30 @@ const getAddContextButtonDom = () => {
     type: Text
   }];
 };
+const getBackToChatsButtonDom = () => {
+  return [{
+    childCount: 1,
+    className: mergeClassNames(Button, ButtonSecondary),
+    inputType: 'button',
+    name: Back,
+    onClick: HandleClickBack,
+    title: backToChatList(),
+    type: Button$1
+  }, {
+    text: backToChatList(),
+    type: Text
+  }];
+};
+
+const getTodoItemClassName = status => {
+  if (status === 'completed') {
+    return `${ChatTodoListItem} ${ChatTodoListItemCompleted} completed`;
+  }
+  if (status === 'inProgress') {
+    return `${ChatTodoListItem} ${ChatTodoListItemInProgress} inProgress`;
+  }
+  return `${ChatTodoListItem} ${ChatTodoListItemTodo} todo`;
+};
 
 const clampToPercentage = (tokensUsed, tokensMax) => {
   if (tokensMax <= 0) {
@@ -9538,15 +9935,6 @@ const getChatSendAreaDom = (composerValue, modelPickerOpen, modelPickerSearchVal
   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,
@@ -9576,7 +9964,7 @@ const getChatSendAreaDom = (composerValue, modelPickerOpen, modelPickerSearchVal
     type: Li
   }, text(item.text)])] : []), {
     childCount: 0,
-    className: MultilineInputBox,
+    className: mergeClassNames(MultiLineInputBox, ChatInputBox),
     name: Composer,
     onContextMenu: HandleChatInputContextMenu,
     onFocus: HandleFocus,
@@ -9589,7 +9977,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() : []), ...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 => {
@@ -9598,55 +9993,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,
@@ -9669,6 +10046,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]*/
@@ -9995,12 +10414,43 @@ 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,
   saveButtonDisabled = false,
   saveButtonName,
@@ -10008,10 +10458,14 @@ const getMissingApiKeyDom = ({
 }) => {
   return [{
     childCount: 2,
+    className: MissingApiKeyForm,
     method: 'GET',
-    onSubmit: HandleMissingApiKeySubmit,
+    onSubmit,
     type: Form
   }, {
+    autocapitalize: 'off',
+    autocomplete: 'off',
+    autocorrect: 'off',
     childCount: 0,
     className: InputBox,
     name: inputName,
@@ -10021,26 +10475,16 @@ const getMissingApiKeyDom = ({
     } : {}),
     placeholder,
     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),
-    inputType: 'button',
-    name: openSettingsButtonName,
-    onClick: HandleClick,
-    type: Button$1
-  }, text(getApiKeyText)];
+  }, ...getMissingApiActionsDom({
+    getApiKeyText,
+    openSettingsButtonName,
+    openSettingsUrl,
+    saveButtonDisabled,
+    saveButtonName,
+    saveButtonText
+  })];
 };
 
 const getMissingOpenApiApiKeyDom = () => {
@@ -10049,7 +10493,9 @@ const getMissingOpenApiApiKeyDom = () => {
     inputName: OpenApiApiKeyInput,
     inputPattern: '^sk-.+',
     inputRequired: true,
+    onSubmit: HandleMissingOpenAiApiKeyFormSubmit,
     openSettingsButtonName: OpenOpenApiApiKeyWebsite,
+    openSettingsUrl: 'https://platform.openai.com/api-keys',
     placeholder: openApiApiKeyPlaceholder(),
     saveButtonName: SaveOpenApiApiKey
   });
@@ -10060,7 +10506,9 @@ const getMissingOpenRouterApiKeyDom = (openRouterApiKeyState = 'idle') => {
   return getMissingApiKeyDom({
     getApiKeyText: getOpenRouterApiKey(),
     inputName: OpenRouterApiKeyInput,
+    onSubmit: HandleMissingOpenRouterApiKeyFormSubmit,
     openSettingsButtonName: OpenOpenRouterApiKeySettings,
+    openSettingsUrl: 'https://openrouter.ai/settings/keys',
     placeholder: openRouterApiKeyPlaceholder(),
     saveButtonDisabled: isSaving,
     saveButtonName: SaveOpenRouterApiKey,
@@ -10945,6 +11393,7 @@ const getProjectSessionDom = (session, selectedSessionId) => {
     className: ProjectSessionItemLabel,
     name: getSessionInputName(session.id),
     onClick: HandleClick,
+    onContextMenu: HandleProjectListContextMenu,
     tabIndex: 0,
     type: Div
   }, text(session.title)];
@@ -10965,6 +11414,7 @@ const getProjectGroupDom = (project, sessions, projectExpandedIds, selectedProje
     className: ProjectListItemLabel,
     name: getProjectInputName(project.id),
     onClick: HandleClick,
+    onContextMenu: HandleProjectListContextMenu,
     tabIndex: 0,
     type: Div
   }, {
@@ -10989,7 +11439,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 => {
@@ -10999,13 +11449,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
@@ -11014,9 +11463,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 = ({
@@ -11060,13 +11510,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), ...(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,
@@ -11077,7 +11529,7 @@ const getChatModeChatFocusVirtualDom = ({
   }, {
     text: attachImageAsContext(),
     type: Text
-  }] : [])];
+  }] : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(models, selectedModelId, modelPickerSearchValue) : [])];
 };
 
 const getBackButtonVirtualDom = () => {
@@ -11117,44 +11569,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()
@@ -11180,8 +11632,8 @@ const getChatHeaderDomDetailMode = (selectedSessionTitle, authEnabled = false, a
     type: Div
   }, ...getBackButtonVirtualDom(), {
     childCount: 1,
-    className: Label,
-    type: Span
+    className: ChatHeaderLabel,
+    type: H2
   }, text(selectedSessionTitle), ...getChatHeaderActionsDom('detail', authEnabled, authStatus), ...(hasAuthError ? [{
     childCount: 1,
     className: ChatAuthError,
@@ -11227,8 +11679,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,
@@ -11244,7 +11698,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 = '') => {
@@ -11258,8 +11712,8 @@ const getChatHeaderListModeDom = (authEnabled = false, authStatus = 'signed-out'
     type: Div
   }, {
     childCount: 1,
-    className: Label,
-    type: Span
+    className: ChatHeaderLabel,
+    type: H2
   }, text(chats()), ...getChatHeaderActionsDom('list', authEnabled, authStatus, searchEnabled), ...(hasSearchField ? [{
     childCount: 1,
     className: SearchFieldContainer,
@@ -11303,8 +11757,8 @@ const getSessionStatusClassName = session => {
   }
   return ChatListItemStatusStopped;
 };
-const getSessionDom = session => {
-  const sessionClassName = ChatListItem;
+const getSessionDom = (session, focused = false) => {
+  const sessionClassName = focused ? mergeClassNames(ChatListItem, ChatListItemFocused) : ChatListItem;
   const sessionStatusClassName = getSessionStatusClassName(session);
   return [{
     childCount: 3,
@@ -11323,6 +11777,8 @@ const getSessionDom = session => {
     className: ChatListItemLabel,
     name: getSessionInputName(session.id),
     onContextMenu: HandleListContextMenu,
+    onFocus: HandleFocus,
+    tabIndex: 0,
     type: Div
   }, text(session.title), {
     childCount: 1,
@@ -11344,18 +11800,22 @@ const getSessionDom = session => {
   }];
 };
 
-const getChatListDom = (sessions, selectedSessionId, chatListScrollTop = 0) => {
+const getChatListDom = (sessions, selectedSessionId, listFocusedIndex, chatListScrollTop = 0) => {
   if (sessions.length === 0) {
     return getEmptyChatSessionsDom();
   }
   return [{
     childCount: sessions.length,
     className: ChatList,
+    name: ChatList$1,
     onClick: HandleClickList,
+    onContextMenu: HandleListContextMenu,
+    onFocus: HandleFocus,
     onScroll: HandleChatListScroll,
     scrollTop: chatListScrollTop,
+    tabIndex: 0,
     type: Ul
-  }, ...sessions.flatMap(getSessionDom)];
+  }, ...sessions.flatMap((session, index) => getSessionDom(session, index === listFocusedIndex))];
 };
 
 const getChatModeListVirtualDom = ({
@@ -11371,6 +11831,7 @@ const getChatModeListVirtualDom = ({
   composerHeight = 28,
   composerLineHeight = 20,
   composerValue,
+  listFocusedIndex = -1,
   modelPickerOpen = false,
   modelPickerSearchValue = '',
   models,
@@ -11391,15 +11852,17 @@ 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,
     type: Div
-  }, ...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 ? [{
+  }, ...getChatHeaderListModeDom(authEnabled, authStatus, authErrorMessage, searchEnabled, searchFieldVisible, searchValue), ...getChatListDom(visibleSessions, selectedSessionId, listFocusedIndex, 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,
@@ -11410,7 +11873,7 @@ const getChatModeListVirtualDom = ({
   }, {
     text: attachImageAsContext(),
     type: Text
-  }] : [])];
+  }] : []), ...(isNewModelPickerVisible ? getChatModelPickerPopOverVirtualDom(models, selectedModelId, modelPickerSearchValue) : [])];
 };
 
 const getChatModeUnsupportedVirtualDom = () => {
@@ -11506,6 +11969,7 @@ const getChatVirtualDom = options => {
     composerHeight,
     composerLineHeight,
     composerValue,
+    listFocusedIndex = -1,
     messagesScrollTop,
     modelPickerOpen = false,
     modelPickerSearchValue = '',
@@ -11626,6 +12090,7 @@ const getChatVirtualDom = options => {
         composerHeight,
         composerLineHeight,
         composerValue,
+        listFocusedIndex,
         modelPickerOpen,
         modelPickerSearchValue,
         models,
@@ -11665,6 +12130,7 @@ const renderItems = (oldState, newState) => {
     composerLineHeight,
     composerValue,
     initial,
+    listFocusedIndex,
     messagesScrollTop,
     modelPickerOpen,
     modelPickerSearchValue,
@@ -11711,6 +12177,7 @@ const renderItems = (oldState, newState) => {
     composerHeight,
     composerLineHeight,
     composerValue,
+    listFocusedIndex,
     messagesScrollTop,
     modelPickerOpen,
     modelPickerSearchValue,
@@ -11961,6 +12428,10 @@ const renderEventListeners = () => {
   }, {
     name: HandleProjectListScroll,
     params: ['handleProjectListScroll', 'event.target.scrollTop']
+  }, {
+    name: HandleProjectAddButtonContextMenu,
+    params: ['handleProjectAddButtonContextMenu'],
+    preventDefault: true
   }, {
     name: HandleProjectListContextMenu,
     params: ['handleProjectListContextMenu'],
@@ -11971,7 +12442,8 @@ const renderEventListeners = () => {
     preventDefault: true
   }, {
     name: HandleChatWelcomeContextMenu,
-    params: ['handleChatWelcomeContextMenu']
+    params: ['handleChatDetailWelcomeContextMenu'],
+    preventDefault: true
   }, {
     name: HandleChatHeaderContextMenu,
     params: ['handleChatHeaderContextMenu'],
@@ -11995,8 +12467,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
   }];
 };
@@ -12025,11 +12501,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 => {
@@ -12233,6 +12716,10 @@ const useMockApi = (state, value, mockApiCommandId = defaultMockApiCommandId) =>
 };
 
 const commandMap = {
+  'Chat.chatListFocusFirst': wrapCommand(chatListFocusFirst),
+  'Chat.chatListFocusLast': wrapCommand(chatListFocusLast),
+  'Chat.chatListFocusNext': wrapCommand(chatListFocusNext),
+  'Chat.chatListFocusPrevious': wrapCommand(chatListFocusPrevious),
   'Chat.clearInput': wrapCommand(clearInput),
   'Chat.copyInput': wrapCommand(copyInput),
   'Chat.create': create,
@@ -12247,11 +12734,11 @@ const commandMap = {
   'Chat.getMenuEntryIds': getMenuEntryIds,
   'Chat.getQuickPickMenuEntries': getQuickPickMenuEntries,
   'Chat.getSelectedSessionId': wrapGetter(getSelectedSessionId),
+  'Chat.handleChatDetailWelcomeContextMenu': wrapCommand(handleChatDetailWelcomeContextMenu),
   'Chat.handleChatHeaderContextMenu': wrapCommand(handleChatHeaderContextMenu),
   'Chat.handleChatInputContextMenu': wrapCommand(handleChatInputContextMenu),
   'Chat.handleChatListContextMenu': wrapCommand(handleChatListContextMenu),
   'Chat.handleChatListScroll': wrapCommand(handleChatListScroll),
-  'Chat.handleChatWelcomeContextMenu': wrapCommand(handleChatWelcomeContextMenu),
   'Chat.handleClick': wrapCommand(handleClick),
   'Chat.handleClickBack': wrapCommand(handleClickBack),
   'Chat.handleClickClose': handleClickClose,
@@ -12273,8 +12760,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),
@@ -12292,6 +12781,7 @@ const commandMap = {
   'Chat.mockOpenApiStreamPushChunk': wrapCommand(mockOpenApiStreamPushChunk),
   'Chat.mockOpenApiStreamReset': wrapCommand(mockOpenApiStreamReset),
   'Chat.openMockSession': wrapCommand(openMockSession),
+  'Chat.openModelPicker': wrapCommand(openModelPicker),
   'Chat.pasteInput': wrapCommand(pasteInput),
   'Chat.registerMockResponse': wrapCommand(registerMockResponse),
   'Chat.render2': render2,