collabmd 0.1.48 → 0.1.51

package/src/client/bootstrap/collabmd-app-shell.js

@@ -1,5 +1,7 @@
 import { PdfPreviewController } from '../application/pdf-preview-controller.js';
+import { analyzeMarkdownComplexity, isLargeDocumentStats } from '../application/preview-render-profile.js';
 import { PreviewRenderer } from '../application/preview-renderer.js';
+import { renderWebMcpDiagram } from '../application/webmcp-diagram-renderer.js';
 import { ensureQuickSwitcherInstance, toggleQuickSwitcherInstance } from '../application/quick-switcher-loader.js';
 import { WorkspaceRouteController } from '../application/workspace-route-controller.js';
 import { WikiLinkFileController } from '../application/wiki-link-file-controller.js';
@@ -18,14 +20,18 @@ import { uiFeatureSidebarMethods } from '../application/app-shell/ui-feature-sid
 import { uiFeatureTabActivityMethods } from '../application/app-shell/ui-feature-tab-activity.js';
 import { uiFeatureToolbarMethods } from '../application/app-shell/ui-feature-toolbar.js';
 import { workspaceFeature } from '../application/app-shell/workspace-feature.js';
-import { LOBBY_CHAT_MESSAGE_MAX_LENGTH, LobbyPresence } from '../infrastructure/lobby-presence.js';
+import { LOBBY_CHAT_MESSAGE_MAX_LENGTH } from '../domain/lobby-chat.js';
+import { agentConnectionApiClient } from '../infrastructure/agent-connection-api-client.js';
 import { BrowserPreferencesPort } from '../infrastructure/browser-preferences-port.js';
+import { hostedApiClient } from '../infrastructure/hosted-api-client.js';
 import { BrowserNotificationPort } from '../infrastructure/browser-notification-port.js';
 import { AppVersionMonitor } from '../infrastructure/app-version-monitor.js';
 import { gitApiClient } from '../infrastructure/git-api-client.js';
 import {
+  getActiveVaultId,
   getHashRoute,
   getRuntimeConfig,
+  setActiveVaultId,
   navigateToFile,
   navigateToGitCommit,
   navigateToGitDiff,
@@ -35,8 +41,12 @@ import {
 } from '../infrastructure/runtime-config.js';
 import { TabActivityLock } from '../infrastructure/tab-activity-lock.js';
 import { vaultApiClient } from '../infrastructure/vault-api-client.js';
-import { WorkspaceSyncClient } from '../infrastructure/workspace-sync-client.js';
+import { WebMcpToolRegistry } from '../infrastructure/webmcp-tool-registry.js';
+import { createLazyLobbyPresence, createLazyWorkspaceSyncClient } from './lazy-collab-clients.js';
+import { AgentConnectionController } from '../presentation/agent-connection-controller.js';
 import { BacklinksPanel } from '../presentation/backlinks-panel.js';
+import { HostedWorkspaceGateController } from '../presentation/hosted-workspace-gate-controller.js';
+import { TeamSettingsController } from '../presentation/team-settings-controller.js';
 import { CommentOverviewController } from '../presentation/comment-overview-controller.js';
 import { CommentUiController } from '../presentation/comment-ui-controller.js';
 import { FileExplorerController } from '../presentation/file-explorer-controller.js';
@@ -148,12 +158,12 @@ export class CollabMdAppShell {
       runtimeConfig: this.runtimeConfig,
     });
 
