npm - collabmd - Versions diffs - 0.1.47 → 0.1.48 - Mend

collabmd 0.1.47 → 0.1.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (100) hide show

package/dist/client/index.html CHANGED Viewed

@@ -15,16 +15,16 @@
       document.documentElement.setAttribute('data-initial-file-requested', 'true');
     }
   </script>
-  <script type="module" crossorigin src="./assets/index-Z5sI0Bj-.js"></script>
+  <script type="module" crossorigin src="./assets/index-DG3N2Ps-.js"></script>
   <link rel="modulepreload" crossorigin href="./assets/modulepreload-polyfill-P2Xu9kJm.js">
   <link rel="modulepreload" crossorigin href="./assets/preload-helper-HclGiUj8.js">
   <link rel="modulepreload" crossorigin href="./assets/base-BYODPHdS.js">
   <link rel="stylesheet" crossorigin href="./assets/base-CaIEJUF9.css">
-  <link rel="stylesheet" crossorigin href="./assets/index-BIpgxyGZ.css">
+  <link rel="stylesheet" crossorigin href="./assets/index-CSNIMyOP.css">
 </head>
 <body>
-    <a href="#editorContainer" class="sr-only skip-link">Skip to editor</a>
+    <a href="#editorContainer" class="sr-only skip-link" id="skipToEditor">Skip to editor</a>
     <div class="app-shell">
       <aside id="sidebar" class="sidebar">
@@ -216,6 +216,16 @@
           </div>
           <div class="toolbar-right">
+            <button class="ui-button ui-button--ghost ui-button--compact hidden" id="reviewFileChangesBtn" type="button" aria-label="Review changes to this file" title="Review changes to this file">
+              <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">
+                <line x1="6" y1="3" x2="6" y2="15"></line>
+                <circle cx="18" cy="6" r="3"></circle>
+                <circle cx="6" cy="18" r="3"></circle>
+                <path d="M18 9a9 9 0 0 1-9 9"></path>
+              </svg>
+              <span class="ui-toolbar-button-label">Review changes</span>
+            </button>
             <button class="ui-button ui-button--ghost ui-button--toolbar mobile-view-toggle" id="mobileViewToggle" aria-label="Toggle editor/preview" title="Toggle view">
               <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
@@ -227,9 +237,13 @@
             <div class="toolbar-status-cluster" aria-label="Workspace status">
               <span class="ui-pill-badge ui-pill-badge--accent hidden toolbar-badge" id="toolbarDiffBadge">Diff</span>
               <span class="ui-pill-badge ui-pill-badge--muted hidden toolbar-badge" id="gitOperationStatus" aria-live="polite" aria-atomic="true"></span>
+            </div>
+            <div class="toolbar-presence-cluster">
+              <div class="user-avatars" id="userAvatars"></div>
               <button
                 type="button"
-                class="ui-pill-badge ui-pill-badge--muted toolbar-badge toolbar-badge-button"
+                class="ui-pill-badge ui-pill-badge--muted toolbar-badge toolbar-badge-button toolbar-presence-count"
                 id="userCount"
                 aria-controls="presencePanel"
                 aria-expanded="false"
@@ -237,8 +251,6 @@
               ></button>
             </div>
-            <div class="user-avatars toolbar-presence-cluster" id="userAvatars"></div>
             <section class="collaboration-popover presence-panel hidden" id="presencePanel" aria-label="Online users" aria-hidden="true">
               <div class="presence-panel-header">
                 <div>
@@ -483,6 +495,14 @@
                     </svg>
                     <span class="ui-action-label">Comment</span>
                   </button>
+                  <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle" id="editorFormatBtn" aria-label="Format document" title="Format document">
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <path d="M4 7h10"></path>
+                      <path d="M4 12h16"></path>
+                      <path d="M4 17h10"></path>
+                    </svg>
+                    <span class="ui-action-label">Format</span>
+                  </button>
                   <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle" id="toggleWrapBtn" aria-label="Disable line wrap" title="Disable line wrap">
                     <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                       <path d="M3 6h14a4 4 0 1 1 0 8H9"></path>
@@ -513,6 +533,7 @@
               <div class="pane-header">
                 <span class="pane-label">Preview</span>
                 <div class="pane-header-actions">
+                  <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle hidden" id="htmlPreviewMaximize" aria-label="Maximize HTML preview" title="Maximize HTML preview"></button>
                   <div id="backlinksHeaderPanel" class="backlinks-panel backlinks-panel-header hidden" data-backlinks-variant="header">
                     <button type="button" class="backlinks-header" aria-expanded="false">
                       <svg class="backlinks-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
