collabmd 0.1.51 → 0.1.54

package/dist/client/excalidraw-editor.html

@@ -4,51 +4,58 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Excalidraw — CollabMD</title>
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script  defer src="./app-config.js"></script>
-  <script type="module" crossorigin src="./assets/excalidrawEditor-WIuguTz7.js"></script>
+  <script type="module" crossorigin src="./assets/excalidrawEditor-D0orhhku.js"></script>
   <link rel="modulepreload" crossorigin href="./assets/rolldown-runtime-Dd_uD5pT.js">
-  <link rel="modulepreload" crossorigin href="./assets/runtime-paths-Cn0snt_9.js">
-  <link rel="modulepreload" crossorigin href="./assets/runtime-config-BFVdhnJu.js">
-  <link rel="modulepreload" crossorigin href="./assets/browser-utils-DbXSMI-6.js">
-  <link rel="modulepreload" crossorigin href="./assets/preload-helper-CtT0-S4g.js">
+  <link rel="modulepreload" crossorigin href="./assets/runtime-paths-qQGhzNx4.js">
+  <link rel="modulepreload" crossorigin href="./assets/runtime-config-CvrkHb0n.js">
+  <link rel="modulepreload" crossorigin href="./assets/browser-utils-S4QYY31r.js">
+  <link rel="modulepreload" crossorigin href="./assets/preload-helper-BAlEavIC.js">
   <link rel="modulepreload" crossorigin href="./assets/file-kind-BwMIcZbi.js">
-  <link rel="modulepreload" crossorigin href="./assets/vault-api-client-QjZ_T03l.js">
-  <link rel="modulepreload" crossorigin href="./assets/jsx-runtime-BpzPEenQ.js">
+  <link rel="modulepreload" crossorigin href="./assets/vault-api-client-NS_EVHJ3.js">
+  <link rel="modulepreload" crossorigin href="./assets/jsx-runtime-DKj5X9O4.js">
   <link rel="modulepreload" crossorigin href="./assets/chunk-SRAX5OIU-KFQikY-4.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-ZNVOA63L-BmCQjhx-.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-ZPMXAHWN-Dt0TxJa6.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-5XKZK2GL-D4UAZSOJ.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-T5WUORNS-DD7KlyY6.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-ISPTBLVO-BMsDq9Ha.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-DYU5D34O-DN0WQZBm.js">
   <link rel="modulepreload" crossorigin href="./assets/chunk-Y2CYZVJY-DsF7k-Jl.js">
-  <link rel="modulepreload" crossorigin href="./assets/src-oBChb5qS.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-DU6HZSFF-C6d6PJfE.js">
+  <link rel="modulepreload" crossorigin href="./assets/src-XiVvaevx.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-X3CZISLH-BixgQztF.js">
+  <link rel="modulepreload" crossorigin href="./assets/purify.es-go7v6Te-.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-DU6HZSFF-CWlP1Dk_.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-CLGD4ZFX-BfYJtJm1.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-P2QGCYS3-BA--DhpW.js">
+  <link rel="modulepreload" crossorigin href="./assets/html-DTuc_pxj.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-PWAF6VOD-D_kLse-N.js">
   <link rel="modulepreload" crossorigin href="./assets/dist-B_J_HbC0.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-75Z2AOVW-B2cZexqK.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-CLGD4ZFX-Cmtx89ht.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-P2QGCYS3-Du8EtwOa.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-PWAF6VOD-B3gML4ps.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-GMAD6QVW-DUfjx_d5.js">
+  <link rel="modulepreload" crossorigin href="./assets/merge-CALoRt3l.js">
+  <link rel="modulepreload" crossorigin href="./assets/Middleware-DUgFSleI.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-75Z2AOVW-DitkSoSG.js">
+  <link rel="modulepreload" crossorigin href="./assets/esm-BzZ1JFVo.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-GMAD6QVW-Bgk8qnty.js">
   <link rel="modulepreload" crossorigin href="./assets/rough.esm-Dy-Kn_BL.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-4HAMMTFA-Ht-73lsT.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-GVQU2GXP-D1l7oRGR.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-L3NEJ4N5-BmCVn4y-.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-4HAMMTFA-q0ldNVvr.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-GVQU2GXP-CQ8cl-Uu.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-L3NEJ4N5-BflzkdTI.js">
   <link rel="modulepreload" crossorigin href="./assets/path-fybaL0A-.js">
   <link rel="modulepreload" crossorigin href="./assets/array-BifhSqXX.js">