-    this.lobby = new LobbyPresence({
+    this.lobby = createLazyLobbyPresence({
       preferredUserName: this.getStoredUserName(),
       onChange: (users) => this.updateGlobalUsers(users),
       onChatChange: (messages, meta) => this.updateChatMessages(messages, meta),
     });
-    this.workspaceSync = new WorkspaceSyncClient({
+    this.workspaceSync = createLazyWorkspaceSyncClient({
       onTreeChange: (tree, metadata = {}) => {
         this.fileExplorer.setTree(tree, metadata);
         this.handleCommentOverviewWorkspaceTreeChange?.();
@@ -166,6 +176,80 @@ export class CollabMdAppShell {
 
     this.toastController = new ToastController(this.elements.toastContainer);
     this.chatToastController = new ToastController(this.elements.chatToastContainer);
+    this.agentConnectionController = new AgentConnectionController({
+      apiClient: agentConnectionApiClient,
+      closeToolbarMenu: () => this.closeToolbarOverflowMenu(),
+      content: this.elements.agentConnectionContent,
+      dialog: this.elements.agentConnectionDialog,
+      runtimeConfig: this.runtimeConfig,
+      toastController: this.toastController,
+      trigger: this.elements.connectAgentButton,
+    });
+    this.teamSettingsController = new TeamSettingsController({
+      apiClient: hostedApiClient,
+      closeToolbarMenu: () => this.closeToolbarOverflowMenu(),
+      content: this.elements.teamSettingsContent,
+      dialog: this.elements.teamSettingsDialog,
+      toastController: this.toastController,
+      trigger: this.elements.teamSettingsButton,
+    });
+    this.hostedGateController = new HostedWorkspaceGateController({
+      apiClient: hostedApiClient,
+      appRoot: this.elements.appShell,
+      gate: this.elements.hostedGate,
+      runtimeConfig: this.runtimeConfig,
+      teamSettingsController: this.teamSettingsController,
+    });
+    const callAgentTool = (...args) => this.vaultApiClient.callAgentTool(...args);
+    this.webMcpTools = new WebMcpToolRegistry({
+      acknowledgeToolCall: ({ input, name, preparation, result, signal }) => {
+        if (
+          name !== 'edit_excalidraw'
+          || input.path !== this.currentFilePath
+        ) {
+          return null;
+        }
+        return this.excalidrawEmbed?.waitForAgentPaint(input.path, result.revision, {
+          afterRevision: preparation?.revision,
+          signal,
+        });
+      },
+      callTool: (name, input, options) => name === 'render_diagram'
+        ? renderWebMcpDiagram(input, {
+            callTool: callAgentTool,
+            getMermaid: () => this.previewRenderer.mermaidHydrator.ensureMermaid(),
+            signal: options?.signal,
+          })
+        : callAgentTool(name, input, options),
+      getActiveContext: () => ({
+        activeDiagramPath: this.isExcalidrawFile(this.currentFilePath)
+          ? this.currentFilePath
+          : null,
+        activePath: this.currentFilePath,
+      }),
+      getIsTabActive: () => this.isTabActive,
+      onDidMutate: () => {
+        this.toastController.show('Agent-assisted Vault change applied. Review it before committing.');
+      },
+      prepareToolCall: async ({ input, name, signal }) => {
+        if (
+          ![
+            'edit_excalidraw',
+            'inspect_excalidraw',
+            'read_document',
+            'verify_excalidraw',
+          ].includes(name)
+          || input.path !== this.currentFilePath
+        ) {
+          return null;
+        }
+        const preparation = await this.excalidrawEmbed?.flushPendingAgentWrites(input.path, { signal });
+        if (['timeout', 'unavailable'].includes(preparation?.status)) {
+          throw new Error('The active Excalidraw editor did not confirm its latest collaboration update');
+        }
+        return preparation;
+      },
+    });
     this.fileExplorer = new FileExplorerController({
       mobileBreakpointQuery: this.mobileBreakpointQuery,
       onDirectoryExport: (directoryPath, format) => this.handleDirectoryExportRequest(directoryPath, format),
@@ -180,6 +264,18 @@ export class CollabMdAppShell {
       showFileExtensions: this.preferences.getFileTreeShowExtensions(),
       toastController: this.toastController,
       vaultClient: this.vaultApiClient,
+      // ponytail: reload keeps the file hash, so the same path reopens in the new vault
+      vaultSwitcher: {
+        activeVaultId: getActiveVaultId(this.runtimeConfig),
+        vaults: this.runtimeConfig.vaults ?? [],
+        onVaultSelect: (vaultId) => {
+          if (!vaultId || vaultId === getActiveVaultId(this.runtimeConfig)) {
+            return;
+          }
+          setActiveVaultId(vaultId);
+          window.location.reload();
+        },
+      },
     });
     this.commentsOverview = new CommentOverviewController({
       onOverviewChange: (_overview, { threadCounts }) => {
@@ -201,7 +297,9 @@ export class CollabMdAppShell {
       onResetFile: (filePath, { scope }) => this.openGitResetDialog(filePath, { scope }),
       onSelectCommit: (hash, { path }) => this.handleGitCommitSelection(hash, { closeSidebarOnMobile: true, path }),
       onSelectDiff: (filePath, { scope }) => this.handleGitDiffSelection(filePath, { closeSidebarOnMobile: true, scope }),
+      onStageAll: () => this.stageAllGitFiles(),
       onStageFile: (filePath, { scope }) => this.stageGitFile(filePath, { scope }),
+      onUnstageAll: () => this.unstageAllGitFiles(),
       onUnstageFile: (filePath, { scope }) => this.unstageGitFile(filePath, { scope }),
       onViewAllDiff: () => this.handleGitDiffSelection(null, { closeSidebarOnMobile: true, scope: 'all' }),
       searchInput: this.elements.gitSearchInput,
@@ -242,6 +340,11 @@ export class CollabMdAppShell {
     this.previewRenderer = new PreviewRenderer({
       getContent: () => this.getPreviewSource(),
       getFileList: () => this.fileExplorer.flatDocumentFiles,
+      getPreviewVisible: () => (
+        Boolean(this._staticPreviewDocument)
+        || this.layoutController?.currentView !== 'editor'
+      ),
+      getTheme: () => this.themeController?.getTheme?.() ?? 'dark',
       getWikiLinkAutoCreate: () => this.runtimeConfig.wikiLinkAutoCreate !== false,
       loadFileSource: async (filePath) => {
         const payload = await this.vaultApiClient.readFile(filePath);
@@ -258,10 +361,10 @@ export class CollabMdAppShell {
         this.drawioEmbed.reconcileEmbeds(this.elements.previewContent);
         this.excalidrawEmbed.reconcileEmbeds(this.elements.previewContent, { isLargeDocument: stats.isLargeDocument });
         this.scrollSyncController.setLargeDocumentMode(stats.isLargeDocument);
-        this.syncPreviewCodeCopyButtons();
         this.syncPreviewHeadingFoldButtons();
         this.syncPreviewHeadingLinkButtons();
         this.applyPendingPreviewRouteAnchor({ behavior: 'auto', clearMissing: true });
+
         this.schedulePreviewLayoutSync({ delayMs: 0 });
         this.refreshCommentUiLayout();
       },
@@ -276,11 +379,6 @@ export class CollabMdAppShell {
         this.schedulePreviewLayoutSync({ delayMs: 0 });
         this.refreshCommentUiLayout();
       },
-      onRenderComplete: () => {
-        this.applyPendingPreviewRouteAnchor({ allowExpired: true, behavior: 'auto', clearMissing: true });
-        this.schedulePreviewLayoutSync({ delayMs: 0 });
-        this.refreshCommentUiLayout();
-      },
       outlineController: this.outlineController,
       plantUmlRenderClient: this.vaultApiClient,
       previewContainer: this.elements.previewContainer,
@@ -289,8 +387,16 @@ export class CollabMdAppShell {
     });
     this.themeController = new ThemeController({ onChange: (theme) => this.handleThemeChange(theme) });
     this.layoutController = new LayoutController({
+      preferredView: this.preferences.getViewMode() || 'split',
       mobileBreakpointQuery: this.mobileBreakpointQuery,
       onMeasureEditor: () => this.session?.requestMeasure(),
+      onPreferredViewChange: (view) => this.preferences.setViewMode(view),
+      onViewChange: () => {
+        if (!this.currentFilePath && !this._staticPreviewDocument) {
+          return;
+        }
+        this.previewRenderer.queueRender();
+      },
       onViewRequest: (view) => this.handleLayoutViewRequest(view),
     });
     this.scrollSyncController = new ScrollSyncController({
@@ -307,6 +413,7 @@ export class CollabMdAppShell {
       headerPanelElement: this.elements.backlinksHeaderPanel,
       inlinePanelElement: this.elements.backlinksInlinePanel,
       loadBacklinks: (filePath, options = {}) => this.vaultApiClient.readBacklinks(filePath, options),
+      onBeforeToggle: () => this.scrollSyncController.suspendSync(250),
       onFileSelect: (filePath) => this.workspaceRouteController.handleFileSelection(filePath, {
         closeSidebarOnMobile: true,
       }),
@@ -315,6 +422,11 @@ export class CollabMdAppShell {
     this.excalidrawEmbed = new ExcalidrawEmbedController({
       getLocalUser: () => this.lobby.getLocalUser(),
       getTheme: () => this.themeController.getTheme(),
+      onOpenElement: ({ elementId, elementType, filePath } = {}) => {
+        if (filePath && elementId) {
+          this.navigation.navigateToFile(filePath, { elementId, elementType });
+        }
+      },
       onOpenFile: (filePath) => filePath && this.navigation.navigateToFile(filePath),
       onStopFollowing: () => this.stopFollowingUser(),
       onToggleQuickSwitcher: () => {
@@ -344,7 +456,10 @@ export class CollabMdAppShell {
       commentsDrawerList: this.elements.commentsDrawerList,
       commentsToggleButton: this.elements.commentsToggleButton,
       editorContainer: this.elements.editorContainer,
-      onWillOpenDrawer: () => this.outlineController.close(),
+      onWillOpenDrawer: () => {
+        this._deferredCollabStylesPromise ??= import('../styles/deferred-collab.css');
+        this.outlineController.close();
+      },
       previewContainer: this.elements.previewContainer,
       previewElement: this.elements.previewContent,
       onCreateThread: ({ anchor, body }) => this.createCommentThread({ anchor, body }),
@@ -473,6 +588,7 @@ export class CollabMdAppShell {
       }),
       getDisplayName: (filePath) => this.getDisplayName(filePath),
       getFileList: () => this.fileExplorer.flatDocumentFiles,
+      getVaultFileList: () => this.fileExplorer.flatFiles,
       getLineWrappingEnabled: () => this.getStoredLineWrapping(),
       getVimModeEnabled: () => this.getStoredVimMode(),
       getLocalUser: () => this.lobby.getLocalUser(),
@@ -496,6 +612,7 @@ export class CollabMdAppShell {
       onBeforeFileOpen: () => {
         clearTimeout(this._basePreviewRenderTimer);
         this._basePreviewRenderTimer = null;
+        this.connectWorkspaceSync?.();
         this.session = null;
         this.commentUi.attachSession(null);
         this.layoutController.reset();
@@ -506,7 +623,8 @@ export class CollabMdAppShell {
         this.clearInitialFileBootstrap();
       },
       onConnectionChange: (state) => this.handleConnectionChange(state),
-      onContentChange: ({ isBase, isHtml, isMermaid, isPlantUml, isStructurizrWorkspace }) => {
+      onContentChange: ({ isBase, isHtml, isStructurizrWorkspace }) => {
+        void this.webMcpTools.refresh();
         this.handleCommentEditorContentChange();
         if (isHtml) {
           this.workspacePreviewController.renderHtmlFilePreview({
@@ -530,10 +648,16 @@ export class CollabMdAppShell {
           return;
         }
 
-        this.previewRenderer.queueRender();
-        if (!isMermaid && !isPlantUml) {
-          this.scheduleBacklinkRefresh();
+        const markdownText = this.session?.getText?.() ?? '';
+        if (
+          !this.preferences.getViewMode()
+          && this.layoutController.currentView === 'split'
+          && isLargeDocumentStats(analyzeMarkdownComplexity(markdownText))
+        ) {
+          this.layoutController.setView('editor', { persist: false });
         }
+
+        this.previewRenderer.queueRender();
       },
       onCommentsChange: (threads) => this.handleCommentThreadsChange(threads),
       onFileAwarenessChange: (users) => this.updateFileAwareness(users),
@@ -642,7 +766,10 @@ export class CollabMdAppShell {
   }
 
   get session() { return this._session; }
-  set session(value) { this._session = value; }
+  set session(value) {
+    this._session = value;
+    void this.webMcpTools?.refresh();
+  }
 
   publishFileOpenPerf() {
     if (typeof window === 'undefined') {
@@ -705,29 +832,15 @@ export class CollabMdAppShell {
     return this._editorSessionModulePromise;
   }
 
-  scheduleEditorSessionPrewarm({ timeout = 1500 } = {}) {
-    if (this._editorSessionModulePromise || this._editorSessionPrewarmHandle) {
-      return;
-    }
-
-    const runPrewarm = () => {
-      this._editorSessionPrewarmHandle = null;
-      void this.loadEditorSessionClass();
-    };
-
-    if (typeof window.requestIdleCallback === 'function') {
-      this._editorSessionPrewarmHandle = window.requestIdleCallback(runPrewarm, { timeout });
-      return;
-    }
-
-    this._editorSessionPrewarmHandle = window.setTimeout(runPrewarm, 0);
-  }
 
   loadQuickSwitcherController() {
-    return import('../presentation/quick-switcher-controller.js')
-      .then((module) => module.QuickSwitcherController);
+    return Promise.all([
+      import('../presentation/quick-switcher-controller.js'),
+      import('../styles/features/quick-switcher.css'),
+    ]).then(([module]) => module.QuickSwitcherController);
   }
 
+
   async ensureQuickSwitcher() {
     return ensureQuickSwitcherInstance(this);
   }

package/src/client/bootstrap/lazy-collab-clients.js

@@ -0,0 +1,90 @@
+import { createRandomUser } from '../domain/room.js';
+
+function createLazyClient(load) {
+  let impl = null;
+  let loadPromise = null;
+
+  function ensure() {
+    loadPromise ??= Promise.resolve().then(load).then((created) => {
+      impl = created;
+      return created;
+    });
+    return loadPromise;
+  }
+
+  return {
+    ensure,
+    getImpl: () => impl,
+    get provider() {
+      return impl?.provider ?? null;
+    },
+    connect() {
+      void ensure().then((client) => {
+        client.connect();
+      });
+    },
+    disconnect() {
+      impl?.disconnect();
+    },
+    destroy() {
+      impl?.destroy();
+    },
+  };
+}
+
+export function createLazyLobbyPresence(options = {}) {
+  let currentFile = null;
+  let localUser = createRandomUser(options.preferredUserName);
+  const client = createLazyClient(async () => {
+    const { LobbyPresence } = await import('../infrastructure/lobby-presence.js');
+    const impl = new LobbyPresence({
+      ...options,
+      preferredUserName: localUser.name,
+    });
+    impl.localUser = localUser;
+    if (currentFile) {
+      impl.setCurrentFile(currentFile);
+    }
+    return impl;
+  });
+
+  return {
+    get provider() {
+      return client.provider;
+    },
+    connect: () => client.connect(),
+    disconnect: () => client.disconnect(),
+    destroy: () => client.destroy(),
+    getConnectionState() {
+      return client.getImpl()?.getConnectionState?.()
+        ?? { status: 'connecting', unreachable: false };
+    },
+    setCurrentFile(filePath) {
+      currentFile = filePath;
+      client.getImpl()?.setCurrentFile(filePath);
+    },
+    setUserName(name) {
+      if (!name) {
+        return;
+      }
+      localUser = { ...localUser, name };
+      client.getImpl()?.setUserName(name);
+    },
+    getLocalUser() {
+      return client.getImpl()?.getLocalUser() ?? localUser;
+    },
+    sendChatMessage(text) {
+      return client.getImpl()?.sendChatMessage(text) ?? null;
+    },
+    sendWorkspaceEvent(payload) {
+      return client.getImpl()?.sendWorkspaceEvent(payload);
+    },
+  };
+}
+
+export function createLazyWorkspaceSyncClient(options = {}) {
+  return createLazyClient(async () => {
+    const { WorkspaceSyncClient } = await import('../infrastructure/workspace-sync-client.js');
+    return new WorkspaceSyncClient(options);
+  });
+}

package/src/client/domain/excalidraw-element-link.js

@@ -0,0 +1,73 @@
+import { createFileRouteHash, getHashParamsFromRaw } from './hash-routes.js';
+import { normalizeVaultPathInput } from './vault-paths.js';
+
+const MAX_ELEMENT_ID_LENGTH = 256;
+const ELEMENT_ID_PATTERN = /^[A-Za-z0-9_-]+$/u;
+
+function normalizeElementId(value) {
+  const normalized = String(value ?? '').trim();
+  return normalized.length <= MAX_ELEMENT_ID_LENGTH && ELEMENT_ID_PATTERN.test(normalized)
+    ? normalized
+    : '';
+}
+
+function normalizeUrlPath(value) {
+  const normalized = String(value ?? '').trim().replace(/\/+$/u, '');
+  return normalized || '/';
+}
+
+export function createExcalidrawElementLink(filePath, elementId, {
+  appUrl,
+  elementType = 'element',
+} = {}) {
+  const normalizedFilePath = normalizeVaultPathInput(filePath);
+  const normalizedElementId = normalizeElementId(elementId);
+  if (!normalizedFilePath || !normalizedElementId || !appUrl) {
+    return '';
+  }
+
+  let url;
+  try {
+    url = new URL(appUrl);
+  } catch {
+    return '';
+  }
+
+  url.hash = createFileRouteHash(normalizedFilePath, {
+    elementId: normalizedElementId,
+    elementType,
+  });
+  return url.toString();
+}
+
+export function parseExcalidrawElementLink(link, {
+  appPath = '/',
+  origin = '',
+} = {}) {
+  let url;
+  try {
+    url = new URL(String(link ?? ''), origin || 'http://collabmd.invalid');
+  } catch {
+    return null;
+  }
+
+  if (origin && url.origin !== origin) {
+    return null;
+  }
+  if (normalizeUrlPath(url.pathname) !== normalizeUrlPath(appPath)) {
+    return null;
+  }
+
+  const params = getHashParamsFromRaw(url.hash);
+  const filePath = normalizeVaultPathInput(params.get('file'));
+  const elementId = normalizeElementId(params.get('element'));
+  if (!filePath || !elementId) {
+    return null;
+  }
+
+  return {
+    elementId,
+    elementType: params.get('elementType') === 'group' ? 'group' : 'element',
+    filePath,
+  };
+}

package/src/client/domain/excalidraw-scene-reconcile.js

@@ -1,5 +1,6 @@
 export function buildReconciledExcalidrawSceneUpdate({
   appStateOverrides = {},
+  authoritative = false,
   currentAppState,
   currentElements = [],
   documentViewState = {},
@@ -10,7 +11,7 @@ export function buildReconciledExcalidrawSceneUpdate({
   scene,
   theme = 'dark',
 } = {}) {
-  const restoredElements = restoreElementsFn(scene?.elements || [], currentElements, {
+  const restoredElements = restoreElementsFn(scene?.elements || [], authoritative ? [] : currentElements, {
     repairBindings: true,
   });
   const restoredAppState = restoreAppStateFn(scene?.appState || {}, currentAppState);
@@ -27,7 +28,9 @@ export function buildReconciledExcalidrawSceneUpdate({
     )),
   );
   const update = {
-    elements: reconcileElementsFn(currentElements, restoredElements, currentAppState),
+    elements: authoritative
+      ? restoredElements
+      : reconcileElementsFn(currentElements, restoredElements, currentAppState),
   };
 
   if (Object.keys(appStateUpdate).length > 0) {

package/src/client/domain/excalidraw-scene.js

@@ -63,6 +63,27 @@ export function sceneToInitialData(parsedScene, { theme = 'dark' } = {}) {
   };
 }
 
+export function createExcalidrawExportOptions(scene, {
+  padding = 24,
+  scale = 1,
+} = {}) {
+  return {
+    appState: {
+      exportBackground: true,
+      exportScale: scale,
+      exportWithDarkMode: false,
+      gridSize: scene.appState?.gridSize ?? null,
+      theme: 'light',
+      viewBackgroundColor: scene.appState?.viewBackgroundColor ?? '#ffffff',
+    },
+    elements: Array.isArray(scene.elements)
+      ? scene.elements.filter((element) => element && !element.isDeleted)
+      : [],
+    exportPadding: padding,
+    files: scene.files || null,
+  };
+}
+
 export function buildStoredScene(elements, appState, files) {
   return normalizeScene({
     elements: elements.filter((element) => !element.isDeleted),

package/src/client/domain/hash-routes.js

@@ -9,6 +9,11 @@ export const HASH_ROUTE_KEYS = Object.freeze({
   gitHistory: 'git-history',
 });
 
+export function isGitHashRouteType(type) {
+  return String(type ?? '').startsWith('git-');
+}
+
+
 export function getHashParamsFromRaw(hash = '') {
   const rawHash = String(hash ?? '');
   const normalizedHash = rawHash.startsWith('#')
@@ -38,6 +43,8 @@ export function createFileRouteHash(filePath, {
   anchor = null,
   column = null,
   drawioMode = null,
+  elementId = null,
+  elementType = null,
   line = null,
   matchLength = null,
 } = {}) {
@@ -51,6 +58,12 @@ export function createFileRouteHash(filePath, {
   if (anchor) {
     params.set('anchor', String(anchor).trim());
   }
+  if (elementId) {
+    params.set('element', String(elementId).trim());
+  }
+  if (elementType === 'group') {
+    params.set('elementType', 'group');
+  }
   if (line != null) {
     params.set('line', String(Math.max(1, Math.round(Number(line) || 1))));
   }

package/src/client/domain/highlight-runtime.js

@@ -0,0 +1,47 @@
+import hljs from 'highlight.js/lib/core';
+import bash from 'highlight.js/lib/languages/bash';
+import css from 'highlight.js/lib/languages/css';
+import javascript from 'highlight.js/lib/languages/javascript';
+import json from 'highlight.js/lib/languages/json';
+import markdown from 'highlight.js/lib/languages/markdown';
+import python from 'highlight.js/lib/languages/python';
+import sql from 'highlight.js/lib/languages/sql';
+import typescript from 'highlight.js/lib/languages/typescript';
+import xml from 'highlight.js/lib/languages/xml';
+import yaml from 'highlight.js/lib/languages/yaml';
+
+export const AUTO_HIGHLIGHT_LANGUAGES = [
+  'bash',
+  'css',
+  'javascript',
+  'json',
+  'markdown',
+  'python',
+  'sql',
+  'typescript',
+  'xml',
+  'yaml',
+];
+
+hljs.registerLanguage('bash', bash);
+hljs.registerLanguage('css', css);
+hljs.registerLanguage('javascript', javascript);
+hljs.registerLanguage('json', json);
+hljs.registerLanguage('markdown', markdown);
+hljs.registerLanguage('python', python);
+hljs.registerLanguage('sql', sql);
+hljs.registerLanguage('typescript', typescript);
+hljs.registerLanguage('xml', xml);
+hljs.registerLanguage('yaml', yaml);
+hljs.registerAliases(['cql', 'mariadb', 'mssql', 'mysql', 'plsql', 'sqlite'], { languageName: 'sql' });
+hljs.registerAliases(['ecmascript', 'node'], { languageName: 'javascript' });
+
+export { hljs };
+
+export function highlightFence(source, language, { ignoreIllegals = false } = {}) {
+  if (language && hljs.getLanguage(language)) {
+    return hljs.highlight(source, { ignoreIllegals, language }).value;
+  }
+
+  return hljs.highlightAuto(source, AUTO_HIGHLIGHT_LANGUAGES).value;
+}

package/src/client/domain/lobby-chat.js

@@ -0,0 +1,2 @@
+export const LOBBY_CHAT_MESSAGE_MAX_LENGTH = 280;
+export const LOBBY_CHAT_MAX_MESSAGES = 40;

package/src/client/domain/room.js

@@ -47,11 +47,7 @@ export function generatePeerId() {
 }
 
 function generateUserId() {
-  if (globalThis.crypto?.randomUUID) {
-    return globalThis.crypto.randomUUID();
-  }
-
-  return `${generatePeerId()}-${Date.now().toString(36)}`;
+  return globalThis.crypto?.randomUUID?.() ?? `${generatePeerId()}-${Date.now().toString(36)}`;
 }
 
 // A stable peer ID for this browser tab, shared across lobby and per-file sessions.