collabmd 0.1.48 → 0.1.49

package/src/client/application/app-shell/ui-feature-shell.js

@@ -247,7 +247,7 @@ function bindDialogEvents() {
       this.elements.gitResetFileName.value = '';
     }
     if (this.elements.gitResetSubmit) {
-      this.elements.gitResetSubmit.textContent = 'Reset File';
+      this.elements.gitResetSubmit.textContent = 'Reset file';
     }
   });
 
@@ -294,13 +294,24 @@ function bindEvents() {
   this.elements.emptyStateSearchBtn?.addEventListener('click', () => {
     void this.toggleQuickSwitcher();
   });
+  this.elements.presencePanel?.addEventListener('toggle', (event) => {
+    this.presencePanelOpen = event.newState === 'open';
+    this.renderAvatars?.();
+    this.renderPresence?.();
+  });
 
-  this.elements.chatToggleButton?.addEventListener('click', () => {
-    this.closePresencePanel?.();
-    this.toggleChatPanel();
-    this.closeToolbarOverflowMenu?.();
+  this.elements.chatPanel?.addEventListener('toggle', (event) => {
+    this.chatIsOpen = event.newState === 'open';
+    if (this.chatIsOpen) {
+      this.chatUnreadCount = 0;
+    }
+    this.renderChat?.({ messagesChanged: this.chatIsOpen, stickToBottom: this.chatIsOpen });
+    if (this.chatIsOpen) {
+      requestAnimationFrame(() => this.elements.chatInput?.focus());
+    }
   });
 
+
   this.elements.chatNotificationButton?.addEventListener('click', () => {
     void this.handleChatNotificationToggle();
   });
@@ -309,9 +320,6 @@ function bindEvents() {
     this.toggleChatNotificationMute();
   });
 
-  this.elements.chatCloseButton?.addEventListener('click', () => {
-    this.closeChatPanel({ restoreFocus: true });
-  });
 
   this.elements.chatForm?.addEventListener('submit', (event) => {
     event.preventDefault();
@@ -341,10 +349,6 @@ function bindEvents() {
     this.toggleVimMode();
   });
 
-  this.elements.userCount?.addEventListener('click', (event) => {
-    event.preventDefault();
-    this.togglePresencePanel?.();
-  });
 
   this.elements.editorFindButton?.addEventListener('click', () => {
     this.runEditorCommand?.('openSearch');
@@ -354,11 +358,6 @@ function bindEvents() {
     void this.formatCurrentDocument();
   });
 
-  this.elements.toolbarOverflowToggle?.addEventListener('click', (event) => {
-    event.preventDefault();
-    this.closePresencePanel?.();
-    this.toggleToolbarOverflowMenu();
-  });
 
   this.elements.toolbarOverflowMenu?.addEventListener('click', (event) => {
     const button = event.target instanceof Element ? event.target.closest('button') : null;
@@ -367,6 +366,14 @@ function bindEvents() {
     }
   });
 
+  this.elements.toolbarOverflowMenu?.addEventListener('toggle', (event) => {
+    if (event.newState === 'closed') {
+      this.elements.toolbarOverflowMenu.querySelectorAll('details[open]').forEach((detail) => {
+        detail.removeAttribute('open');
+      });
+    }
+  });
+
   this.elements.previewContent?.addEventListener('click', (event) => {
     this.handlePreviewContentClick?.(event);
   });
@@ -399,47 +406,16 @@ function bindEvents() {
     this.setSidebarTab('comments');
   });
 
-  document.addEventListener('pointerdown', (event) => {
-    this.handleDocumentPointerDown(event);
+  this.elements.sidebarTabs?.addEventListener('keydown', (event) => {
+    this.handleSidebarTabsKeydown(event);
   });
 
+
   document.addEventListener('keydown', (event) => {
     this.handleDocumentKeydown(event);
   }, { capture: true });
 }
 
-/** @this {UiShellContext} */
-function handleDocumentPointerDown(event) {
-  this.handleMarkdownToolbarDocumentPointerDown?.(event);
-
-  const target = event.target instanceof Element ? event.target : null;
-
-  if (
-    this.toolbarOverflowOpen
-    && !this.elements.toolbarOverflowMenu?.contains(target)
-    && !this.elements.toolbarOverflowToggle?.contains(target)
-  ) {
-    this.closeToolbarOverflowMenu();
-  }
-
-  if (
-    this.presencePanelOpen
-    && !this.elements.presencePanel?.contains(target)
-    && !target?.closest?.('[data-presence-panel-trigger="true"]')
-  ) {
-    this.closePresencePanel?.();
-  }
-
-  if (!this.chatIsOpen) {
-    return;
-  }
-
-  if (this.elements.chatContainer?.contains(target)) {
-    return;
-  }
-
-  this.closeChatPanel({ restoreFocus: false });
-}
 
 /** @this {UiShellContext} */
 function handleDocumentKeydown(event) {
@@ -447,20 +423,6 @@ function handleDocumentKeydown(event) {
     this.stopFollowingUser?.();
   }
 
-  if (event.key === 'Escape' && this.toolbarOverflowOpen) {
-    this.closeToolbarOverflowMenu();
-    return;
-  }
-
-  if (event.key === 'Escape' && this.presencePanelOpen) {
-    this.closePresencePanel?.();
-    return;
-  }
-
-  if (event.key === 'Escape' && this.chatIsOpen) {
-    this.closeChatPanel({ restoreFocus: true });
-    return;
-  }
 
   if (isPlainQuickSwitcherShortcut(event)) {
     event.preventDefault();
@@ -883,20 +845,6 @@ function handlePreviewContentClick(event) {
   this.session?.toggleTaskListItem?.(sourceLine);
 }
 
-/** @this {UiShellContext} */
-function setToolbarOverflowOpen(nextState) {
-  this.toolbarOverflowOpen = Boolean(nextState);
-  this.elements.toolbarOverflowToggle?.setAttribute('aria-expanded', String(this.toolbarOverflowOpen));
-  this.elements.toolbarOverflowToggle?.classList.toggle('active', this.toolbarOverflowOpen);
-  this.elements.toolbarOverflowToggle?.closest('.toolbar-right')?.classList.toggle('is-overflow-open', this.toolbarOverflowOpen);
-
-  if (!this.toolbarOverflowOpen) {
-    this.elements.toolbarOverflowMenu?.querySelectorAll('details[open]').forEach((detail) => {
-      detail.removeAttribute('open');
-    });
-  }
-}
-
 /** @this {UiShellContext} */
 function syncToolbarOverflowVisibility() {
   const toggle = this.elements.toolbarOverflowToggle;
@@ -911,12 +859,9 @@ function syncToolbarOverflowVisibility() {
 
 /** @this {UiShellContext} */
 function closeToolbarOverflowMenu() {
-  this.setToolbarOverflowOpen(false);
-}
-
-/** @this {UiShellContext} */
-function toggleToolbarOverflowMenu() {
-  this.setToolbarOverflowOpen(!this.toolbarOverflowOpen);
+  if (this.elements.toolbarOverflowMenu?.matches(':popover-open')) {
+    this.elements.toolbarOverflowMenu.hidePopover();
+  }
 }
 
 /** @this {UiShellContext} */
@@ -1049,9 +994,12 @@ function showEditorLoading() {
   if (!this.elements.editorContainer) return;
   this.elements.editorContainer.classList.add('is-loading-editor');
   this.elements.editorContainer.innerHTML = `
-      <div class="editor-loading" id="editorLoading">
-        <div class="loading-spinner"></div>
-        <span class="loading-text">Loading file...</span>
+      <div class="editor-loading" id="editorLoading" role="status" aria-live="polite" aria-label="Loading file…">
+        <div class="skeleton-line skeleton-line--title skeleton-line--break"></div>
+        <div class="skeleton-line skeleton-line--full"></div>
+        <div class="skeleton-line skeleton-line--ninety"></div>
+        <div class="skeleton-line skeleton-line--ninety-five"></div>
+        <div class="skeleton-line skeleton-line--eighty"></div>
       </div>`;
 }
 
@@ -1095,7 +1043,6 @@ export const uiFeatureShellMethods = {
   getStoredVimMode,
   handleConnectionChange,
   handleDocumentKeydown,
-  handleDocumentPointerDown,
   handlePreviewContentClick,
   handleThemeChange,
   hideEditorLoading,
@@ -1107,7 +1054,6 @@ export const uiFeatureShellMethods = {
   promptForVersionReload,
   requestPreviewRouteAnchor,
   scheduleBacklinkRefresh,
-  setToolbarOverflowOpen,
   showEditorLoadError,
   showEditorLoading,
   syncPreviewCodeCopyButtons,
@@ -1117,7 +1063,6 @@ export const uiFeatureShellMethods = {
   syncToolbarOverflowVisibility,
   syncVimModeToggle,
   syncWrapToggle,
-  toggleToolbarOverflowMenu,
   toggleLineWrapping,
   unfoldPreviewHeading,
   toggleVimMode,

package/src/client/application/app-shell/ui-feature-sidebar.js

@@ -153,6 +153,26 @@ function applySidebarVisibility(showSidebar) {
   }
 }
 
+/** @this {UiSidebarContext} */
+function handleSidebarTabsKeydown(event) {
+  if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) return;
+
+  const tabs = [
+    this.elements.filesSidebarTab,
+    this.elements.commentsSidebarTab,
+    this.elements.gitSidebarTab,
+  ].filter((tab) => tab && !tab.classList.contains('hidden'));
+  const currentIndex = Math.max(0, tabs.indexOf(event.target));
+  const nextIndex = event.key === 'Home'
+    ? 0
+    : event.key === 'End'
+      ? tabs.length - 1
+      : (currentIndex + (event.key === 'ArrowRight' ? 1 : -1) + tabs.length) % tabs.length;
+  event.preventDefault();
+  tabs[nextIndex]?.click();
+  tabs[nextIndex]?.focus();
+}
+
 /** @this {UiSidebarContext} */
 function setSidebarTab(tab) {
   const nextTab = tab === 'git' && this.gitRepoAvailable
@@ -162,15 +182,30 @@ function setSidebarTab(tab) {
       : 'files';
   this.activeSidebarTab = nextTab;
 
-  this.elements.filesSidebarTab?.classList.toggle('active', nextTab === 'files');
-  this.elements.commentsSidebarTab?.classList.toggle('active', nextTab === 'comments');
-  this.elements.gitSidebarTab?.classList.toggle('active', nextTab === 'git');
-  document.getElementById('fileTree')?.classList.toggle('hidden', nextTab !== 'files');
+  [
+    [this.elements.filesSidebarTab, 'files'],
+    [this.elements.commentsSidebarTab, 'comments'],
+    [this.elements.gitSidebarTab, 'git'],
+  ].forEach(([button, buttonTab]) => {
+    const selected = nextTab === buttonTab;
+    button?.classList.toggle('active', selected);
+    button?.setAttribute('aria-selected', String(selected));
+    button?.setAttribute('tabindex', selected ? '0' : '-1');
+  });
+  const filePanel = document.getElementById('fileTree');
+  const commentPanel = this.elements.commentOverviewPanel;
+  const gitPanelElement = document.getElementById('gitPanel');
+  [
+    [filePanel, nextTab === 'files'],
+    [commentPanel, nextTab === 'comments'],
+    [gitPanelElement, nextTab === 'git'],
+  ].forEach(([panel, selected]) => {
+    panel?.classList.toggle('hidden', !selected);
+    panel?.setAttribute('aria-hidden', String(!selected));
+  });
   this.elements.fileSearch?.classList.toggle('hidden', nextTab !== 'files');
-  this.elements.commentOverviewPanel?.classList.toggle('hidden', nextTab !== 'comments');
   this.elements.gitSearch?.classList.toggle('hidden', nextTab !== 'git');
-  document.getElementById('gitPanel')?.classList.toggle('active', nextTab === 'git');
-  document.getElementById('gitPanel')?.classList.toggle('hidden', nextTab !== 'git');
+  gitPanelElement?.classList.toggle('active', nextTab === 'git');
   this.gitPanel.setActive(nextTab === 'git');
   if (nextTab === 'comments') {
     this.refreshCommentOverviewForSidebarOpen?.();
@@ -180,6 +215,7 @@ function setSidebarTab(tab) {
 export const uiFeatureSidebarMethods = {
   applySidebarVisibility,
   closeSidebarOnMobile,
+  handleSidebarTabsKeydown,
   initializeSidebarResizer,
   isMobileViewport,
   restoreSidebarState,

package/src/client/application/app-shell/ui-feature-tab-activity.js

@@ -10,11 +10,12 @@
  * @property {string | null} followedUserClientId
  * @property {string} followedCursorSignature
  * @property {{ status: string, unreachable: boolean }} connectionState
- * @property {{ displayNameDialog?: HTMLDialogElement | HTMLElement | null, tabLockOverlay?: HTMLElement | null, tabLockTitle?: HTMLElement | null, tabLockCopy?: HTMLElement | null }} elements
+ * @property {{ tabLockOverlay?: HTMLDialogElement | null, tabLockTitle?: HTMLElement | null, tabLockCopy?: HTMLElement | null }} elements
  * @property {{ connect(): void, disconnect(): void, provider?: unknown }} lobby
  * @property {{ connect(): void, disconnect(): void, provider?: unknown }} workspaceSync
  * @property {{ show(message: string): void }} toastController
  * @property {{ tryActivate(options?: { takeover?: boolean }): void }} tabActivityLock
+ * @property {{ refresh(): Promise<boolean> }} webMcpTools
  * @property {{ prepareFileDisconnect(filePath: string): Promise<void> }} excalidrawEmbed
  * @property {{ handleHashChange(): Promise<void> }} workspaceRouteController
  * @property {() => boolean} isExcalidrawFile
@@ -35,6 +36,7 @@ function handleTabActivated({ takeover = false } = {}) {
   const wasInactive = !this.isTabActive;
   this.isTabActive = true;
   this.hideTabLockOverlay();
+  void this.webMcpTools?.refresh();
 
   if (!this.lobby.provider) {
     this.lobby.connect();
@@ -65,9 +67,7 @@ async function handleTabBlocked({ reason } = {}) {
   );
 
   this.isTabActive = false;
-  if (this.elements.displayNameDialog?.open) {
-    this.elements.displayNameDialog.close();
-  }
+  void this.webMcpTools?.refresh();
   this.lobby.disconnect();
   this.workspaceSync.disconnect();
   this.globalUsers = [];
@@ -100,6 +100,11 @@ function showTabLockOverlay({ reason } = {}) {
   const copy = this.elements.tabLockCopy;
   if (!overlay) return;
 
+  document.dispatchEvent(new Event('collabmd:close-custom-modals'));
+  document.querySelectorAll('dialog[open]').forEach((dialog) => {
+    if (dialog !== overlay) dialog.close();
+  });
+
   if (title) {
     title.textContent = reason === 'taken-over'
       ? 'This tab is no longer active'
@@ -112,12 +117,20 @@ function showTabLockOverlay({ reason } = {}) {
       : 'To avoid duplicate presence and chat, only one tab can stay connected at a time. Use the other tab, or take over the session here.';
   }
 
-  overlay.classList.remove('hidden');
+  if (!overlay.open) {
+    this.tabLockPreviouslyFocusedElement = document.activeElement instanceof HTMLElement
+      ? document.activeElement
+      : null;
+    overlay.showModal();
+  }
+  this.elements.tabLockTakeoverButton?.focus();
 }
 
 /** @this {UiTabActivityContext} */
 function hideTabLockOverlay() {
-  this.elements.tabLockOverlay?.classList.add('hidden');
+  if (this.elements.tabLockOverlay?.open) this.elements.tabLockOverlay.close();
+  this.tabLockPreviouslyFocusedElement?.focus?.();
+  this.tabLockPreviouslyFocusedElement = null;
 }
 
 export const uiFeatureTabActivityMethods = {

package/src/client/application/app-shell/ui-feature-toolbar.js

@@ -39,13 +39,17 @@ function renderBlockMenuMarkup(activeAction) {
         type="button"
         class="ui-button ui-button--ghost markdown-toolbar-block-trigger"
         data-markdown-block-menu-toggle
-        aria-haspopup="menu"
-        aria-expanded="false"
+        popovertarget="markdownBlockMenuPopover"
         title="Block formatting"
       >
         <span class="markdown-toolbar-block-trigger-label" data-markdown-block-trigger-label>${triggerLabel}</span>
         <span class="markdown-toolbar-block-trigger-icon" aria-hidden="true">${icons.chevronDown}</span>
       </button>
+      <div id="markdownBlockMenuPopover" class="markdown-toolbar-popover" popover="auto">
+        <div class="markdown-toolbar-menu" data-markdown-block-menu role="menu" aria-label="Block formatting">
+          ${renderBlockMenuItemsMarkup(activeAction)}
+        </div>
+      </div>
     </div>
   `;
 }
@@ -111,39 +115,12 @@ function renderMarkdownToolbar() {
 
   const activeAction = this.getActiveMarkdownBlockAction();
   root.innerHTML = renderMarkdownToolbarMarkup(activeAction);
-  this.renderMarkdownBlockMenuPopover();
   this.syncMarkdownToolbarBlockUi();
 }
 
 /** @this {UiToolbarContext} */
 function getMarkdownBlockMenuPopover() {
-  return this._markdownBlockMenuPopover ?? null;
-}
-
-/** @this {UiToolbarContext} */
-function renderMarkdownBlockMenuPopover() {
-  const mountTarget = this.elements?.editorContainer ?? document.body;
-  let popover = this.getMarkdownBlockMenuPopover();
-  if (!popover) {
-    popover = document.createElement('div');
-    popover.className = 'markdown-toolbar-popover hidden';
-    popover.innerHTML = '<div class="markdown-toolbar-menu" data-markdown-block-menu role="menu" aria-label="Block formatting"></div>';
-    popover.addEventListener('click', (event) => {
-      this.handleMarkdownToolbarClick?.(event);
-    });
-    popover.addEventListener('keydown', (event) => {
-      this.handleMarkdownToolbarKeydown?.(event);
-    });
-    mountTarget?.appendChild(popover);
-    this._markdownBlockMenuPopover = popover;
-  } else if (popover.parentElement !== mountTarget) {
-    mountTarget?.appendChild(popover);
-  }
-
-  const menu = popover.querySelector('[data-markdown-block-menu]');
-  if (menu) {
-    menu.innerHTML = renderBlockMenuItemsMarkup(this.getActiveMarkdownBlockAction());
-  }
+  return document.getElementById('markdownBlockMenuPopover');
 }
 
 /** @this {UiToolbarContext} */
@@ -166,13 +143,7 @@ function syncMarkdownToolbarBlockUi() {
     toggle.setAttribute('title', `${actionMeta.label}. Block formatting`);
   }
 
-  const popoverItems = Array.from(
-    this.getMarkdownBlockMenuPopover()?.querySelectorAll('[data-markdown-block-action]') ?? [],
-  );
-  const blockActionItems = [
-    ...root.querySelectorAll('[data-markdown-block-action]'),
-    ...popoverItems,
-  ];
+  const blockActionItems = root.querySelectorAll('[data-markdown-block-action]');
   blockActionItems.forEach((item) => {
     const itemAction = item.getAttribute('data-markdown-block-action');
     const isActive = itemAction === activeAction;
@@ -194,71 +165,23 @@ function setActiveMarkdownBlockAction(action) {
 
 /** @this {UiToolbarContext} */
 function isMarkdownBlockMenuOpen() {
-  return Boolean(this.elements?.markdownToolbar?.classList.contains('is-menu-open'));
-}
-
-/** @this {UiToolbarContext} */
-function positionMarkdownBlockMenu() {
-  const popover = this.getMarkdownBlockMenuPopover();
-  const toggle = this.elements?.markdownToolbar?.querySelector('[data-markdown-block-menu-toggle]');
-  const mountTarget = popover?.parentElement;
-  if (!popover || !toggle || !(mountTarget instanceof HTMLElement)) {
-    return;
-  }
-
-  const toggleRect = toggle.getBoundingClientRect();
-  const mountRect = mountTarget.getBoundingClientRect();
-  const menuRect = popover.getBoundingClientRect();
-  const menuWidth = menuRect.width || 176;
-  const menuHeight = menuRect.height || 240;
-  const horizontalPadding = 8;
-  const verticalGap = 6;
-  const preferredLeft = toggleRect.left - mountRect.left;
-  const maxLeft = Math.max(horizontalPadding, mountRect.width - menuWidth - horizontalPadding);
-  const preferredTop = (toggleRect.bottom - mountRect.top) + verticalGap;
-  const fitsBelow = preferredTop + menuHeight <= mountRect.height - horizontalPadding;
-
-  popover.style.left = `${Math.max(horizontalPadding, Math.min(preferredLeft, maxLeft))}px`;
-  popover.style.top = `${fitsBelow
-    ? preferredTop
-    : Math.max(horizontalPadding, (toggleRect.top - mountRect.top) - menuHeight - verticalGap)}px`;
+  return Boolean(this.getMarkdownBlockMenuPopover()?.matches(':popover-open'));
 }
 
 /** @this {UiToolbarContext} */
 function openMarkdownBlockMenu() {
-  const root = this.elements?.markdownToolbar;
-  if (!root) {
-    return;
-  }
-
-  this.renderMarkdownBlockMenuPopover();
-  root.classList.add('is-menu-open');
   const popover = this.getMarkdownBlockMenuPopover();
-  popover?.classList.remove('hidden');
-  root.querySelector('[data-markdown-block-menu-toggle]')?.setAttribute('aria-expanded', 'true');
-  this.positionMarkdownBlockMenu();
-}
-
-/** @this {UiToolbarContext} */
-function closeMarkdownBlockMenu() {
-  const root = this.elements?.markdownToolbar;
-  if (!root) {
-    return;
+  if (popover && !popover.matches(':popover-open')) {
+    popover.showPopover();
   }
-
-  root.classList.remove('is-menu-open');
-  this.getMarkdownBlockMenuPopover()?.classList.add('hidden');
-  root.querySelector('[data-markdown-block-menu-toggle]')?.setAttribute('aria-expanded', 'false');
 }
 
 /** @this {UiToolbarContext} */
-function toggleMarkdownBlockMenu() {
-  if (this.isMarkdownBlockMenuOpen()) {
-    this.closeMarkdownBlockMenu();
-    return;
+function closeMarkdownBlockMenu() {
+  const popover = this.getMarkdownBlockMenuPopover();
+  if (popover?.matches(':popover-open')) {
+    popover.hidePopover();
   }
-
-  this.openMarkdownBlockMenu();
 }
 
 /** @this {UiToolbarContext} */
@@ -276,12 +199,6 @@ function handleMarkdownToolbarClick(event) {
     return;
   }
 
-  const blockMenuToggle = target.closest('[data-markdown-block-menu-toggle]');
-  if (blockMenuToggle) {
-    event.preventDefault();
-    this.toggleMarkdownBlockMenu();
-    return;
-  }
 
   const blockActionButton = target.closest('[data-markdown-block-action]');
   if (blockActionButton) {
@@ -309,7 +226,7 @@ function handleMarkdownToolbarKeydown(event) {
     const toggle = event.target instanceof Element
       ? event.target.closest('[data-markdown-block-menu-toggle]')
       : null;
-    if (toggle && ['ArrowDown', 'Enter', ' '].includes(event.key)) {
+    if (toggle && event.key === 'ArrowDown') {
       event.preventDefault();
       this.openMarkdownBlockMenu();
       this.getMarkdownBlockMenuPopover()?.querySelector('[data-markdown-block-action]')?.focus();
@@ -317,18 +234,7 @@ function handleMarkdownToolbarKeydown(event) {
     return;
   }
 
-  if (event.key === 'Escape') {
-    event.preventDefault();
-    this.closeMarkdownBlockMenu();
-    this.elements?.markdownToolbar?.querySelector('[data-markdown-block-menu-toggle]')?.focus();
-    return;
-  }
-
   const menuItems = Array.from(this.getMarkdownBlockMenuPopover()?.querySelectorAll('[data-markdown-block-action]') ?? []);
-  if (menuItems.length === 0) {
-    return;
-  }
-
   const currentIndex = menuItems.findIndex((item) => item === event.target);
   if (currentIndex < 0) {
     return;
@@ -343,21 +249,6 @@ function handleMarkdownToolbarKeydown(event) {
   }
 }
 
-/** @this {UiToolbarContext} */
-function handleMarkdownToolbarDocumentPointerDown(event) {
-  if (!this.isMarkdownBlockMenuOpen()) {
-    return;
-  }
-
-  if (
-    this.elements?.markdownToolbar?.contains(event.target)
-    || this.getMarkdownBlockMenuPopover()?.contains(event.target)
-  ) {
-    return;
-  }
-
-  this.closeMarkdownBlockMenu();
-}
 
 /** @this {UiToolbarContext} */
 function applyMarkdownToolbarAction(action) {
@@ -470,16 +361,12 @@ export const uiFeatureToolbarMethods = {
   getMarkdownBlockMenuPopover,
   handleEditorImageInsert,
   handleMarkdownToolbarClick,
-  handleMarkdownToolbarDocumentPointerDown,
   handleMarkdownToolbarKeydown,
   handleToolbarImageInsert,
   isMarkdownBlockMenuOpen,
   openMarkdownBlockMenu,
-  positionMarkdownBlockMenu,
-  renderMarkdownBlockMenuPopover,
   renderMarkdownToolbar,
   runEditorCommand,
   setActiveMarkdownBlockAction,
   syncMarkdownToolbarBlockUi,
-  toggleMarkdownBlockMenu,
 };

package/src/client/application/app-shell-elements.js

@@ -1,5 +1,8 @@
 export function bindAppShellElements(doc = document) {
   return {
+    agentConnectionContent: doc.getElementById('agentConnectionContent'),
+    agentConnectionDialog: doc.getElementById('agentConnectionDialog'),
+    connectAgentButton: doc.getElementById('connectAgentBtn'),
     currentUserName: doc.getElementById('currentUserName'),
     chatContainer: doc.getElementById('chatContainer'),
     chatEmptyState: doc.getElementById('chatEmptyState'),
@@ -35,6 +38,7 @@ export function bindAppShellElements(doc = document) {
     displayNameInput: doc.getElementById('displayNameInput'),
     displayNameSubmit: doc.getElementById('displayNameSubmit'),
     displayNameTitle: doc.getElementById('displayNameTitle'),
+    fileActionDialog: doc.getElementById('fileActionDialog'),
     editNameButton: doc.getElementById('editNameBtn'),
     editorFindButton: doc.getElementById('editorFindBtn'),
     editorFormatButton: doc.getElementById('editorFormatBtn'),