-  <link rel="modulepreload" crossorigin href="./assets/line-DSWLHgpx.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-OSK3NFVY-CWHXAmfx.js">
-  <link rel="modulepreload" crossorigin href="./assets/graphlib-DS17s2tU.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-2E4U76K2-Ba8Wf22k.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-LNGE3PJU-DWpGwHrW.js">
-  <link rel="modulepreload" crossorigin href="./assets/chunk-TLUHSLCS-Yl7B0Vrz.js">
-  <link rel="modulepreload" crossorigin href="./assets/mermaid.core-D0cMM4Rl.js">
-  <link rel="modulepreload" crossorigin href="./assets/dist-l-56SowH.js">
-  <link rel="modulepreload" crossorigin href="./assets/prod-pbFU4TaM.js">
+  <link rel="modulepreload" crossorigin href="./assets/line-DEbP8Ok6.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-OSK3NFVY-DqeKV_pg.js">
+  <link rel="modulepreload" crossorigin href="./assets/_baseUniq-DR4vVjyC.js">
+  <link rel="modulepreload" crossorigin href="./assets/graphlib-C9Tl7QrK.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-2E4U76K2-CIQUuV9n.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-LNGE3PJU-5-SxdO55.js">
+  <link rel="modulepreload" crossorigin href="./assets/chunk-TLUHSLCS-DCZhIDYA.js">
+  <link rel="modulepreload" crossorigin href="./assets/dist-Ch6Sr9KF.js">
+  <link rel="modulepreload" crossorigin href="./assets/prod-CA0ie9yD.js">
+  <link rel="modulepreload" crossorigin href="./assets/comment-threads-nJhK1yfc.js">
+  <link rel="modulepreload" crossorigin href="./assets/comment-thread-store-CHvy8GF8.js">
   <link rel="modulepreload" crossorigin href="./assets/room-DX7lIfnu.js">
   <link rel="modulepreload" crossorigin href="./assets/excalidraw-scene-6uROebca.js">
-  <link rel="modulepreload" crossorigin href="./assets/comment-threads-nJhK1yfc.js">
-  <link rel="modulepreload" crossorigin href="./assets/excalidraw-element-link-iA6zo0_f.js">
-  <link rel="modulepreload" crossorigin href="./assets/comment-thread-store-NNHqRVsX.js">
-  <link rel="stylesheet" crossorigin href="./assets/excalidrawEditor-DDE0n1Pk.css">
-  <link rel="stylesheet" crossorigin href="./assets/embedded-editor-base-jK221GC8.css">
+  <link rel="modulepreload" crossorigin href="./assets/excalidraw-element-link-BRZOTIeI.js">
+  <link rel="stylesheet" crossorigin href="./assets/excalidrawEditor-BCTFp_CV.css">
+  <link rel="stylesheet" crossorigin href="./assets/embedded-editor-base-elU0Avik.css">
 </head>
 <body data-theme="dark" data-surface="excalidraw-editor">
   <div id="root">

package/dist/client/export-document.html

@@ -4,11 +4,12 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>CollabMD Export</title>
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script  defer src="./app-config.js"></script>
-  <script type="module" crossorigin src="./assets/exportDocument-B9xNKpQe.js"></script>
-  <link rel="modulepreload" crossorigin href="./assets/preload-helper-CtT0-S4g.js">
+  <script type="module" crossorigin src="./assets/exportDocument-DSshnmnZ.js"></script>
+  <link rel="modulepreload" crossorigin href="./assets/preload-helper-BAlEavIC.js">
   <link rel="modulepreload" crossorigin href="./assets/github.min-DBihDoic.js">
-  <link rel="stylesheet" crossorigin href="./assets/exportDocument-B7IagJhQ.css">
+  <link rel="stylesheet" crossorigin href="./assets/exportDocument-Ba-n1X4U.css">
 </head>
 <body data-theme="light" data-surface="export-document">
   <main class="export-page-shell">

package/dist/client/index.html

