@filipc77/cowrite 0.6.10 → 0.6.12

package/dist/bin/cowrite.js

@@ -1104,7 +1104,7 @@ function createPreviewServer(store, projectDir, port, initialFile) {
 // bin/cowrite.ts
 import updateNotifier from "update-notifier";
 import "module";
-var version = true ? "0.6.10" : createRequire(import.meta.url)("../package.json").version;
+var version = true ? "0.6.12" : createRequire(import.meta.url)("../package.json").version;
 var USAGE = `
 cowrite \u2014 Live commenting plugin for coding agent sessions
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@filipc77/cowrite",
-  "version": "0.6.10",
+  "version": "0.6.12",
   "description": "Live commenting and inline editing plugin for coding agent sessions",
   "type": "module",
   "bin": {

package/ui/index.html

@@ -91,7 +91,8 @@
       <button data-format="bold" title="Bold (Cmd+B)"><strong>B</strong></button>
       <button data-format="italic" title="Italic (Cmd+I)"><em>I</em></button>
       <button data-format="strikethrough" title="Strikethrough (Cmd+Shift+S)"><s>S</s></button>
-      <button data-format="code" title="Code (Cmd+E)"><code>&lt;/&gt;</code></button>
+      <button data-format="code" title="Inline code (Cmd+E)"><code>&lt;/&gt;</code></button>
+      <button data-format="codeBlock" title="Code block"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><polyline points="8 8 6 10 8 12"/><polyline points="16 8 18 10 16 12"/><line x1="11" y1="7" x2="13" y2="13"/></svg></button>
       <button data-format="link" title="Link (Cmd+K)"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg></button>
       <button data-format="blockquote" title="Quote"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V21"/><path d="M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3"/></svg></button>
       <button data-format="bulletList" title="Bullet list"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/></svg></button>

package/ui/modules/comment-highlight.js

@@ -234,14 +234,33 @@ function wrapRange(textNodes, start, end, comment) {
 
 /**
  * Initialize comment highlight click behavior.
+ * Clicking a highlight scrolls to & highlights the matching sidebar card.
  */
 export function initCommentHighlights() {
   const commentListEl = $('#commentList');
+
   document.addEventListener('mousedown', (e) => {
-    if (!e.target.closest('.comment-highlight')) {
+    const highlight = e.target.closest('.comment-highlight');
+
+    // Clear active state when clicking outside highlights
+    if (!highlight) {
       for (const card of commentListEl.querySelectorAll('.comment-card.active')) {
         card.classList.remove('active');
       }
+      return;
+    }
+
+    // Scroll sidebar to the matching comment card
+    const commentId = highlight.dataset?.commentId;
+    if (!commentId) return;
+    const card = commentListEl.querySelector(`.comment-card[data-id="${commentId}"]`);
+    if (!card) return;
+
+    // Clear previous active states
+    for (const c of commentListEl.querySelectorAll('.comment-card.active')) {
+      c.classList.remove('active');
     }
+    card.classList.add('active');
+    card.scrollIntoView({ behavior: 'smooth', block: 'center' });
   });
 }

package/ui/modules/comment-sidebar.js

@@ -124,10 +124,18 @@ export function renderComments() {
     `;
   }).join("");
 
-  // Click to scroll to highlight
+  // Click to scroll to highlight and mark card active
   for (const card of commentListEl.querySelectorAll(".comment-card")) {
     card.addEventListener("click", (e) => {
       if (e.target.tagName === "BUTTON" || e.target.tagName === "TEXTAREA") return;
+
+      // Mark this card active
+      for (const c of commentListEl.querySelectorAll(".comment-card.active")) {
+        c.classList.remove("active");
+      }
+      card.classList.add("active");
+
+      // Scroll to and flash the in-content highlight
       const id = card.dataset.id;
       const highlight = fileContentEl.querySelector(`[data-comment-id="${id}"]`);
       if (highlight) {

package/ui/modules/toolbar.js

@@ -105,6 +105,7 @@ function applyTipTapFormat(editor, format) {
     case 'italic': editor.chain().focus().toggleItalic().run(); break;
     case 'strikethrough': editor.chain().focus().toggleStrike().run(); break;
     case 'code': editor.chain().focus().toggleCode().run(); break;
+    case 'codeBlock': editor.chain().focus().toggleCodeBlock().run(); break;
     case 'link': {
       const url = prompt('Link URL:', 'https://');
       if (url) editor.chain().focus().setLink({ href: url }).run();
@@ -153,6 +154,12 @@ function applyMarkdownFormat(format) {
     return;
   }
 
+  if (format === "codeBlock") {
+    send({ type: "edit_apply", offset, length, newText: "```\n" + selectedText + "\n```" });
+    hideTrigger();
+    return;
+  }
+
   const { prefix, suffix } = FORMAT_SYNTAX[format];
 
   // Toggle detection: check if selection is already wrapped