clay-server 5.2.0-beta.3 → 5.2.0-beta.5

package/lib/public/modules/sticky-note-markdown.js

@@ -6,7 +6,32 @@ export function getTitle(text) {
   return idx === -1 ? text : text.substring(0, idx);
 }
 
-function formatInline(text) {
+function checklistFence(line) {
+  var match = line.match(/^\s*(\x60{3,}|~{3,})/);
+  return match ? match[1].charAt(0) : null;
+}
+
+export function getChecklistItems(text) {
+  var lines = (text || "").split("\n").slice(1);
+  var items = [];
+  var fence = null;
+  var occurrences = Object.create(null);
+  for (var i = 0; i < lines.length; i++) {
+    var line = lines[i];
+    var nextFence = checklistFence(line);
+    if (nextFence) {
+      fence = fence === nextFence ? null : (fence || nextFence);
+      continue;
+    }
+    if (fence || !line.trim() || /^\s*#{1,6}\s/.test(line)) continue;
+    var occurrence = occurrences[line] || 0;
+    occurrences[line] = occurrence + 1;
+    items.push({ index: i, text: line, key: line + "\u0000" + occurrence });
+  }
+  return items;
+}
+
+function formatInline(text, preserveChecks) {
   var escaped = text
     .replace(/&/g, "&amp;")
     .replace(/</g, "&lt;")
@@ -17,18 +42,59 @@ function formatInline(text) {
     .replace(/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, "<em>$1</em>")
     .replace(/`([^`]+)`/g, "<code>$1</code>")
     .replace(/~~(.+?)~~/g, "<del>$1</del>")
-    .replace(/^(?:-\s*)?\[[xX]\]/gm, '<span class="sn-check checked" role="checkbox" aria-checked="true" tabindex="0" contenteditable="false">✓</span>')
-    .replace(/^(?:-\s*)?\[ \]/gm, '<span class="sn-check" role="checkbox" aria-checked="false" tabindex="0" contenteditable="false">☐</span>')
+    .replace(preserveChecks ? /(?!x)x^/ : /^(?:-\s*)?\[[xX]\]/gm, '<span class="sn-check checked" role="checkbox" aria-checked="true" tabindex="0" contenteditable="false">✓</span>')
+    .replace(preserveChecks ? /(?!x)x^/ : /^(?:-\s*)?\[ \]/gm, '<span class="sn-check" role="checkbox" aria-checked="false" tabindex="0" contenteditable="false">☐</span>')
     .replace(/\n/g, "<br>");
 }
 
-export function renderMiniMarkdown(text) {
+export function renderMiniMarkdown(text, options) {
   if (!text) return "";
+  options = options || {};
   var lines = text.split("\n");
   var title = lines[0];
   var body = lines.slice(1).join("\n");
-  var html = '<div class="sn-title">' + formatInline(title) + "</div>";
-  if (body.trim()) html += formatInline(body);
+  var html = '<div class="sn-title">' + formatInline(title, options.checklistMode) + "</div>";
+  if (body.trim()) {
+    if (options.checklistMode) {
+      var checklistLines = body.split("\n");
+      var checklistHtml = [];
+      var inCode = false;
+      var fenceChar = null;
+      var occurrences = Object.create(null);
+      for (var i = 0; i < checklistLines.length; i++) {
+        var line = checklistLines[i];
+        var lineFence = checklistFence(line);
+        if (lineFence) {
+          fenceChar = fenceChar === lineFence ? null : (fenceChar || lineFence);
+          inCode = !!fenceChar;
+          checklistHtml.push(formatInline(line, true));
+          if (i < checklistLines.length - 1) checklistHtml.push("<br>");
+          continue;
+        }
+        var task = !inCode && line.trim() && !/^\s*#{1,6}\s/.test(line);
+        if (task) {
+          var markerMatch = line.match(/^\s*(?:[-*+]\s+)?\[([ xX])\]\s*(.*)$/);
+          var checked = markerMatch ? markerMatch[1].toLowerCase() === "x" : false;
+          var content = markerMatch ? markerMatch[2] : line;
+          var occurrence = occurrences[line] || 0;
+          occurrences[line] = occurrence + 1;
+          var checklistKey = line + "\u0000" + occurrence;
+          var stored = options.checklistState && options.checklistState[checklistKey];
+          if (stored === undefined && Array.isArray(options.checklistState)) stored = options.checklistState[i];
+          if (stored !== undefined) {
+            checked = stored === true;
+          }
+          checklistHtml.push('<span class="sn-check' + (checked ? ' checked' : '') + '" data-checklist-index="' + i + '" data-checklist-key="' + encodeURIComponent(checklistKey) + '" role="checkbox" aria-checked="' + (checked ? 'true' : 'false') + '" tabindex="0" contenteditable="false">' + (checked ? "✓" : "☐") + "</span>" + formatInline(content));
+        } else {
+          checklistHtml.push(formatInline(line, !!inCode));
+        }
+        if (i < checklistLines.length - 1) checklistHtml.push("<br>");
+      }
+      html += checklistHtml.join("");
+    } else {
+      html += formatInline(body);
+    }
+  }
   return html;
 }
 

package/lib/public/modules/sticky-notes-actions.js

@@ -0,0 +1,30 @@
+import { getNoteUiState, clearNoteTextTimer, setNoteUiState } from './sticky-notes-shared.js';
+import { checklistDraftText } from './sticky-notes-checklist.js';
+import { mutateChecklist } from './sticky-notes-state.js';
+import { confirmSettingsAction } from './server-settings-state.js';
+
+export function requestChecklistMode(id) {
+  var ui = getNoteUiState(id);
+  if (ui.pending.length) return;
+  if (ui.checklistMode) { mutateChecklist(id, { checklistMode: false }); return; }
+  var text = ui.text;
+  var canonical = ui.canonical;
+  function convert() {
+    var current = getNoteUiState(id);
+    if (current.text !== text || current.canonical.text !== canonical.text || current.canonical.updatedAt !== canonical.updatedAt) {
+      setNoteUiState(id, { error: 'The note changed. Review its contents and try again.' }); return;
+    }
+    clearNoteTextTimer(id);
+    mutateChecklist(id, { checklistConvert: true, checklistSource: canonical.text, checklistVersion: canonical.updatedAt });
+  }
+  if (text.trim() || (canonical.text || '').trim()) {
+    confirmSettingsAction('Switching to a checklist will delete all existing contents and completion marks. Continue with an empty checklist?', 'Delete contents and create checklist', convert);
+  } else convert();
+}
+
+export function closeHumanNote(id, fallback) {
+  var ui = getNoteUiState(id, fallback);
+  if (ui.pending.length) { setNoteUiState(id, { error: 'Wait for the current save before closing.' }); return; }
+  clearNoteTextTimer(id);
+  mutateChecklist(id, { humanClose: true, expectedText: ui.canonical.text, expectedVersion: ui.canonical.updatedAt, draftText: ui.checklistMode ? checklistDraftText(ui) : ui.text });
+}

package/lib/public/modules/sticky-notes-browser.js

@@ -11,7 +11,8 @@ import { store } from './store.js';
 import { iconHtml, refreshIcons } from './icons.js';
 import { renderMiniMarkdown, getTitle } from './sticky-note-markdown.js';
 import { enhanceClayLogLinks } from './clay-log-links.js';
-import { send } from './sticky-notes-shared.js';
+import { closeHumanNote } from './sticky-notes-actions.js';
+import { send, getNoteUiState } from './sticky-notes-shared.js';
 import { listNoteData, focusNoteOnCanvas, hideNotes, showNotes } from './sticky-notes.js';
 import { claimRightWorkbench, registerRightWorkbench, releaseRightWorkbench } from './right-workbench.js';
 
@@ -215,7 +216,7 @@ function buildCard(data) {
     action.setAttribute("aria-label", "Close note: " + title.textContent);
     action.addEventListener("click", function (e) {
       e.stopPropagation();
-      send({ type: "note_close", id: data.id });
+      closeHumanNote(data.id, data);
     });
   }
   header.appendChild(action);
@@ -229,6 +230,11 @@ function buildCard(data) {
     enhanceClayLogLinks(body);
   }
   card.appendChild(body);
+  var ui = getNoteUiState(data.id, data);
+  if (ui.error || ui.pending.length) {
+    var status = document.createElement('p'); status.className = 'settings-status'; status.setAttribute('role', 'status');
+    status.textContent = ui.error || 'Saving…'; card.appendChild(status);
+  }
 
   if (closed) {
     var deleteAction = document.createElement("button");
@@ -427,6 +433,7 @@ export function initNotesBrowser() {
     closeNotesBrowser();
   });
   store.subscribe(function (state, previous) {
+    if (state.notesBrowserOpen && state.stickyNoteUiState !== previous.stickyNoteUiState) renderNotesBrowser();
     if (state.connected !== previous.connected || state.myUserId !== previous.myUserId ||
         state.isMultiUserMode !== previous.isMultiUserMode) closeDeleteDialog(true);
     if (state.currentSlug === previous.currentSlug) return;

package/lib/public/modules/sticky-notes-card.js

@@ -17,6 +17,7 @@ import {
   clampSize,
   debouncedUpdate,
 } from './sticky-notes-shared.js';
+import { closeHumanNote } from './sticky-notes-actions.js';
 import { setupTextEdit } from './sticky-notes-editor.js';
 
 var colorPickerEl = null;
@@ -74,7 +75,7 @@ export function renderNote(data) {
   addBtn.innerHTML = iconHtml("plus");
   addBtn.addEventListener("click", function (e) {
     e.stopPropagation();
-    createNote();
+    send({ type: "note_create", x: 60, y: 60, color: "purple", opacity: 0.64 });
   });
   header.appendChild(addBtn);
 
@@ -90,6 +91,21 @@ export function renderNote(data) {
   mdBtn.innerHTML = "<span class='sn-md-label'>MD</span>";
   header.appendChild(mdBtn);
 
+  var checklistBtn = document.createElement("button");
+  checklistBtn.className = "sticky-note-btn sticky-note-checklist-btn";
+  checklistBtn.title = data.checklistMode ? "Show note" : "Show checklist";
+  checklistBtn.setAttribute("aria-label", checklistBtn.title);
+  checklistBtn.setAttribute("aria-pressed", data.checklistMode === true ? "true" : "false");
+  checklistBtn.innerHTML = iconHtml("list-check");
+  if (data.checklistMode) checklistBtn.classList.add("active");
+  header.appendChild(checklistBtn);
+
+  var saveStatus = document.createElement("span");
+  saveStatus.className = "sticky-note-save-status";
+  saveStatus.setAttribute("role", "status");
+  saveStatus.setAttribute("aria-live", "polite");
+  header.appendChild(saveStatus);
+
   var opacityWrap = document.createElement("div");
   opacityWrap.className = "sticky-note-opacity";
   var opacitySlider = document.createElement("input");
@@ -139,11 +155,12 @@ export function renderNote(data) {
   rendered.contentEditable = "true";
   rendered.spellcheck = true;
   if (data.text && data.text.trim()) {
-    rendered.innerHTML = renderMiniMarkdown(data.text);
+    rendered.innerHTML = renderMiniMarkdown(data.text, { checklistMode: data.checklistMode === true, checklistState: data.checklistState || [] });
     enhanceClayLogLinks(rendered);
   } else {
     rendered.classList.add("is-empty");
   }
+  rendered.contentEditable = data.checklistMode === true ? "false" : "true";
   body.appendChild(rendered);
 
   el.appendChild(body);
@@ -156,7 +173,7 @@ export function renderNote(data) {
   // --- Event handlers ---
   setupDrag(el, spacer, data.id);
   setupResize(el, resizeHandle, data.id);
-  setupTextEdit(textarea, rendered, data.id, mdBtn);
+  setupTextEdit(textarea, rendered, data.id, mdBtn, checklistBtn, data);
   setupColorPicker(colorBtn, el, data.id);
   setupMinimize(minBtn, el, data.id);
   setupClose(closeBtn, el, data.id);
@@ -336,14 +353,13 @@ function setupMinimize(btn, noteEl, noteId) {
 
 // --- Close note ---
 //
-// Completing a note closes it. The record is kept and stays reachable in the
-// browser's Closed tab; nothing is ever deleted from this control.
+// The human close transaction retains nonempty notes in Closed and removes
+// truly empty notes after checking the canonical source and visible draft.
 
 function setupClose(btn, noteEl, noteId) {
   btn.addEventListener("click", function (e) {
     e.stopPropagation();
-    noteEl.classList.add("hidden");
-    send({ type: "note_close", id: noteId });
+    closeHumanNote(noteId);
   });
 }
 

package/lib/public/modules/sticky-notes-checklist.js

@@ -0,0 +1,71 @@
+// Plain task controls use Markdown only as the internal persistence format.
+import { iconHtml, refreshIcons } from './icons.js';
+import { getChecklistItems } from './sticky-note-markdown.js';
+import { getNoteUiState, setNoteUiState } from './sticky-notes-shared.js';
+import { mutateChecklist } from './sticky-notes-state.js';
+
+export function checklistDraftText(ui) {
+  var fields = ui.checklistInputs || {};
+  var lines = (ui.text || '').split('\n');
+  if (fields.title !== undefined) lines[0] = fields.title;
+  getChecklistItems(ui.text).forEach(function (item) {
+    if (fields[item.key] !== undefined) {
+      var marker = item.text.match(/^\s*(?:[-*+]\s+)?\[([ xX])\]/);
+      var checked = ui.checklistState[item.key];
+      if (checked === undefined) checked = marker && marker[1].toLowerCase() === 'x';
+      lines[item.index + 1] = '- [' + (checked ? 'x' : ' ') + '] ' + fields[item.key];
+    }
+  });
+  if (fields.entry && fields.entry.trim()) {
+    if (!lines[0].trim()) lines[0] = 'Checklist';
+    lines.push('- [ ] ' + fields.entry.trim());
+  }
+  return lines.join('\n');
+}
+
+export function renderTaskControls(root, id) {
+  var ui = getNoteUiState(id);
+  var fields = ui.checklistInputs || {};
+  var busy = ui.pending.length > 0;
+  root.replaceChildren();
+  var form = document.createElement('form'); form.className = 'sn-task-form';
+  function input(label, value, key) {
+    var control = document.createElement('input'); control.type = 'text'; control.value = fields[key] !== undefined ? fields[key] : value;
+    control.setAttribute('aria-label', label); control.placeholder = label; control.maxLength = 400;
+    control.disabled = busy;
+    control.oninput = function () {
+      var current = getNoteUiState(id);
+      var draft = Object.assign({}, current.checklistInputs || {}); draft[key] = control.value;
+      setNoteUiState(id, { checklistInputs: draft });
+    };
+    return control;
+  }
+  var title = input('Checklist title', (ui.text || '').split('\n')[0], 'title'); title.className = 'sn-task-title'; form.appendChild(title);
+  getChecklistItems(ui.text).forEach(function (item, position) {
+    var row = document.createElement('div'); row.className = 'sn-task-row';
+    var marker = item.text.match(/^\s*(?:[-*+]\s+)?\[([ xX])\]\s*(.*)$/);
+    var check = document.createElement('button'); check.type = 'button'; check.className = 'sn-check';
+    var checked = ui.checklistState[item.key];
+    if (checked === undefined) checked = marker && marker[1].toLowerCase() === 'x';
+    check.classList.toggle('checked', !!checked); check.textContent = checked ? '✓' : '☐';
+    check.setAttribute('role', 'checkbox'); check.setAttribute('aria-checked', checked ? 'true' : 'false'); check.setAttribute('aria-label', 'Complete task ' + (position + 1));
+    check.dataset.checklistIndex = item.index; check.dataset.checklistKey = encodeURIComponent(item.key);
+    check.disabled = busy;
+    var label = input('Task ' + (position + 1), marker ? marker[2] : item.text, item.key);
+    var remove = document.createElement('button'); remove.type = 'button'; remove.className = 'sn-task-remove'; remove.innerHTML = iconHtml('x'); remove.setAttribute('aria-label', 'Remove task ' + (position + 1)); remove.disabled = busy;
+    remove.onclick = function () {
+      var current = getNoteUiState(id); var lines = checklistDraftText(current).split('\n'); lines.splice(item.index + 1, 1);
+      save(lines.join('\n'));
+    };
+    row.append(check, label, remove); form.appendChild(row);
+  });
+  var entry = input('New task', '', 'entry'); entry.className = 'sn-task-entry'; form.appendChild(entry);
+  var saveButton = document.createElement('button'); saveButton.type = 'submit'; saveButton.className = 'sn-task-save'; saveButton.textContent = 'Save tasks'; saveButton.disabled = busy; form.appendChild(saveButton);
+  function save(text) {
+    var current = getNoteUiState(id);
+    if (current.pending.length) return;
+    mutateChecklist(id, { checklistEdit: true, checklistSource: current.canonical.text, checklistVersion: current.canonical.updatedAt, text: text });
+  }
+  form.onsubmit = function (event) { event.preventDefault(); save(checklistDraftText(getNoteUiState(id))); };
+  root.appendChild(form); refreshIcons(root);
+}

package/lib/public/modules/sticky-notes-editor.js

@@ -8,7 +8,11 @@
 import { refreshIcons, iconHtml } from './icons.js';
 import { extractMarkdown, renderMiniMarkdown } from './sticky-note-markdown.js';
 import { enhanceClayLogLinks } from './clay-log-links.js';
-import { debouncedTextUpdate, syncTitle } from './sticky-notes-shared.js';
+import { debouncedTextUpdate, syncTitle, getNoteUiState, setNoteUiState, subscribeNoteUiState } from './sticky-notes-shared.js';
+
+import { renderTaskControls } from './sticky-notes-checklist.js';
+import { requestChecklistMode } from './sticky-notes-actions.js';
+import { mutateChecklist } from './sticky-notes-state.js';
 
 var formatToolbarEl = null;
 
@@ -145,51 +149,112 @@ function positionToolbarAtRange(toolbar, range) {
   });
 }
 
-export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
+export function setupTextEdit(textarea, rendered, noteId, mdBtn, checklistBtn, noteData) {
   var noteEl = textarea.closest(".sticky-note");
   var mdMode = false;
+  var disposed = false;
+  var ui = getNoteUiState(noteId, noteData);
+  var checklistMode = ui.checklistMode === true;
+  var checklistState = ui.checklistState || {};
+  var renderedDirty = false;
+  var sourceText = ui.text !== undefined ? ui.text : textarea.value;
+  textarea.value = sourceText;
+
+  function renderChecklist() {
+    var active = document.activeElement;
+    var focusKey = active && rendered.contains(active) && active.dataset ? active.dataset.checklistKey : undefined;
+    if (checklistMode) renderTaskControls(rendered, noteId);
+    else rendered.innerHTML = renderMiniMarkdown(sourceText, { checklistMode: checklistMode, checklistState: checklistState });
+    if (sourceText.trim()) enhanceClayLogLinks(rendered);
+    rendered.classList.toggle("is-empty", !checklistMode && !sourceText.trim());
+    rendered.contentEditable = checklistMode || getNoteUiState(noteId).pending.length ? "false" : "true";
+    if (focusKey !== undefined) {
+      var checks = rendered.querySelectorAll("[data-checklist-key]");
+      for (var i = 0; i < checks.length; i++) {
+        if (checks[i].dataset.checklistKey === focusKey) { checks[i].focus({ preventScroll: true }); break; }
+      }
+    }
+  }
 
   function saveRenderedMarkdown() {
-    var markdown = extractMarkdown(rendered);
-    textarea.value = markdown;
-    debouncedTextUpdate(noteId, markdown);
-    syncTitle(noteEl, markdown);
-    rendered.classList.toggle("is-empty", !markdown.trim());
+    if (checklistMode) return;
+    renderedDirty = true;
+    sourceText = extractMarkdown(rendered);
+    textarea.value = sourceText;
+    setNoteUiState(noteId, { text: sourceText, draft: true });
+    debouncedTextUpdate(noteId, sourceText);
+    syncTitle(noteEl, sourceText);
+    rendered.classList.toggle("is-empty", !checklistMode && !sourceText.trim());
   }
 
   function toggleChecklistItem(check) {
-    var checked = !check.classList.contains("checked");
-    check.classList.toggle("checked", checked);
-    check.textContent = checked ? "✓" : "☐";
-    check.setAttribute("aria-checked", checked ? "true" : "false");
+    if (checklistMode && check.dataset.checklistIndex !== undefined) {
+      var index = parseInt(check.dataset.checklistIndex, 10);
+      var checked = !check.classList.contains("checked");
+      mutateChecklist(noteId, { checklistIndex: index, checklistKey: check.dataset.checklistKey || "", checklistSource: sourceText, checklistChecked: checked });
+      return;
+    }
+    var normalChecked = !check.classList.contains("checked");
+    check.classList.toggle("checked", normalChecked);
+    check.textContent = normalChecked ? "✓" : "☐";
+    check.setAttribute("aria-checked", normalChecked ? "true" : "false");
     saveRenderedMarkdown();
   }
 
-  // MD button: toggle between contenteditable rendered view and raw textarea
+  var unsubscribeUiState = subscribeNoteUiState(function (all) {
+    var next = all[noteId];
+    if (!next) return;
+    var changed = next.checklistMode !== checklistMode ||
+      (next.text !== undefined && next.text !== sourceText) ||
+      next.pending.length !== ui.pending.length ||
+      next.checklistInputs !== ui.checklistInputs && !next.checklistInputs ||
+      JSON.stringify(next.checklistState || {}) !== JSON.stringify(checklistState || {});
+    ui = next;
+    checklistMode = next.checklistMode === true;
+    checklistState = next.checklistState || {};
+    if (next.text !== undefined && next.text !== sourceText) {
+      sourceText = next.text;
+      textarea.value = sourceText;
+    }
+    mdBtn.hidden = checklistMode;
+    mdBtn.disabled = checklistMode;
+    if (checklistMode && mdMode) {
+      mdMode = false; textarea.style.display = 'none'; rendered.style.display = ''; mdBtn.classList.remove('active');
+    }
+    checklistBtn.classList.toggle("active", checklistMode);
+    checklistBtn.title = checklistMode ? "Show note" : "Show checklist";
+    checklistBtn.setAttribute("aria-label", checklistBtn.title);
+    checklistBtn.setAttribute("aria-pressed", checklistMode ? "true" : "false");
+    var status = noteEl.querySelector(".sticky-note-save-status");
+    if (status) status.textContent = next.error || (next.pending && next.pending.length ? "Saving…" : "");
+    if (changed && !mdMode) { renderChecklist(); syncTitle(noteEl, sourceText); }
+  });
+  noteEl._stickyNoteDispose = function () {
+    disposed = true;
+    closeFormatToolbar();
+    unsubscribeUiState();
+  };
+
+  checklistBtn.addEventListener("click", function (e) {
+    e.stopPropagation();
+    requestChecklistMode(noteId);
+  });
+
   mdBtn.addEventListener("click", function (e) {
     e.stopPropagation();
+    if (checklistMode) return;
     mdMode = !mdMode;
     if (mdMode) {
-      // Switch to raw markdown editing
-      var md = extractMarkdown(rendered);
-      textarea.value = md;
+      textarea.value = sourceText;
       textarea.style.display = "";
       rendered.style.display = "none";
       mdBtn.classList.add("active");
       textarea.focus();
     } else {
-      // Switch back to contenteditable rendered view
-      var md = textarea.value;
-      debouncedTextUpdate(noteId, md);
-      syncTitle(noteEl, md);
-      if (md.trim()) {
-        rendered.innerHTML = renderMiniMarkdown(md);
-        enhanceClayLogLinks(rendered);
-        rendered.classList.remove("is-empty");
-      } else {
-        rendered.innerHTML = "";
-        rendered.classList.add("is-empty");
-      }
+      sourceText = textarea.value;
+      if (getNoteUiState(noteId).draft) debouncedTextUpdate(noteId, sourceText);
+      syncTitle(noteEl, sourceText);
+      renderChecklist();
       textarea.style.display = "none";
       rendered.style.display = "";
       mdBtn.classList.remove("active");
@@ -197,11 +262,7 @@ export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
     }
   });
 
-  // Sync contenteditable changes to textarea (data store) and save
-  rendered.addEventListener("input", function () {
-    saveRenderedMarkdown();
-  });
-
+  rendered.addEventListener("input", saveRenderedMarkdown);
   rendered.addEventListener("click", function (e) {
     var check = e.target.closest && e.target.closest(".sn-check");
     if (!check || !rendered.contains(check)) return;
@@ -210,27 +271,23 @@ export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
     toggleChecklistItem(check);
   });
 
-  // On blur, re-render to normalize HTML structure
   rendered.addEventListener("blur", function (e) {
-    // Don't re-render if clicking format toolbar (it prevents default, but just in case)
+    if (checklistMode || !renderedDirty) return;
+    renderedDirty = false;
     if (e.relatedTarget && e.relatedTarget.closest && e.relatedTarget.closest(".sn-format-toolbar")) return;
     closeFormatToolbar();
     var md = extractMarkdown(rendered);
+    sourceText = md;
     textarea.value = md;
-    if (md.trim()) {
-      rendered.innerHTML = renderMiniMarkdown(md);
-      enhanceClayLogLinks(rendered);
-      rendered.classList.remove("is-empty");
-    } else {
-      rendered.innerHTML = "";
-      rendered.classList.add("is-empty");
-    }
+    setNoteUiState(noteId, { text: sourceText, draft: true });
+    renderChecklist();
   });
 
   // Show format toolbar when selecting text
   rendered.addEventListener("mouseup", function (e) {
     if (e.target.tagName === "A") return;
     setTimeout(function () {
+      if (disposed) return;
       var sel = window.getSelection();
       if (sel && !sel.isCollapsed && sel.toString().trim()) {
         showFormatToolbar(rendered);
@@ -260,6 +317,7 @@ export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
       toggleChecklistItem(e.target);
       return;
     }
+    if (checklistMode) return;
     if (e.key === "Enter" && !e.shiftKey) {
       e.preventDefault();
       document.execCommand("insertLineBreak");
@@ -268,6 +326,7 @@ export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
 
   // Paste as plain text to avoid importing HTML formatting
   rendered.addEventListener("paste", function (e) {
+    if (checklistMode) return;
     e.preventDefault();
     var text = (e.clipboardData || window.clipboardData).getData("text/plain");
     document.execCommand("insertText", false, text);
@@ -281,10 +340,15 @@ export function setupTextEdit(textarea, rendered, noteId, mdBtn) {
   // Sync textarea edits when in MD mode
   textarea.addEventListener("input", function () {
     if (!mdMode) return;
-    debouncedTextUpdate(noteId, textarea.value);
-    syncTitle(noteEl, textarea.value);
+    sourceText = textarea.value;
+    setNoteUiState(noteId, { text: sourceText, draft: true });
+    debouncedTextUpdate(noteId, sourceText);
+    syncTitle(noteEl, sourceText);
   });
 
+  mdBtn.hidden = checklistMode; mdBtn.disabled = checklistMode;
+  renderChecklist();
+
   textarea.addEventListener("mousedown", function (e) {
     e.stopPropagation();
   });

package/lib/public/modules/sticky-notes-shared.js

@@ -55,8 +55,51 @@ export function clampSize(x, y, w, h) {
 
 export function send(obj) {
   var ws = getWs();
-  if (!ws || !store.get('connected')) return;
-  ws.send(JSON.stringify(obj));
+  if (!ws || !store.get('connected')) return false;
+  try { ws.send(JSON.stringify(obj)); return true; } catch (error) { return false; }
+}
+
+export function getNoteUiState(id, fallback) {
+  var all = store.get("stickyNoteUiState") || {};
+  if (!all[id]) {
+    var initial = {
+      canonical: Object.assign({}, fallback),
+      canonicalRevision: 0,
+      draft: false,
+      text: fallback && fallback.text ? fallback.text : "",
+      checklistMode: fallback && fallback.checklistMode === true,
+      checklistState: fallback && fallback.checklistState ? fallback.checklistState : {},
+      pending: [],
+    };
+    var next = Object.assign({}, all);
+    next[id] = initial;
+    store.set({ stickyNoteUiState: next });
+    return initial;
+  }
+  return all[id];
+}
+
+export function setNoteUiState(id, changes) {
+  var all = store.get("stickyNoteUiState") || {};
+  var current = all[id] || {};
+  var next = Object.assign({}, all);
+  next[id] = Object.assign({}, current, changes || {});
+  store.set({ stickyNoteUiState: next });
+  return next[id];
+}
+
+export function deleteNoteUiState(id) {
+  var all = store.get("stickyNoteUiState") || {};
+  if (!all[id]) return;
+  var next = Object.assign({}, all);
+  delete next[id];
+  store.set({ stickyNoteUiState: next });
+}
+
+export function subscribeNoteUiState(listener) {
+  return store.subscribe(function (next, previous) {
+    if (next.stickyNoteUiState !== previous.stickyNoteUiState) listener(next.stickyNoteUiState || {});
+  });
 }
 
 export function debouncedUpdate(id, changes, delay) {
@@ -82,6 +125,11 @@ export function syncTitle(noteEl, text) {
 
 
 // Drop any pending writes for a note this client no longer has.
+export function clearNoteTextTimer(id) {
+  clearTimeout(textTimers[id]);
+  delete textTimers[id];
+}
+
 export function clearNoteTimers(id) {
   clearTimeout(updateTimers[id]);
   clearTimeout(textTimers[id]);