@@ -5,8 +5,18 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="description" content="CollabMD — collaborative markdown vault. Edit markdown files together in realtime.">
   <title>CollabMD — Collaborative Markdown Vault</title>
-  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect x='2' y='4' width='18' height='24' rx='3' fill='%23818cf8'/><rect x='12' y='4' width='18' height='24' rx='3' fill='%234f46e5' opacity='0.8'/><path d='M18 12h6M18 16h6M18 20h4' stroke='white' stroke-width='1.5' stroke-linecap='round'/></svg>">
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script>
+    let preferredTheme;
+    try {
+      preferredTheme = window.localStorage.getItem('collabmd-theme');
+    } catch {
+      // Storage may be unavailable in restricted browser contexts.
+    }
+    document.documentElement.dataset.theme = ['light', 'dark'].includes(preferredTheme)
+      ? preferredTheme
+      : window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    document.documentElement.dataset.workspaceLoading = 'true';
     if (
       window.location.hash.includes('file=')
       || window.location.hash.includes('git-diff=')
@@ -16,10 +26,11 @@
     }
   </script>
   <script  defer src="./app-config.js"></script>
-  <script type="module" crossorigin src="./assets/index-mWiw418b.js"></script>
-  <link rel="stylesheet" crossorigin href="./assets/index-BAmZnTFV.css">
+  <script type="module" crossorigin src="./assets/index-BpmR5Qqk.js"></script>
+  <link rel="stylesheet" crossorigin href="./assets/index-BCgNcVNs.css">
 </head>
 <body>
+    <div class="workspace-loading" id="workspaceLoading" role="status">Opening workspace…</div>
 
     <a href="#editorContainer" class="sr-only skip-link" id="skipToEditor">Skip to editor</a>
 
@@ -27,11 +38,10 @@
       <aside id="sidebar" class="sidebar">
         <div class="sidebar-header">
           <div class="sidebar-brand">
-            <svg width="20" height="20" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
-              <rect x="6" y="8" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.12"></rect>
-              <rect x="22" y="10" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.25"></rect>
-              <path d="M14 20l4 10 1.5-4 4-1.5L14 20z" fill="var(--color-primary)" opacity="0.7"></path>
-              <path d="M38 28l-4-10-1.5 4-4 1.5L38 28z" fill="var(--color-primary)"></path>
+            <svg width="20" height="20" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+              <rect x="3" y="4" width="17" height="24" rx="3" stroke="var(--color-primary)" stroke-width="2"></rect>
+              <rect x="12" y="4" width="17" height="24" rx="3" fill="var(--color-primary)"></rect>
+              <path d="M17 12h7m-7 4h7m-7 4h4" stroke="var(--color-primary-contrast)" stroke-width="1.5"></path>
             </svg>
             <span class="sidebar-title">CollabMD</span>
           </div>
@@ -390,6 +400,15 @@
                 <span class="ui-toolbar-button-label">Search files</span>
               </button>
 
+              <button type="button" class="ui-button ui-button--ghost ui-button--toolbar ui-button--toggle" id="toggleCursorNamesBtn" aria-label="Hide cursor names" aria-pressed="true" title="Hide cursor names">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <circle cx="12" cy="8" r="4"></circle>
+                  <path d="M5 21v-2a7 7 0 0 1 14 0v2"></path>
+                </svg>
+                <span class="ui-toolbar-button-label">Cursor names</span>
+                <span class="ui-pill-badge ui-pill-badge--muted toolbar-toggle-state" id="cursorNamesToggleLabel">On</span>
+              </button>
+
               <button class="ui-button ui-button--ghost ui-button--toolbar ui-button--toggle toolbar-vim-button" id="toggleVimModeBtn" aria-label="Enable Vim keybindings" aria-pressed="false" title="Enable Vim keybindings">
                 <span class="toolbar-vim-icon" aria-hidden="true">
                   <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
@@ -399,7 +418,7 @@
                   </svg>
                 </span>
                 <span class="ui-toolbar-button-label">Vim</span>
-                <span class="ui-pill-badge ui-pill-badge--muted toolbar-vim-state" id="vimModeToggleLabel">Off</span>
+                <span class="ui-pill-badge ui-pill-badge--muted toolbar-toggle-state" id="vimModeToggleLabel">Off</span>
               </button>
 
               <details class="toolbar-overflow-group hidden" id="exportMenuGroup">
