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

package/lib/public/modules/project-admin-overview.js

@@ -0,0 +1,21 @@
+// This page never opens a project socket or loads project content modules.
+var tabs = Array.from(document.querySelectorAll('[role="tab"]'));
+function select(tab) {
+  tabs.forEach(function (item) {
+    var active = item === tab;
+    item.setAttribute("aria-selected", String(active));
+    item.tabIndex = active ? 0 : -1;
+    document.getElementById(item.getAttribute("aria-controls")).hidden = !active;
+  });
+}
+tabs.forEach(function (tab, index) {
+  tab.addEventListener("click", function () { select(tab); });
+  tab.addEventListener("keydown", function (event) {
+    if (["ArrowLeft", "ArrowRight", "Home", "End"].indexOf(event.key) === -1) return;
+    event.preventDefault();
+    var target = event.key === "Home" ? tabs[0] : event.key === "End" ? tabs[tabs.length - 1] : tabs[(index + (event.key === "ArrowRight" ? 1 : tabs.length - 1)) % tabs.length];
+    select(target);
+    target.focus();
+  });
+});
+select(tabs[0]);

package/lib/public/modules/session-folder-layout.js

@@ -9,7 +9,7 @@ export var FAVORITES_ID = "favorites";
 export var UNFILED_ID = "unfiled";
 
 export function defaultFolderState() {
-  return { folders: [], assignments: {}, favorites: [], orders: {}, collapsed: {}, view: { sort: "activity", direction: "desc" } };
+  return { folders: [], assignments: {}, favorites: [], orders: {}, collapsed: {}, view: { sort: "activity", direction: "desc", showDateHeadings: true } };
 }
 
 export function sortUnits(units, view, order) {

package/lib/public/modules/session-folder-view-menu.js

@@ -78,6 +78,15 @@ export function paintViewMenu() {
     note.textContent = "Drag sessions to arrange them. Favorites keep their own order.";
     menu.appendChild(note);
   }
+  var dateToggle = document.createElement("button");
+  dateToggle.type = "button";
+  dateToggle.className = "session-folder-view-toggle";
+  dateToggle.dataset.focusKey = "showDateHeadings";
+  dateToggle.setAttribute("role", "switch");
+  dateToggle.setAttribute("aria-checked", String(view.showDateHeadings !== false));
+  dateToggle.innerHTML = '<span>Show date headings</span><span class="session-folder-view-toggle-track" aria-hidden="true"><span class="session-folder-view-toggle-thumb"></span></span>';
+  dateToggle.addEventListener("click", function () { sendViewPatch({ showDateHeadings: view.showDateHeadings === false }); });
+  menu.appendChild(dateToggle);
   if (focusKey) {
     var target = menu.querySelector('[data-focus-key="' + focusKey + '"]') || menu.querySelector(".session-folder-radio.selected");
     if (target) target.focus();

package/lib/public/modules/session-github.js

@@ -46,6 +46,28 @@ function compactGithubWork(links, sessionRow) {
   var latestPr = links.find(function (link) { return link.kind === 'pr'; });
   return [latestLinear, latestIssue, latestPr].filter(Boolean);
 }
+function personalScope() {
+  return String(store.get('currentSlug') || '') + '\u0000' + String(store.get('myUserId') || 'default');
+}
+function ensurePersonalScope() {
+  var scope = personalScope();
+  if (store.get('githubPersonalReviewScope') !== scope) store.set({ githubPersonalReviewScope: scope, githubPersonalReview: {} });
+  return scope;
+}
+function sessionIdentifier(session) {
+  return String(session && (session._githubSessionId || session.id || session.localId) || '');
+}
+function personalReviewState(session, link) {
+  var scope = ensurePersonalScope();
+  var key = scope + '\u0000' + (sessionIdentifier(session) || String(link._githubSessionId || '')) + '\u0000' + String(link.url || '').toLowerCase();
+  return (store.get('githubPersonalReview') || {})[key] || link.personalReviewState || '';
+}
+function prReviewStatus(link) {
+  if (link.review === 'CHANGES_REQUESTED') return { icon: 'message-square-warning', label: 'Changes requested', className: 'github-review-changes' };
+  if (link.personalReviewState === 'requested') return { icon: 'user-round-check', label: 'Review requested from you', className: 'github-review-requested' };
+  if (link.review === 'APPROVED') return { icon: 'badge-check', label: 'Approved', className: 'github-review-approved' };
+  return null;
+}
 export function githubWorkMarkup(session, detailed, expanded, sessionRow) {
   var links = orderedGithubWork(session);
   if (!links.length) return '';
@@ -56,13 +78,17 @@ export function githubWorkMarkup(session, detailed, expanded, sessionRow) {
       return anchor(link.url, description, LINEAR_MARK + '<span class="linear-work-id">' + escapeHtml(link.identifier) + '</span><span class="linear-work-title">' + escapeHtml(link.title) + '</span><span class="linear-work-state"><span class="linear-work-state-full">' + escapeHtml(link.stateName) + '</span><span class="linear-work-state-compact" aria-hidden="true">' + escapeHtml(compactLinearState(link.stateName)) + '</span></span>', 'session-github-link session-linear-link');
     }
     var state = ['open', 'closed', 'merged', 'draft'].indexOf(link.state) >= 0 ? link.state : 'unknown';
-    var icon = link.kind === 'pr' ? (state === 'merged' ? 'git-merge' : state === 'closed' ? 'git-pull-request-closed' : state === 'draft' ? 'git-pull-request-draft' : 'git-pull-request') : (state === 'closed' ? 'circle-check' : 'circle-dot');
-    var description = link.repository + ' · ' + label(link) + ' · ' + link.title + ' · ' + state + (link.checkedAt ? ' · Checked ' + new Date(link.checkedAt).toLocaleString() : '') + (link.stale ? ' (last known status; refresh unavailable)' : '');
-    var html = anchor(link.url, description, iconHtml('github', 'github-work-brand') + iconHtml(icon, 'github-work-status') + '<span><span class="github-work-kind">' + (link.kind === 'pr' ? 'PR ' : 'Issue ') + '</span>#' + escapeHtml(String(link.number)) + '</span>', 'session-github-link github-kind-' + (link.kind === 'pr' ? 'pr' : 'issue') + ' github-state-' + state);
+    var reviewLink = Object.assign({}, link, { personalReviewState: personalReviewState(session, link) });
+    var reviewStatus = link.kind === 'pr' && state === 'open' ? prReviewStatus(reviewLink) : null;
+    var icon = link.kind === 'pr' ? (state === 'merged' ? 'git-merge' : state === 'closed' ? 'git-pull-request-closed' : state === 'draft' ? 'git-pull-request-draft' : reviewStatus ? reviewStatus.icon : 'git-pull-request') : (state === 'closed' ? 'circle-check' : 'circle-dot');
+    var statusLabel = reviewStatus ? reviewStatus.label : (state === 'merged' ? 'Merged' : state === 'closed' ? 'Closed' : state === 'draft' ? 'Draft' : state === 'open' ? 'Open' : 'Unknown');
+    var description = link.repository + ' · ' + label(link) + ' · ' + link.title + ' · ' + statusLabel + (link.checkedAt ? ' · Checked ' + new Date(link.checkedAt).toLocaleString() : '') + (link.stale ? ' (last known status; refresh unavailable)' : '');
+    var statusMarkup = '<span class="github-work-status' + (reviewStatus ? ' ' + reviewStatus.className : '') + '" title="' + escapeHtml(statusLabel) + '" aria-label="' + escapeHtml(statusLabel) + '">' + iconHtml(icon) + '</span>';
+    var html = anchor(link.url, description, iconHtml('github', 'github-work-brand') + statusMarkup + '<span><span class="github-work-kind">' + (link.kind === 'pr' ? 'PR ' : 'Issue ') + '</span>#' + escapeHtml(String(link.number)) + '</span>', 'session-github-link github-kind-' + (link.kind === 'pr' ? 'pr' : 'issue') + ' github-state-' + state);
     if (expanded) html = '<span class="github-work-entry">' + html + '<span class="github-work-entry-title">' + escapeHtml(link.title || '') + '</span><span class="github-work-entry-meta">' + escapeHtml(link.repository + ' · ' + state + (link.stale ? ' · Last known status' : '')) + '</span></span>';
     if (detailed && link.kind === 'pr') {
       var actions = anchor(link.url + '/files', 'View PR changes on GitHub', 'Changes', 'github-work-action') +
-        anchor(link.url + '#pullrequestreview', 'View PR reviews on GitHub', escapeHtml((link.review || 'Reviews').replace(/_/g, ' ').toLowerCase()), 'github-work-action');
+        anchor(link.url + '#pullrequestreview', 'View PR reviews on GitHub', 'Reviews', 'github-work-action');
       var checks = '';
       (link.checks || []).forEach(function (check) {
         if (/^https:\/\//i.test(check.url)) checks += anchor(check.url, check.name + ': ' + check.state, '<span class="github-work-check-name">' + escapeHtml(check.name) + '</span><span class="github-work-check-state">' + escapeHtml(check.state.toLowerCase()) + '</span>', 'github-work-action github-work-check');
@@ -76,6 +102,28 @@ export function githubWorkMarkup(session, detailed, expanded, sessionRow) {
     return html;
   }).join('') + (!detailed && !expanded && links.length > displayed.length ? '<button type="button" class="github-work-more" aria-label="Show all ' + links.length + ' linked ' + (links.some(function (item) { return item.provider === 'linear'; }) ? 'work items' : 'GitHub items') + '" aria-haspopup="dialog" aria-expanded="false" data-work-session="' + escapeHtml(String(session.id || session.localId || '')) + '" data-work-primary="' + escapeHtml(JSON.stringify(session.workPrimary || {})) + '" data-github-links="' + escapeHtml(JSON.stringify(safeLinks(session))) + '">+' + (links.length - displayed.length) + '</button>' : '') + '</span>';
 }
+export function applyGithubPersonalReviewStatus(message) {
+  var state = store.snap();
+  if (!message || (message.projectSlug && message.projectSlug !== state.currentSlug) || (message.accountId && message.accountId !== state.myUserId)) return;
+  var refresh = state.githubWorkRefresh || {};
+  if (message.requestId && refresh.requestId && message.requestId !== refresh.requestId) return;
+  var updates = message.personalReview || {};
+  var scope = ensurePersonalScope();
+  var personal = Object.assign({}, store.get('githubPersonalReview') || {});
+  var sessionId = String(message.sessionId);
+  Object.keys(updates).forEach(function (url) {
+    var status = updates[url];
+    if (status === 'requested' || status === 'clear') personal[scope + '\u0000' + sessionId + '\u0000' + url.toLowerCase()] = status;
+  });
+  store.set({ githubPersonalReview: personal });
+  var sessions = store.get('githubWorkSessions') || [];
+  sessions.forEach(function (session) {
+    if (String(session.localId) !== sessionId && String(session.id) !== sessionId) return;
+    document.querySelectorAll('[data-github-session-id="' + sessionIdentifier(session) + '"] .session-work-links-slot').forEach(function (slot) { slot.innerHTML = githubWorkMarkup(session, false, false, true); });
+  });
+  syncGithubSessions(sessions);
+  refreshIcons();
+}
 export function appendGithubWork(row, session, title) {
   var html = githubWorkMarkup(session, false, false, true);
   bindGithubWorkPopover();
@@ -94,6 +142,7 @@ export function appendGithubWork(row, session, title) {
 }
 export function syncGithubSessions(sessions) {
   bindGithubWorkPopover();
+  ensurePersonalScope();
   store.set({ githubWorkSessions: sessions || [], githubWorkProject: store.get('currentSlug') });
   var active = (sessions || []).find(function (session) { return session.active; });
   var title = document.getElementById('header-title');
@@ -132,15 +181,16 @@ export function refreshGithubWork() {
   if (previous.key === key && Date.now() - previous.at < 60000) return;
   var ws = getWs();
   if (!ws || ws.readyState !== 1) return;
-  store.set({ githubWorkRefresh: { key: key, at: Date.now() } });
-  ws.send(JSON.stringify({ type: 'session_github_refresh', sessionIds: ids }));
+  var requestId = 'github-refresh-' + Date.now() + '-' + Math.random().toString(36).slice(2);
+  store.set({ githubWorkRefresh: { key: key, at: Date.now(), requestId: requestId } });
+  ws.send(JSON.stringify({ type: 'session_github_refresh', sessionIds: ids, requestId: requestId, projectSlug: store.get('currentSlug'), accountId: store.get('myUserId') || null }));
   var linearIds = ids.filter(function (id) { return (store.get('githubWorkSessions') || []).some(function (item) { return item.id === id && (item.linearLinks || []).length; }); });
   if (linearIds.length) ws.send(JSON.stringify({ type: 'session_linear_refresh', sessionIds: linearIds }));
 }
 
 export function resetGithubWork() {
   closeGithubWorkPopover();
-  store.set({ githubWorkSessions: [], githubWorkProject: null, githubWorkRefresh: null, workPrimaryPending: null });
+  store.set({ githubWorkSessions: [], githubWorkProject: null, githubWorkRefresh: null, githubPersonalReview: {}, workPrimaryPending: null });
   var header = document.getElementById('header-github-links');
   if (header) header.remove();
 }
@@ -218,7 +268,8 @@ function bindGithubWorkPopover() {
     popup.dataset.sessionId = button.dataset.workSession || '';
     var primary;
     try { primary = JSON.parse(button.dataset.workPrimary || '{}'); } catch (error) { primary = {}; }
-    popup.innerHTML = '<strong>' + workTitle + '</strong>' + primaryWorkPopover(links, primary, popup.dataset.sessionId, githubWorkMarkup);
+    var popupLinks = links.map(function (link) { return Object.assign({}, link, { _githubSessionId: popup.dataset.sessionId }); });
+    popup.innerHTML = '<strong>' + workTitle + '</strong>' + primaryWorkPopover(popupLinks, primary, popup.dataset.sessionId, githubWorkMarkup);
     document.body.appendChild(popup);
     mountGithubWorkPopover(popup, button);
     button.setAttribute('aria-expanded', 'true');
@@ -238,3 +289,9 @@ function bindGithubWorkPopover() {
     if (state.currentSlug !== previous.currentSlug || state.activeSessionId !== previous.activeSessionId || state.dmMode !== previous.dmMode) closeGithubWorkPopover();
   });
 }
+store.subscribe(function (state, previous) {
+  if (state.currentSlug !== previous.currentSlug || state.myUserId !== previous.myUserId) {
+    var scope = personalScope();
+    if (state.githubPersonalReviewScope !== scope) store.set({ githubPersonalReviewScope: scope, githubPersonalReview: {} });
+  }
+});

package/lib/public/modules/sidebar-session-folders-ui.js

@@ -353,7 +353,7 @@ function renderSection(section, ctx, kind) {
     body.appendChild(empty);
   }
   var view = currentFolderState().view;
-  var dateGroups = isFavorites ? null : groupUnitsByDate(section.units, view.sort, view.direction);
+  var dateGroups = isFavorites || view.showDateHeadings === false ? null : groupUnitsByDate(section.units, view.sort, view.direction);
   if (dateGroups) {
     for (var g = 0; g < dateGroups.length; g++) {
       var ids = groupRootSessionIds(dateGroups[g].units);

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);
+}