@@ -619,16 +640,10 @@
                 </button>
                 <div class="diff-toolbar-actions-group diff-toolbar-actions-group-git" id="diffGitActionsGroup" role="group" aria-label="Git file actions">
                   <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface" id="diffPrimaryActionBtn" type="button" disabled>
-                    Stage
+                    Include in commit
                   </button>
                   <button class="ui-button ui-button--primary ui-button--action ui-button--wide" id="diffCommitBtn" type="button" disabled>
-                    Commit Staged
-                  </button>
-                </div>
-                <span class="diff-toolbar-actions-divider" id="diffToolbarDivider" aria-hidden="true"></span>
-                <div class="diff-toolbar-actions-group" id="diffEditorActionsGroup" role="group" aria-label="Navigation actions">
-                  <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface diff-open-editor-btn" id="diffOpenEditorBtn" type="button" disabled>
-                    Open in Editor
+                    Commit included files
                   </button>
                 </div>
               </div>
@@ -646,6 +661,12 @@
                 <button class="ui-segmented-btn active view-btn diff-mode-btn" data-diff-mode="unified" type="button">Unified</button>
                 <button class="ui-segmented-btn view-btn diff-mode-btn" data-diff-mode="split" type="button">Split</button>
               </div>
+              <span class="diff-toolbar-actions-divider" id="diffToolbarDivider" aria-hidden="true"></span>
+              <div class="diff-toolbar-actions-group" id="diffEditorActionsGroup" role="group" aria-label="Navigation actions">
+                <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface diff-open-editor-btn" id="diffOpenEditorBtn" type="button" disabled>
+                  Open in editor
+                </button>
+              </div>
             </div>
           </div>
           <div class="diff-scroll" id="diffScroll">
@@ -694,16 +715,17 @@
     <dialog class="app-dialog" id="gitCommitDialog">
       <form class="app-dialog-form" id="gitCommitForm" method="dialog">
         <div class="app-dialog-header">
-          <h2 class="app-dialog-title" id="gitCommitTitle">Commit staged changes</h2>
-          <p class="app-dialog-copy" id="gitCommitCopy">All staged changes will be included.</p>
+          <h2 class="app-dialog-title" id="gitCommitTitle">Commit included files</h2>
+          <p class="app-dialog-copy" id="gitCommitCopy">All included changes will be committed.</p>
         </div>
         <label class="app-dialog-field" for="gitCommitInput">
-          <span class="app-dialog-label">Commit message</span>
-          <input type="text" class="ui-input" id="gitCommitInput" name="gitCommitMessage" autocomplete="off" spellcheck="true" required>
+          <span class="app-dialog-label">What changed?</span>
+          <input type="text" class="ui-input" id="gitCommitInput" name="gitCommitMessage" autocomplete="off" spellcheck="true" aria-describedby="gitCommitHint" required>
+          <span class="app-dialog-hint" id="gitCommitHint">This becomes the Git commit message.</span>
         </label>
         <div class="app-dialog-actions">
           <button type="button" class="ui-button ui-button--secondary" id="gitCommitCancel">Cancel</button>
-          <button type="submit" class="ui-button ui-button--primary" id="gitCommitSubmit">Commit staged changes</button>
+          <button type="submit" class="ui-button ui-button--primary" id="gitCommitSubmit">Commit included files</button>
         </div>
       </form>
     </dialog>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "collabmd",