@@ -457,11 +476,10 @@
         <div id="emptyState" class="empty-state">
           <div class="empty-state-content">
             <div class="empty-state-logo" aria-hidden="true">
-              <svg width="48" height="48" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <rect x="6" y="8" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.12"></rect>
-                <rect x="22" y="10" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.25"></rect>
-                <path d="M14 20l4 10 1.5-4 4-1.5L14 20z" fill="var(--color-primary)" opacity="0.7"></path>
-                <path d="M38 28l-4-10-1.5 4-4 1.5L38 28z" fill="var(--color-primary)"></path>
+              <svg width="48" height="48" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+                <rect x="3" y="4" width="17" height="24" rx="3" stroke="var(--color-primary)" stroke-width="2"></rect>
+                <rect x="12" y="4" width="17" height="24" rx="3" fill="var(--color-primary)"></rect>
+                <path d="M17 12h7m-7 4h7m-7 4h4" stroke="var(--color-primary-contrast)" stroke-width="1.5"></path>
               </svg>
             </div>
             <h2 class="empty-state-title">Welcome to CollabMD</h2>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "collabmd",
-  "version": "0.1.51",
+  "version": "0.1.54",
   "type": "module",
   "description": "Collaborative markdown vault — like Obsidian, but online. Serve any directory of markdown files for realtime collaborative editing.",
   "repository": {
@@ -67,14 +67,17 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@excalidraw/fractional-indexing": "^0.18.0-214cd6e",
+    "@excalidraw/fractional-indexing": "^0.18.0-c0ad61c",
     "@modelcontextprotocol/client": "^2.0.0",
     "@modelcontextprotocol/node": "^2.0.0",
     "@modelcontextprotocol/server": "^2.0.0",
-    "@turbodocx/html-to-docx": "^1.22.2",
+    "@turbodocx/html-to-docx": "^1.23.1",
+    "@vscode/markdown-it-katex": "^1.1.2",
     "archiver": "^8.0.0",
-    "js-yaml": "^5.4.1",
+    "js-yaml": "^5.4.2",
+    "katex": "^0.18.7",
     "lib0": "^0.2.117",
+    "mathml2omml": "^0.5.0",
     "openid-client": "^6.8.8",
     "sharp": "^0.35.4",
     "ws": "^8.21.3",
@@ -95,34 +98,34 @@
   },
   "devDependencies": {
     "@codemirror/autocomplete": "^6.20.3",
-    "@codemirror/commands": "^6.11.0",
+    "@codemirror/commands": "^6.11.1",
     "@codemirror/lang-html": "^6.4.12",
     "@codemirror/lang-markdown": "^6.5.2",
     "@codemirror/lang-yaml": "^6.1.3",
     "@codemirror/language": "^6.12.4",
     "@codemirror/language-data": "^6.5.2",
     "@codemirror/search": "^6.7.2",
-    "@codemirror/state": "^6.7.4",
+    "@codemirror/state": "^6.7.5",
     "@codemirror/theme-one-dark": "^6.1.3",
-    "@codemirror/view": "^6.43.11",
-    "@embedpdf/snippet": "2.15.0",
+    "@codemirror/view": "^6.43.12",
+    "@embedpdf/snippet": "2.15.1",
     "@eslint/js": "^10.0.1",
-    "@excalidraw/excalidraw": "0.18.0-214cd6e",
+    "@excalidraw/excalidraw": "0.18.0-c0ad61c",
     "@playwright/test": "^1.63.0",
     "@replit/codemirror-vim": "^6.4.0",
-    "@vitest/browser": "^5.0.0",
-    "@vitest/browser-playwright": "^5.0.0",
-    "eslint": "^10.10.0",
+    "@vitest/browser": "^5.0.1",
+    "@vitest/browser-playwright": "^5.0.1",
+    "eslint": "^10.11.0",
     "globals": "^17.12.0",
     "highlight.js": "^11.12.0",
-    "markdown-it": "^15.0.1",
-    "mermaid": "^11.17.2",
+    "markdown-it": "^15.0.2",
+    "mermaid": "^12.0.0",
     "mermaid-formatter": "^0.3.0",
-    "prettier": "^3.9.6",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
-    "vite": "^8.2.2",
-    "vitest": "^5.0.0",
+    "prettier": "^3.9.8",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "vite": "^8.3.0",
+    "vitest": "^5.0.1",
     "y-codemirror.next": "^0.3.6",
     "y-websocket": "^3.1.0"
   }

package/src/client/app/drawio-editor.html

@@ -4,6 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>draw.io — CollabMD</title>
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script vite-ignore defer src="./app-config.js"></script>
 </head>
 <body data-theme="dark" data-surface="drawio-editor">

package/src/client/app/excalidraw-editor.html

@@ -4,6 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Excalidraw — CollabMD</title>
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script vite-ignore defer src="./app-config.js"></script>
 </head>
 <body data-theme="dark" data-surface="excalidraw-editor">

package/src/client/app/export-document-entry.js

@@ -5,6 +5,7 @@ import '../styles/foundation/themes.css';
 import '../styles/features/preview-markdown.css';
 import '../styles/overrides/highlightjs.css';
 import '../styles/export-document.css';
+import 'katex/dist/katex.min.css';
 
 function ensureHighlightThemeStylesheet() {
   let themeStylesheet = document.getElementById('hljs-theme');

package/src/client/app/export-document.html

@@ -4,6 +4,7 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>CollabMD Export</title>
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script vite-ignore defer src="./app-config.js"></script>
 </head>
 <body data-theme="light" data-surface="export-document">

package/src/client/app/index.html

@@ -5,8 +5,18 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="description" content="CollabMD — collaborative markdown vault. Edit markdown files together in realtime.">
   <title>CollabMD — Collaborative Markdown Vault</title>
-  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect x='2' y='4' width='18' height='24' rx='3' fill='%23818cf8'/><rect x='12' y='4' width='18' height='24' rx='3' fill='%234f46e5' opacity='0.8'/><path d='M18 12h6M18 16h6M18 20h4' stroke='white' stroke-width='1.5' stroke-linecap='round'/></svg>">
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='4' width='17' height='24' rx='3' stroke='%232563eb' stroke-width='2'/><rect x='12' y='4' width='17' height='24' rx='3' fill='%232563eb'/><path d='M17 12h7m-7 4h7m-7 4h4' stroke='white' stroke-width='1.5'/></svg>">
   <script>
+    let preferredTheme;
+    try {
+      preferredTheme = window.localStorage.getItem('collabmd-theme');
+    } catch {
+      // Storage may be unavailable in restricted browser contexts.
+    }
+    document.documentElement.dataset.theme = ['light', 'dark'].includes(preferredTheme)
+      ? preferredTheme
+      : window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    document.documentElement.dataset.workspaceLoading = 'true';
     if (
       window.location.hash.includes('file=')
       || window.location.hash.includes('git-diff=')
@@ -18,6 +28,7 @@
   <script vite-ignore defer src="./app-config.js"></script>
 </head>
 <body>
+    <div class="workspace-loading" id="workspaceLoading" role="status">Opening workspace…</div>
 
     <a href="#editorContainer" class="sr-only skip-link" id="skipToEditor">Skip to editor</a>
 
@@ -25,11 +36,10 @@
       <aside id="sidebar" class="sidebar">
         <div class="sidebar-header">
           <div class="sidebar-brand">
-            <svg width="20" height="20" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
-              <rect x="6" y="8" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.12"></rect>
-              <rect x="22" y="10" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.25"></rect>
-              <path d="M14 20l4 10 1.5-4 4-1.5L14 20z" fill="var(--color-primary)" opacity="0.7"></path>
-              <path d="M38 28l-4-10-1.5 4-4 1.5L38 28z" fill="var(--color-primary)"></path>
+            <svg width="20" height="20" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+              <rect x="3" y="4" width="17" height="24" rx="3" stroke="var(--color-primary)" stroke-width="2"></rect>
+              <rect x="12" y="4" width="17" height="24" rx="3" fill="var(--color-primary)"></rect>
+              <path d="M17 12h7m-7 4h7m-7 4h4" stroke="var(--color-primary-contrast)" stroke-width="1.5"></path>
             </svg>
             <span class="sidebar-title">CollabMD</span>
           </div>
@@ -388,6 +398,15 @@
                 <span class="ui-toolbar-button-label">Search files</span>
               </button>
 
+              <button type="button" class="ui-button ui-button--ghost ui-button--toolbar ui-button--toggle" id="toggleCursorNamesBtn" aria-label="Hide cursor names" aria-pressed="true" title="Hide cursor names">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                  <circle cx="12" cy="8" r="4"></circle>
+                  <path d="M5 21v-2a7 7 0 0 1 14 0v2"></path>
+                </svg>
+                <span class="ui-toolbar-button-label">Cursor names</span>
+                <span class="ui-pill-badge ui-pill-badge--muted toolbar-toggle-state" id="cursorNamesToggleLabel">On</span>
+              </button>
+
               <button class="ui-button ui-button--ghost ui-button--toolbar ui-button--toggle toolbar-vim-button" id="toggleVimModeBtn" aria-label="Enable Vim keybindings" aria-pressed="false" title="Enable Vim keybindings">
                 <span class="toolbar-vim-icon" aria-hidden="true">
                   <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
@@ -397,7 +416,7 @@
                   </svg>
                 </span>
                 <span class="ui-toolbar-button-label">Vim</span>
-                <span class="ui-pill-badge ui-pill-badge--muted toolbar-vim-state" id="vimModeToggleLabel">Off</span>
+                <span class="ui-pill-badge ui-pill-badge--muted toolbar-toggle-state" id="vimModeToggleLabel">Off</span>
               </button>
 
               <details class="toolbar-overflow-group hidden" id="exportMenuGroup">
@@ -455,11 +474,10 @@
         <div id="emptyState" class="empty-state">
           <div class="empty-state-content">
             <div class="empty-state-logo" aria-hidden="true">
-              <svg width="48" height="48" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <rect x="6" y="8" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.12"></rect>
-                <rect x="22" y="10" width="28" height="38" rx="4" stroke="var(--color-primary)" stroke-width="2" fill="var(--color-primary)" fill-opacity="0.25"></rect>
-                <path d="M14 20l4 10 1.5-4 4-1.5L14 20z" fill="var(--color-primary)" opacity="0.7"></path>
-                <path d="M38 28l-4-10-1.5 4-4 1.5L38 28z" fill="var(--color-primary)"></path>
+              <svg width="48" height="48" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+                <rect x="3" y="4" width="17" height="24" rx="3" stroke="var(--color-primary)" stroke-width="2"></rect>
+                <rect x="12" y="4" width="17" height="24" rx="3" fill="var(--color-primary)"></rect>
+                <path d="M17 12h7m-7 4h7m-7 4h4" stroke="var(--color-primary-contrast)" stroke-width="1.5"></path>
               </svg>
             </div>
             <h2 class="empty-state-title">Welcome to CollabMD</h2>

package/src/client/app/main-entry.js

@@ -1,17 +1,43 @@
 import { CollabMdAppShell } from '../bootstrap/collabmd-app-shell.js';
 import { ensureClientAuthenticated } from '../infrastructure/auth-client.js';
+import { getRuntimeConfig, initializeWorkspaceUrl, setActiveVaultId } from '../infrastructure/runtime-config.js';
+import { renderVaultDashboard } from '../presentation/vault-dashboard.js';
 import '../styles/style.css';
 
 async function start() {
   await ensureClientAuthenticated();
+  const config = getRuntimeConfig();
+  const url = new URL(window.location.href);
+  if (config.vaultDashboard && config.vaults.length > 1
+    && !url.searchParams.has('vault') && !url.searchParams.has('file') && !url.hash) {
+    renderVaultDashboard({
+      container: document.getElementById('workspaceLoading'),
+      vaults: config.vaults,
+      getVaultUrl: (vaultId) => {
+        const target = new URL(url);
+        target.searchParams.set('vault', vaultId);
+        return target.toString();
+      },
+      onSelect: setActiveVaultId,
+    });
+    return;
+  }
+  initializeWorkspaceUrl();
   const app = new CollabMdAppShell();
   await app.initialize();
+  delete document.documentElement.dataset.workspaceLoading;
+  document.getElementById('workspaceLoading')?.remove();
+}
+
+function startWorkspace() {
+  void start().catch(() => {
+    const status = document.getElementById('workspaceLoading');
+    if (status) status.textContent = 'Unable to open the workspace. Reload to try again.';
+  });
 }
 
 if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', () => {
-    void start();
-  }, { once: true });
+  document.addEventListener('DOMContentLoaded', startWorkspace, { once: true });
 } else {
-  void start();
+  startWorkspace();
 }

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