-  "version": "0.1.47",
+  "version": "0.1.48",
   "type": "module",
   "description": "Collaborative markdown vault — like Obsidian, but online. Serve any directory of markdown files for realtime collaborative editing.",
   "repository": {
@@ -69,6 +69,7 @@
   "dependencies": {
     "@codemirror/autocomplete": "^6.20.3",
     "@codemirror/commands": "^6.11.0",
+    "@codemirror/lang-html": "^6.4.11",
     "@codemirror/lang-markdown": "^6.5.2",
     "@codemirror/lang-yaml": "^6.1.3",
     "@codemirror/language": "^6.12.4",
@@ -87,7 +88,9 @@
     "lib0": "^0.2.117",
     "markdown-it": "^15.0.0",
     "mermaid": "^11.17.0",
+    "mermaid-formatter": "^0.3.0",
     "openid-client": "^6.8.7",
+    "prettier": "^3.9.6",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
     "sharp": "^0.35.3",

package/src/client/app/index.html CHANGED Viewed

@@ -18,7 +18,7 @@
 </head>
 <body>
-    <a href="#editorContainer" class="sr-only skip-link">Skip to editor</a>
+    <a href="#editorContainer" class="sr-only skip-link" id="skipToEditor">Skip to editor</a>
     <div class="app-shell">
       <aside id="sidebar" class="sidebar">
@@ -210,6 +210,16 @@
           </div>
           <div class="toolbar-right">
+            <button class="ui-button ui-button--ghost ui-button--compact hidden" id="reviewFileChangesBtn" type="button" aria-label="Review changes to this file" title="Review changes to this file">
+              <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">
+                <line x1="6" y1="3" x2="6" y2="15"></line>
+                <circle cx="18" cy="6" r="3"></circle>
+                <circle cx="6" cy="18" r="3"></circle>
+                <path d="M18 9a9 9 0 0 1-9 9"></path>
+              </svg>
+              <span class="ui-toolbar-button-label">Review changes</span>
+            </button>
             <button class="ui-button ui-button--ghost ui-button--toolbar mobile-view-toggle" id="mobileViewToggle" aria-label="Toggle editor/preview" title="Toggle view">
               <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
@@ -221,9 +231,13 @@
             <div class="toolbar-status-cluster" aria-label="Workspace status">
               <span class="ui-pill-badge ui-pill-badge--accent hidden toolbar-badge" id="toolbarDiffBadge">Diff</span>
               <span class="ui-pill-badge ui-pill-badge--muted hidden toolbar-badge" id="gitOperationStatus" aria-live="polite" aria-atomic="true"></span>
+            </div>
+            <div class="toolbar-presence-cluster">
+              <div class="user-avatars" id="userAvatars"></div>
               <button
                 type="button"
-                class="ui-pill-badge ui-pill-badge--muted toolbar-badge toolbar-badge-button"
+                class="ui-pill-badge ui-pill-badge--muted toolbar-badge toolbar-badge-button toolbar-presence-count"
                 id="userCount"
                 aria-controls="presencePanel"
                 aria-expanded="false"
@@ -231,8 +245,6 @@
               ></button>
             </div>
-            <div class="user-avatars toolbar-presence-cluster" id="userAvatars"></div>
             <section class="collaboration-popover presence-panel hidden" id="presencePanel" aria-label="Online users" aria-hidden="true">
               <div class="presence-panel-header">
                 <div>
@@ -477,6 +489,14 @@
                     </svg>
                     <span class="ui-action-label">Comment</span>
                   </button>
+                  <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle" id="editorFormatBtn" aria-label="Format document" title="Format document">
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <path d="M4 7h10"></path>
+                      <path d="M4 12h16"></path>
+                      <path d="M4 17h10"></path>
+                    </svg>
+                    <span class="ui-action-label">Format</span>
+                  </button>
                   <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle" id="toggleWrapBtn" aria-label="Disable line wrap" title="Disable line wrap">
                     <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                       <path d="M3 6h14a4 4 0 1 1 0 8H9"></path>
@@ -507,6 +527,7 @@
               <div class="pane-header">
                 <span class="pane-label">Preview</span>
                 <div class="pane-header-actions">
+                  <button class="ui-button ui-button--ghost ui-button--compact ui-button--toggle hidden" id="htmlPreviewMaximize" aria-label="Maximize HTML preview" title="Maximize HTML preview"></button>
                   <div id="backlinksHeaderPanel" class="backlinks-panel backlinks-panel-header hidden" data-backlinks-variant="header">
                     <button type="button" class="backlinks-header" aria-expanded="false">
                       <svg class="backlinks-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
@@ -613,16 +634,10 @@
                 </button>
                 <div class="diff-toolbar-actions-group diff-toolbar-actions-group-git" id="diffGitActionsGroup" role="group" aria-label="Git file actions">
                   <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface" id="diffPrimaryActionBtn" type="button" disabled>
-                    Stage
+                    Include in commit
                   </button>
                   <button class="ui-button ui-button--primary ui-button--action ui-button--wide" id="diffCommitBtn" type="button" disabled>
-                    Commit Staged
-                  </button>
-                </div>
-                <span class="diff-toolbar-actions-divider" id="diffToolbarDivider" aria-hidden="true"></span>
-                <div class="diff-toolbar-actions-group" id="diffEditorActionsGroup" role="group" aria-label="Navigation actions">
-                  <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface diff-open-editor-btn" id="diffOpenEditorBtn" type="button" disabled>
-                    Open in Editor
+                    Commit included files
                   </button>
                 </div>
               </div>
@@ -640,6 +655,12 @@
                 <button class="ui-segmented-btn active view-btn diff-mode-btn" data-diff-mode="unified" type="button">Unified</button>
                 <button class="ui-segmented-btn view-btn diff-mode-btn" data-diff-mode="split" type="button">Split</button>
               </div>
+              <span class="diff-toolbar-actions-divider" id="diffToolbarDivider" aria-hidden="true"></span>
+              <div class="diff-toolbar-actions-group" id="diffEditorActionsGroup" role="group" aria-label="Navigation actions">
+                <button class="ui-button ui-button--secondary ui-button--action ui-button--wide ui-button--surface diff-open-editor-btn" id="diffOpenEditorBtn" type="button" disabled>
+                  Open in editor
+                </button>
+              </div>
             </div>
           </div>
           <div class="diff-scroll" id="diffScroll">
@@ -688,16 +709,17 @@
     <dialog class="app-dialog" id="gitCommitDialog">
       <form class="app-dialog-form" id="gitCommitForm" method="dialog">
         <div class="app-dialog-header">
-          <h2 class="app-dialog-title" id="gitCommitTitle">Commit staged changes</h2>
-          <p class="app-dialog-copy" id="gitCommitCopy">All staged changes will be included.</p>
+          <h2 class="app-dialog-title" id="gitCommitTitle">Commit included files</h2>
+          <p class="app-dialog-copy" id="gitCommitCopy">All included changes will be committed.</p>
         </div>
         <label class="app-dialog-field" for="gitCommitInput">
-          <span class="app-dialog-label">Commit message</span>
-          <input type="text" class="ui-input" id="gitCommitInput" name="gitCommitMessage" autocomplete="off" spellcheck="true" required>
+          <span class="app-dialog-label">What changed?</span>
+          <input type="text" class="ui-input" id="gitCommitInput" name="gitCommitMessage" autocomplete="off" spellcheck="true" aria-describedby="gitCommitHint" required>
+          <span class="app-dialog-hint" id="gitCommitHint">This becomes the Git commit message.</span>
         </label>
         <div class="app-dialog-actions">
           <button type="button" class="ui-button ui-button--secondary" id="gitCommitCancel">Cancel</button>
-          <button type="submit" class="ui-button ui-button--primary" id="gitCommitSubmit">Commit staged changes</button>
+          <button type="submit" class="ui-button ui-button--primary" id="gitCommitSubmit">Commit included files</button>
         </div>
       </form>
     </dialog>

package/src/client/application/app-shell/export-feature.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { isMarkdownFilePath } from '../../../domain/file-kind.js';
-import { exportDocument, initializeExportBridge } from '../../export/export-host.js';
+import { exportDirectory, exportDocument, initializeExportBridge } from '../../export/export-host.js';
 export const exportFeature = {
   initializeExportBridge() {
@@ -15,6 +15,22 @@ export const exportFeature = {
     this._exportBridgeInitialized = true;
   },
+  async handleDirectoryExportRequest(directoryPath, format) {
+    try {
+      await exportDirectory({
+        currentFilePath: this.currentFilePath,
+        currentMarkdownText: this.session?.getText?.() ?? '',
+        directoryPath,
+        fileList: this.fileExplorer?.flatDocumentFiles ?? [],
+        format,
+      });
+      return true;
+    } catch (error) {
+      this.toastController?.show(error instanceof Error ? error.message : 'Failed to start folder export');
+      return false;
+    }
+  },
   async handleExportRequest(format) {
     const filePath = String(this.currentFilePath ?? '').trim();
     if (!isMarkdownFilePath(filePath)) {

package/src/client/application/app-shell/git-feature.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { commitButtonLabel } from '../../domain/git-labels.js';
 import { createWorkspaceChange } from '../../../domain/workspace-change.js';
 export const gitFeature = {
@@ -89,6 +90,7 @@ export const gitFeature = {
     this.elements.gitSidebarTab?.classList.toggle('has-changes', hasChanges);
     this.gitDiffView.setRepoStatus(this.gitRepoAvailable ? status : null);
+    this.syncReviewFileChangesButton();
     if (!this.gitRepoAvailable && this.activeSidebarTab === 'git') {
       this.syncFileHistoryButton({ mode: this.navigation.getHashRoute().type === 'git-file-preview' ? 'history-preview' : 'editor' });
@@ -146,6 +148,21 @@ export const gitFeature = {
     button.title = 'View file history';
   },
+  syncReviewFileChangesButton({
+    filePath = this.currentFilePath,
+    mode = 'editor',
+  } = {}) {
+    const button = this.elements.reviewFileChangesButton;
+    if (!button) {
+      return;
+    }
+    button.classList.toggle(
+      'hidden',
+      !this.gitRepoAvailable || mode !== 'editor' || !filePath,
+    );
+  },
   syncMainChrome({ badgeLabel = '', mode, title = null } = {}) {
     const isSpecialMode = mode === 'diff' || mode === 'history' || mode === 'history-preview';
     this.elements.toolbarViewToggle?.classList.toggle('hidden', isSpecialMode);
@@ -161,6 +178,7 @@ export const gitFeature = {
     }
     this.syncFileHistoryButton({ filePath: this.currentFilePath, mode });
+    this.syncReviewFileChangesButton({ filePath: this.currentFilePath, mode });
   },
   async showGitDiff({ filePath = null, scope = 'all' } = {}) {
@@ -635,17 +653,18 @@ export const gitFeature = {
       return;
     }
+    const includedFileCount = Number(this.gitPanel.status?.summary?.staged || 0);
+    const commitLabel = commitButtonLabel(includedFileCount);
     if (this.elements.gitCommitTitle) {
-      this.elements.gitCommitTitle.textContent = 'Commit staged changes';
+      this.elements.gitCommitTitle.textContent = commitLabel;
     }
     if (this.elements.gitCommitCopy) {
-      const stagedCount = Number(this.gitPanel.status?.summary?.staged || 0);
-      this.elements.gitCommitCopy.textContent = stagedCount > 0
-        ? `${stagedCount} staged file${stagedCount === 1 ? '' : 's'} will be included.`
-        : 'All staged changes will be included.';
+      this.elements.gitCommitCopy.textContent = includedFileCount > 0
+        ? `This commit will include ${includedFileCount} file${includedFileCount === 1 ? '' : 's'}.`
+        : 'All included changes will be committed.';
     }
     if (this.elements.gitCommitSubmit) {
-      this.elements.gitCommitSubmit.textContent = 'Commit staged changes';
+      this.elements.gitCommitSubmit.textContent = commitLabel;
     }
     input.value = '';
@@ -673,7 +692,7 @@ export const gitFeature = {
     }
     if (!message) {
       input.focus();
-      this.toastController.show('Commit message cannot be empty');
+      this.toastController.show('Describe what changed before committing');
       return;
     }
@@ -693,10 +712,10 @@ export const gitFeature = {
       });
       dialog.close();
     } catch (error) {
-      this.toastController.show(error.message || 'Failed to commit staged changes');
+      this.toastController.show(error.message || 'Failed to commit included changes');
     } finally {
       if (submit) {
-        submit.textContent = 'Commit staged changes';
+        submit.textContent = 'Commit included files';
       }
       submit?.toggleAttribute('disabled', false);
     }

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

@@ -44,6 +44,7 @@ function openDisplayNameDialog({ mode = 'edit' } = {}) {
   if (!dialog || !input) return;
   const isOnboarding = mode === 'onboarding';
+  this._displayNameDialogMode = mode;
   if (title) {
     title.textContent = isOnboarding ? 'Choose your display name' : 'Update display name';
   }
@@ -88,6 +89,17 @@ function promptForDisplayNameIfNeeded() {
   });
 }
+/** @this {UiIdentityContext} */
+function handleDisplayNameCancel() {
+  if (this._displayNameDialogMode === 'onboarding' && !this.getStoredUserName()) {
+    const guestName = this.getCurrentUserName();
+    if (guestName) {
+      this.preferences.setUserName(guestName);
+    }
+  }
+  this.elements.displayNameDialog?.close();
+}
 /** @this {UiIdentityContext} */
 function handleDisplayNameSubmit() {
   if (this.isIdentityManagedByAuth()) {
@@ -164,6 +176,7 @@ export const uiFeatureIdentityMethods = {
   getCurrentUser,
   getCurrentUserName,
   getStoredUserName,
+  handleDisplayNameCancel,
   handleDisplayNameSubmit,
   isIdentityManagedByAuth,
   openDisplayNameDialog,