@@ -66,6 +66,7 @@ async function initialize() {
   this.initializePreviewLayoutObserver();
   this.syncIdentityManagementUi();
   this.syncCurrentUserName();
+  this.syncCursorNamesToggle();
   this.syncWrapToggle();
   this.syncVimModeToggle();
   this.syncToolbarOverflowVisibility?.();
@@ -351,6 +352,12 @@ function bindEvents() {
     this.toggleLineWrapping();
   });
 
+  this.elements.toggleCursorNamesButton?.addEventListener('click', () => {
+    const visible = this.elements.editorContainer.classList.contains('hide-cursor-names');
+    this.preferences.setCursorNamesVisible(visible);
+    this.syncCursorNamesToggle(visible);
+  });
+
   this.elements.toggleVimModeButton?.addEventListener('click', () => {
     this.toggleVimMode();
   });
@@ -367,7 +374,7 @@ function bindEvents() {
 
   this.elements.toolbarOverflowMenu?.addEventListener('click', (event) => {
     const button = event.target instanceof Element ? event.target.closest('button') : null;
-    if (button && button !== this.elements.toggleVimModeButton) {
+    if (button && button !== this.elements.toggleVimModeButton && button !== this.elements.toggleCursorNamesButton) {
       this.closeToolbarOverflowMenu();
     }
   });
@@ -1043,6 +1050,17 @@ function syncVimModeToggle(state) {
   }
 }
 
+/** @this {UiShellContext} */
+function syncCursorNamesToggle(visible = this.preferences.getCursorNamesVisible()) {
+  this.elements.editorContainer?.classList.toggle('hide-cursor-names', !visible);
+  const label = this.elements.cursorNamesToggleLabel;
+  if (label) label.textContent = visible ? 'On' : 'Off';
+  const button = this.elements.toggleCursorNamesButton;
+  button?.setAttribute('aria-pressed', String(visible));
+  button?.setAttribute('aria-label', `${visible ? 'Hide' : 'Show'} cursor names`);
+  button?.setAttribute('title', `${visible ? 'Hide' : 'Show'} cursor names`);
+}
+
 /** @this {UiShellContext} */
 function syncWrapToggle(state) {
   const enabled = state ?? this.session?.isLineWrappingEnabled() ?? this.getStoredLineWrapping();
@@ -1140,6 +1158,7 @@ export const uiFeatureShellMethods = {
   syncVisualViewportBounds,
   syncToolbarOverflowVisibility,
   syncVimModeToggle,
+  syncCursorNamesToggle,
   syncWrapToggle,
   toggleLineWrapping,
   unfoldPreviewHeading,

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

@@ -81,6 +81,8 @@ export function bindAppShellElements(doc = document) {
     toggleVimModeButton: doc.getElementById('toggleVimModeBtn'),
     userAvatars: doc.getElementById('userAvatars'),
     userCount: doc.getElementById('userCount'),
+    cursorNamesToggleLabel: doc.getElementById('cursorNamesToggleLabel'),
+    toggleCursorNamesButton: doc.getElementById('toggleCursorNamesBtn'),
     wrapToggleLabel: doc.getElementById('wrapToggleLabel'),
     vimModeToggleLabel: doc.getElementById('vimModeToggleLabel'),
     activeFileName: doc.getElementById('activeFileName'),

package/src/client/application/diagram-preview-hydrator.js

@@ -409,6 +409,13 @@ export class DiagramPreviewHydrator {
       return;
     }
 
+    if (this.observer && typeof IntersectionObserver !== 'undefined') {
+      Array.from(previewElement.querySelectorAll(this.shellSelector)).forEach((shell) => {
+        this.observer.observe(shell);
+      });
+      return;
+    }
+
     const margin = this.renderer.isLargeDocument ? 180 : 420;
     Array.from(previewElement.querySelectorAll(this.shellSelector)).forEach((shell) => {
       if (this.isNearViewportFn(shell, previewContainer, margin)) {