dsh-tiddlywiki 0.4.0 → 0.6.0

package/lib/client.js

@@ -134,6 +134,9 @@ html[data-dsh-tw-active] .dshDesktopConversationSurface > :not([data-dsh-tw-view
   display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
   font-family: inherit;
 }
+/* The wrapper's display:flex would beat the UA [hidden]{display:none} rule,
+   so the card's show/hide (root.hidden) needs an explicit rule. */
+.dsh-tw-note[hidden] { display: none; }
 .dsh-tw-note-card {
   width: 340px; max-width: calc(100vw - 40px);
   background: var(--dsw-alias-bg-layer-2, #fff); color: var(--dsw-alias-label-primary, #222);
@@ -374,6 +377,113 @@ html[data-dsh-tw-active] .dshDesktopConversationSurface > :not([data-dsh-tw-view
 .dsh-tw-settings-error { color: var(--dsw-alias-state-error-primary, #d13b3b); font-size: 12px; }
 .dsh-tw-settings-search { flex: 0 0 auto; max-width: 220px; }
 .dsh-tw-settings-check { accent-color: var(--dsw-alias-brand-primary, #3e63dd); }
+
+/* ── "知识库" FAB (v0.5: quick-note + sync + panel status merged) ──────────
+   One fixed cluster above the shutdown launcher FAB (bottom:24). The FAB
+   carries a git status dot; the menu pops upward from it. */
+.dsh-tw-fab-wrap {
+  position: fixed; right: 24px; bottom: 88px; z-index: 960;
+  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
+}
+.dsh-tw-fab {
+  position: relative;
+  width: 46px; height: 46px; border-radius: 50%;
+  border: 1px solid var(--dsw-alias-border-l2, rgba(0,0,0,.18));
+  background: var(--dsw-alias-bg-layer-2, #fff); color: var(--dsw-alias-label-primary, #222);
+  box-shadow: var(--dsw-shadow-lv3, 0 4px 16px rgba(0,0,0,.16)); cursor: pointer;
+  display: inline-flex; align-items: center; justify-content: center;
+  transition: background-color 120ms ease, transform 80ms ease;
+}
+.dsh-tw-fab:hover { background: var(--dsw-alias-interactive-bg-hover, rgba(128,128,128,.1)); }
+.dsh-tw-fab:active { transform: scale(.94); }
+.dsh-tw-fab-icon { display: inline-flex; }
+.dsh-tw-fab-dot {
+  position: absolute; right: 0; bottom: 0; width: 11px; height: 11px;
+  border-radius: 50%; border: 2px solid var(--dsw-alias-bg-layer-2, #fff);
+  background: #999; box-sizing: border-box;
+}
+.dsh-tw-fab-dot[data-state="clean"] { background: var(--dsw-alias-state-success-primary, #3eaa5f); }
+.dsh-tw-fab-dot[data-state="dirty"] { background: var(--dsw-alias-state-warning-primary, #d9822b); }
+.dsh-tw-fab-dot[data-state="behind"] { background: var(--dsw-alias-state-error-primary, #d13b3b); }
+.dsh-tw-fab-dot[data-state="syncing"] { background: var(--dsw-alias-brand-primary, #3e63dd); }
+.dsh-tw-fab-menu {
+  min-width: 220px; max-width: calc(100vw - 48px);
+  display: flex; flex-direction: column; gap: 2px; padding: 6px;
+  border-radius: 12px; border: 1px solid var(--dsw-alias-border-l2, rgba(0,0,0,.15));
+  background: var(--dsw-alias-bg-layer-2, #fff); color: var(--dsw-alias-label-primary, #222);
+  box-shadow: var(--dsw-shadow-lv3, 0 8px 30px rgba(0,0,0,.22));
+  font-size: 13px;
+  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
+  animation: dsh-tw-note-in 160ms ease;
+}
+.dsh-tw-fab-menu[hidden] { display: none; }
+.dsh-tw-fab-status {
+  display: flex; align-items: center; gap: 7px;
+  padding: 6px 9px; font-size: 12px; color: var(--dsw-alias-label-secondary, #666);
+  border-bottom: 1px solid var(--dsw-alias-border-l1, rgba(0,0,0,.08));
+  margin-bottom: 4px;
+}
+.dsh-tw-fab-status + .dsh-tw-fab-status { border-bottom: 0; margin-bottom: 4px; }
+.dsh-tw-fab-status-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dsh-tw-fab-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #999; flex: none; }
+.dsh-tw-fab-status-dot[data-state="running"] { background: var(--dsw-alias-state-success-primary, #3eaa5f); }
+.dsh-tw-fab-status-dot[data-state="starting"] { background: var(--dsw-alias-state-warning-primary, #d9822b); }
+.dsh-tw-fab-status-dot[data-state="failed"], .dsh-tw-fab-status-dot[data-state="stopped"] { background: var(--dsw-alias-state-error-primary, #d13b3b); }
+.dsh-tw-fab-status-dot[data-state="clean"] { background: var(--dsw-alias-state-success-primary, #3eaa5f); }
+.dsh-tw-fab-status-dot[data-state="dirty"] { background: var(--dsw-alias-state-warning-primary, #d9822b); }
+.dsh-tw-fab-status-dot[data-state="behind"] { background: var(--dsw-alias-state-error-primary, #d13b3b); }
+.dsh-tw-fab-status-dot[data-state="syncing"] { background: var(--dsw-alias-brand-primary, #3e63dd); }
+.dsh-tw-fab-item {
+  display: flex; align-items: center; gap: 6px; text-align: left;
+  border: none; background: transparent; color: inherit; font: inherit; font-size: 13px;
+  padding: 7px 9px; border-radius: 8px; cursor: pointer;
+}
+.dsh-tw-fab-item:hover { background: var(--dsw-alias-interactive-bg-hover, rgba(128,128,128,.12)); }
+.dsh-tw-fab-item:active { background: var(--dsw-alias-interactive-bg-active, rgba(128,128,128,.18)); }
+
+/* ── quick-note restored-draft banner ─────────────────────────────────────── */
+.dsh-tw-note-draft {
+  display: flex; align-items: center; justify-content: space-between; gap: 8px;
+  padding: 5px 9px; border-radius: 8px; font-size: 12px;
+  background: color-mix(in srgb, var(--dsw-alias-state-warning-primary, #d9822b) 12%, transparent);
+  color: var(--dsw-alias-label-primary, #222);
+}
+.dsh-tw-note-draft[hidden] { display: none; }
+.dsh-tw-note-draft-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dsh-tw-note-draft-discard {
+  border: 1px solid var(--dsw-alias-border-l2, rgba(0,0,0,.18));
+  background: transparent; color: inherit; font: inherit; font-size: 12px;
+  padding: 2px 10px; border-radius: 999px; cursor: pointer; flex: none;
+}
+.dsh-tw-note-draft-discard:hover { background: var(--dsw-alias-interactive-bg-hover, rgba(128,128,128,.12)); }
+
+/* ── quick-note recent-notes picker ───────────────────────────────────────── */
+.dsh-tw-note-recent {
+  position: absolute; right: 0; bottom: calc(100% - 8px); z-index: 70;
+  width: 340px; max-width: calc(100vw - 40px); max-height: 280px; overflow-y: auto;
+  display: flex; flex-direction: column; gap: 2px; padding: 6px;
+  border-radius: 12px; border: 1px solid var(--dsw-alias-border-l2, rgba(0,0,0,.15));
+  background: var(--dsw-alias-bg-layer-2, #fff); color: var(--dsw-alias-label-primary, #222);
+  box-shadow: var(--dsw-shadow-lv3, 0 8px 30px rgba(0,0,0,.22));
+  font-size: 13px;
+}
+.dsh-tw-note-recent[hidden] { display: none; }
+.dsh-tw-note-recent-item {
+  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
+  padding: 6px 8px; border-radius: 7px; cursor: pointer;
+}
+.dsh-tw-note-recent-item:hover { background: var(--dsw-alias-interactive-bg-hover, rgba(128,128,128,.12)); }
+.dsh-tw-note-recent-name { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dsh-tw-note-recent-meta { flex: none; font-size: 11px; color: var(--dsw-alias-label-dimmed, #999); }
+.dsh-tw-note-recent-muted { padding: 8px 10px; font-size: 12px; color: var(--dsw-alias-label-dimmed, #999); }
+.dsh-tw-note-recent-btn {
+  border: 1px solid var(--dsw-alias-border-l2, rgba(0,0,0,.18));
+  background: var(--dsw-alias-bg-layer-2, #fff); color: var(--dsw-alias-label-primary, #222);
+  font: inherit; font-size: 12px; padding: 6px 10px; border-radius: 8px; cursor: pointer;
+  transition: filter 120ms ease, transform 80ms ease;
+}
+.dsh-tw-note-recent-btn:hover { filter: brightness(.96); }
+.dsh-tw-note-recent-btn:active { transform: scale(.96); }
 `;
 function injectStyles() {
 	if (typeof document === "undefined") return;
@@ -570,7 +680,7 @@ const PANEL_HOST_SELECTOR = "[data-dsh-panel-host]";
 const APP_OVERLAY_Z_INDEX = 20;
 /** Safety re-measure cadence for shell layout changes CSS can't see. */
 const SYNC_INTERVAL_MS = 2e3;
-const STATUS_ENDPOINT$2 = "/dsh-tiddlywiki/status";
+const STATUS_ENDPOINT$3 = "/dsh-tiddlywiki/status";
 const RESTART_ENDPOINT$1 = "/dsh-tiddlywiki/restart";
 /**
 * The panel's z-index: below any dsh-better-sidebar host layer so its
@@ -595,7 +705,7 @@ function conversationColumn() {
 }
 async function fetchStatus$1() {
 	try {
-		const res = await fetch(STATUS_ENDPOINT$2, { signal: AbortSignal.timeout(8e3) });
+		const res = await fetch(STATUS_ENDPOINT$3, { signal: AbortSignal.timeout(8e3) });
 		if (!res.ok) return null;
 		return await res.json();
 	} catch {
@@ -618,9 +728,6 @@ function mountPanel(state) {
 	let iframe;
 	let frameArea;
 	let errorArea;
-	let chip;
-	let statusDot;
-	let statusFloater;
 	let refreshTimer;
 	let refreshAttempts = 0;
 	const build = () => {
@@ -641,45 +748,6 @@ function mountPanel(state) {
 		view.append(frameArea, errorArea);
 		return view;
 	};
-	/**
-	* Bottom-right floating status/reload buttons (same visual language as the
-	* quick-note toggle) — the top panel bar is gone, so TW's menubar reaches
-	* the very top of the panel and clears the host's top-right buttons. Mount
-	* is gated by `ui.showPanelStatus` (settings page toggle).
-	*/
-	const buildStatusFloater = () => {
-		const wrap = document.createElement("div");
-		wrap.className = "dsh-tw-panel-status";
-		const statusBtn = document.createElement("button");
-		statusBtn.type = "button";
-		statusBtn.className = "dsh-tw-panel-status-btn";
-		statusBtn.title = "刷新状态";
-		statusDot = document.createElement("span");
-		statusDot.className = "dsh-tw-status-dot";
-		statusDot.dataset.state = "unknown";
-		chip = document.createElement("span");
-		chip.className = "dsh-tw-panel-status-text";
-		chip.textContent = "—";
-		statusBtn.append(statusDot, chip);
-		statusBtn.addEventListener("click", () => {
-			doRefresh();
-		});
-		const reloadBtn = document.createElement("button");
-		reloadBtn.type = "button";
-		reloadBtn.className = "dsh-tw-panel-status-btn";
-		reloadBtn.textContent = "重载";
-		reloadBtn.title = "重载 TiddlyWiki 面板";
-		reloadBtn.addEventListener("click", () => {
-			if (iframe !== void 0 && !iframe.hidden) iframe.src = iframe.src;
-		});
-		wrap.append(statusBtn, reloadBtn);
-		document.body.append(wrap);
-		return wrap;
-	};
-	const setChip = (stateName, text) => {
-		if (statusDot !== void 0) statusDot.dataset.state = stateName;
-		if (chip !== void 0) chip.textContent = text;
-	};
 	/** Pin the overlay to the center column's current viewport rect. */
 	const syncRect = () => {
 		if (container === void 0 || columnEl === void 0) return;
@@ -762,18 +830,17 @@ function mountPanel(state) {
 		}
 		const payload = await fetchStatus$1();
 		if (payload === null) {
-			setChip("failed", "状态不可达");
 			showError("无法访问 /dsh-tiddlywiki/status");
 			return;
 		}
-		if (payload.status === "running" && typeof payload.url === "string") {
-			setChip("running", "在线");
+		if (payload.status === "running") {
 			refreshAttempts = 0;
-			showFrame(payload.url);
+			if (typeof payload.twProxy === "string") showFrame(new URL(payload.twProxy, window.location.origin).href);
+			else if (typeof payload.url === "string") showFrame(payload.url);
+			else showError("服务未返回编辑器地址");
 			return;
 		}
 		if (payload.status === "starting") {
-			setChip("starting", "启动中");
 			showStarting();
 			if (refreshAttempts < 30) {
 				refreshAttempts++;
@@ -783,7 +850,6 @@ function mountPanel(state) {
 			}
 			return;
 		}
-		setChip("failed", "离线");
 		refreshAttempts = 0;
 		showError(payload.error ?? `服务状态：${payload.status}`);
 	};
@@ -832,10 +898,10 @@ function mountPanel(state) {
 	const unsubscribe = state.subscribe(applyActive);
 	ensure();
 	applyActive();
-	(async () => {
-		if ((await fetchStatus$1())?.ui?.showPanelStatus === false) return;
-		statusFloater = buildStatusFloater();
-	})();
+	const onReloadRequest = () => {
+		if (iframe !== void 0 && !iframe.hidden) iframe.src = iframe.src;
+	};
+	document.addEventListener("dsh-tw-panel-reload", onReloadRequest);
 	return () => {
 		if (refreshTimer !== void 0) window.clearTimeout(refreshTimer);
 		window.clearInterval(syncInterval);
@@ -844,11 +910,11 @@ function mountPanel(state) {
 		resizeObserver.disconnect();
 		document.removeEventListener("click", onClickSidebarRow, true);
 		document.removeEventListener(ACTIVATE_EVENT, onOtherActivate);
+		document.removeEventListener("dsh-tw-panel-reload", onReloadRequest);
 		waitObserver.disconnect();
 		unsubscribe();
 		document.documentElement.removeAttribute(ACTIVE_ATTR);
 		container?.remove();
-		statusFloater?.remove();
 	};
 }
 //#endregion
@@ -26408,7 +26474,10 @@ function buildMarkdownEditor(opts = {}) {
 							return true;
 						}
 					}
-				])
+				]),
+				EditorView.updateListener.of((update) => {
+					if (update.docChanged) opts.onChange?.();
+				})
 			]
 		})
 	});
@@ -26442,39 +26511,66 @@ function buildMarkdownEditor(opts = {}) {
 //#endregion
 //#region src/client/note-widget.ts
 /**
-* Floating quick-note widget (design doc §12, D6/D7) — bottom-right, fixed,
-* collapsible, independent of any shell DOM. Lets the human jot drafts /
-* scratch notes while waiting for the AI or drafting the next prompt.
+* Floating quick-note card (design doc §12, D6/D7) — a bottom-right, fixed,
+* collapsible card for jotting drafts / scratch notes while waiting for the AI
+* or drafting the next prompt. In v0.5 the trigger moved into the "知识库" FAB
+* (knowledge-fab.ts); this module ONLY owns the card itself via
+* `createNoteWidget()` (lazy build — no DOM until first open).
+*
+* Features:
+* - CodeMirror 6 Markdown editor (see markdown-editor.ts), file upload + drag
+*   & drop, multi-tag chips with autocomplete (GET /dsh-tiddlywiki/tags).
+* - DRAFT PERSISTENCE: editor/title/tags auto-save to localStorage on a 500ms
+*   debounce; reopening restores the draft with a "丢弃" banner. A successful
+*   save / "在 TW 中编辑" clears it.
+* - RECENT PICKER: a 「最近」 button lists the newest notes (GET
+*   /dsh-tiddlywiki/recent); clicking one loads it into the editor (GET
+*   /dsh-tiddlywiki/get) to continue editing.
+* - Ctrl+Enter saves; 「✏️ 在 TW 中编辑」 saves and opens TW's native editor.
 *
 * Save posts to /dsh-tiddlywiki/note → an independent tiddler (title & tags
 * editable; defaults: timestamp title + config tag, usually "inbox").
 *
-* ui.showQuickNote config: the widget is mounted async and stays hidden (and
-* never appended) when the option is off, so the toggle button can be disabled
-* from the settings page without touching the shell.
-*
-* Tag editor: multi-select chips + autocomplete from the wiki's existing tags
-* (GET /dsh-tiddlywiki/tags). Enter/`,` commits the typed value; Backspace on
-* an empty field removes the last chip; the dropdown filters on typing.
-*
-* Markdown editing: a CodeMirror 6 editor (see markdown-editor.ts) with real
-* Lezer-based syntax highlighting (GFM: headings, lists, code, links, tables,
-* task lists, strikethrough…) plus undo/redo, wired into the same
-* `.dsh-tw-note-editor` surface the widget reads/writes.
-*
-* File upload: the body accepts files via the 📎 button or drag-and-drop;
-* each file is POSTed raw to /dsh-tiddlywiki/upload (saved under the wiki's
-* `files/` folder, git-tracked and served at `/files/<name>`) and a Markdown
-* image/link line is inserted at the caret.
-*
 * @module dsh-tiddlywiki/client/note-widget
 */
 const NOTE_ENDPOINT = "/dsh-tiddlywiki/note";
 const EDIT_ENDPOINT = "/dsh-tiddlywiki/edit";
-const STATUS_ENDPOINT$1 = "/dsh-tiddlywiki/status";
+const STATUS_ENDPOINT$2 = "/dsh-tiddlywiki/status";
 const TAGS_ENDPOINT = "/dsh-tiddlywiki/tags";
+const RECENT_ENDPOINT = "/dsh-tiddlywiki/recent";
+const GET_ENDPOINT = "/dsh-tiddlywiki/get";
 const UPLOAD_ENDPOINT = "/dsh-tiddlywiki/upload";
 const MAX_UPLOAD_BYTES = 64 * 1024 * 1024;
+/** localStorage key for the autosaved quick-note draft. */
+const DRAFT_KEY = "dsh-tw-note-draft-v1";
+/** Draft auto-save debounce. */
+const DRAFT_DEBOUNCE_MS = 500;
+function loadDraft() {
+	try {
+		const raw = localStorage.getItem(DRAFT_KEY);
+		if (raw === null) return null;
+		const parsed = JSON.parse(raw);
+		if (typeof parsed.text !== "string" || typeof parsed.title !== "string") return null;
+		return {
+			text: parsed.text,
+			title: parsed.title,
+			tags: Array.isArray(parsed.tags) ? parsed.tags.filter((t) => typeof t === "string") : [],
+			savedAt: typeof parsed.savedAt === "number" ? parsed.savedAt : 0
+		};
+	} catch {
+		return null;
+	}
+}
+function persistDraft(draft) {
+	try {
+		localStorage.setItem(DRAFT_KEY, JSON.stringify(draft));
+	} catch {}
+}
+function clearDraft() {
+	try {
+		localStorage.removeItem(DRAFT_KEY);
+	} catch {}
+}
 function pad$1(n) {
 	return n < 10 ? `0${n}` : String(n);
 }
@@ -26482,13 +26578,28 @@ function pad$1(n) {
 function timestampTitle(date = /* @__PURE__ */ new Date()) {
 	return `${date.getFullYear()}-${pad$1(date.getMonth() + 1)}-${pad$1(date.getDate())} ${pad$1(date.getHours())}:${pad$1(date.getMinutes())}`;
 }
+/** Compact Chinese relative time for the recent picker (e.g. "3小时前"). */
+function relativeTime(iso) {
+	if (iso === null) return "";
+	const ms = new Date(iso).getTime();
+	if (Number.isNaN(ms)) return "";
+	const diff = Date.now() - ms;
+	const min = Math.floor(diff / 6e4);
+	if (min < 1) return "刚刚";
+	if (min < 60) return `${min}分钟前`;
+	const hr = Math.floor(min / 60);
+	if (hr < 24) return `${hr}小时前`;
+	const day = Math.floor(hr / 24);
+	if (day < 30) return `${day}天前`;
+	return new Date(ms).toLocaleDateString("zh-CN");
+}
 async function fetchUiOptions() {
 	const fallback = {
 		showQuickNote: true,
 		defaultTag: "inbox"
 	};
 	try {
-		const res = await fetch(STATUS_ENDPOINT$1, { signal: AbortSignal.timeout(5e3) });
+		const res = await fetch(STATUS_ENDPOINT$2, { signal: AbortSignal.timeout(5e3) });
 		if (!res.ok) return fallback;
 		const payload = await res.json();
 		return {
@@ -26500,7 +26611,7 @@ async function fetchUiOptions() {
 	}
 }
 /** Multi-tag chip editor with autocomplete from the wiki's existing tags. */
-function buildTagEditor() {
+function buildTagEditor(opts = {}) {
 	const wrap = document.createElement("div");
 	wrap.className = "dsh-tw-note-tags";
 	const chipWrap = document.createElement("div");
@@ -26516,6 +26627,9 @@ function buildTagEditor() {
 	const hideSuggest = () => {
 		suggest.hidden = true;
 	};
+	const emit = () => {
+		opts.onChange?.();
+	};
 	const renderChips = () => {
 		chipWrap.replaceChildren();
 		for (const tag of chips) {
@@ -26532,6 +26646,7 @@ function buildTagEditor() {
 				if (i >= 0) {
 					chips.splice(i, 1);
 					renderChips();
+					emit();
 				}
 			});
 			chip.append(x);
@@ -26546,6 +26661,7 @@ function buildTagEditor() {
 		renderChips();
 		hideSuggest();
 		input.focus();
+		emit();
 	};
 	const commitInput = () => {
 		for (const raw of input.value.split(/\s+/)) addTag(raw);
@@ -26589,6 +26705,7 @@ function buildTagEditor() {
 		} else if (event.key === "Backspace" && input.value.length === 0 && chips.length > 0) {
 			chips.pop();
 			renderChips();
+			emit();
 		} else if (event.key === "Escape") hideSuggest();
 	});
 	document.addEventListener("click", (event) => {
@@ -26608,22 +26725,20 @@ function buildTagEditor() {
 					renderChips();
 				}
 			}
+		},
+		setTags: (tags) => {
+			chips.length = 0;
+			for (const tag of Array.isArray(tags) ? tags : []) {
+				const t = typeof tag === "string" ? tag.trim() : "";
+				if (t.length > 0 && !chips.includes(t)) chips.push(t);
+			}
+			input.value = "";
+			renderChips();
+			hideSuggest();
 		}
 	};
 }
 /**
-* Build the CodeMirror 6 Markdown editor for the quick-note widget. The editor
-* lives inside `.dsh-tw-note-editor`; the widget reads/writes through
-* getValue/setValue and inserts uploaded files at the caret via insertAtCaret.
-* Mod-Enter (save) is routed through `onSave`.
-*/
-function buildEditor(onSave) {
-	return buildMarkdownEditor({
-		placeholder: "写点东西… Markdown 高亮，可 📎/拖入文件\nCtrl+Enter 保存",
-		onSave
-	});
-}
-/**
 * Upload one file to the wiki (raw body, name in ?name=), then insert a
 * Markdown image/link line at the caret of the given editor.
 */
@@ -26652,240 +26767,421 @@ async function uploadInto(file, editor) {
 		toast(`上传失败：${err instanceof Error ? err.message : String(err)}`);
 	}
 }
-/** Build the whole widget DOM and wire it up (returns root + editor view). */
-function buildWidget() {
-	const root = document.createElement("div");
-	root.className = "dsh-tw-note";
-	const card = document.createElement("div");
-	card.className = "dsh-tw-note-card";
-	card.hidden = true;
-	const head = document.createElement("div");
-	head.className = "dsh-tw-note-head";
-	const label = document.createElement("span");
-	label.className = "dsh-tw-note-label";
-	label.textContent = "📝 快速笔记";
-	const closeBtn = document.createElement("button");
-	closeBtn.type = "button";
-	closeBtn.className = "dsh-tw-note-close";
-	closeBtn.title = "收起";
-	closeBtn.textContent = "✕";
-	head.append(label, closeBtn);
-	const fields = document.createElement("div");
-	fields.className = "dsh-tw-note-fields";
-	const titleInput = document.createElement("input");
-	titleInput.className = "dsh-tw-note-title";
-	titleInput.placeholder = "标题（默认时间戳）";
-	const tagEditor = buildTagEditor();
-	fields.append(titleInput, tagEditor.el);
-	let doSave;
-	const editor = buildEditor(() => {
-		doSave?.();
-	});
-	const uploadBtn = document.createElement("button");
-	uploadBtn.type = "button";
-	uploadBtn.className = "dsh-tw-note-upload";
-	uploadBtn.title = "上传文件到 wiki 并插入 Markdown 链接（也可直接拖入编辑器）";
-	uploadBtn.textContent = "📎 上传";
-	const fileInput = document.createElement("input");
-	fileInput.type = "file";
-	fileInput.multiple = true;
-	fileInput.hidden = true;
-	uploadBtn.addEventListener("click", () => {
-		fileInput.click();
-	});
-	fileInput.addEventListener("change", () => {
-		for (const file of Array.from(fileInput.files ?? [])) uploadInto(file, editor);
-		fileInput.value = "";
-	});
-	let dragDepth = 0;
-	editor.el.addEventListener("dragenter", (event) => {
-		event.preventDefault();
-		dragDepth++;
-		editor.el.classList.add("dsh-tw-note-drop");
-	});
-	editor.el.addEventListener("dragover", (event) => {
-		event.preventDefault();
-	});
-	editor.el.addEventListener("dragleave", (event) => {
-		event.preventDefault();
-		dragDepth = Math.max(0, dragDepth - 1);
-		if (dragDepth === 0) editor.el.classList.remove("dsh-tw-note-drop");
-	});
-	editor.el.addEventListener("drop", (event) => {
-		event.preventDefault();
-		dragDepth = 0;
-		editor.el.classList.remove("dsh-tw-note-drop");
-		const files = event.dataTransfer?.files;
-		if (files === void 0 || files.length === 0) return;
-		for (const file of Array.from(files)) uploadInto(file, editor);
-	});
-	const foot = document.createElement("div");
-	foot.className = "dsh-tw-note-foot";
-	const footLeft = document.createElement("div");
-	footLeft.className = "dsh-tw-note-foot-left";
-	const hint = document.createElement("span");
-	hint.className = "dsh-tw-note-hint";
-	hint.textContent = "Ctrl+Enter";
-	footLeft.append(uploadBtn, hint);
-	const footRight = document.createElement("div");
-	footRight.className = "dsh-tw-note-foot-right";
-	const edit = document.createElement("button");
-	edit.type = "button";
-	edit.className = "dsh-tw-note-edit";
-	edit.title = "保存并在 TiddlyWiki 原生编辑器中打开";
-	edit.textContent = "✏️ 在 TW 中编辑";
-	const save = document.createElement("button");
-	save.type = "button";
-	save.className = "dsh-tw-note-save";
-	save.textContent = "保存";
-	footRight.append(edit, save);
-	foot.append(footLeft, footRight);
-	card.append(head, fields, editor.el, foot);
-	const toggle = document.createElement("button");
-	toggle.type = "button";
-	toggle.className = "dsh-tw-note-toggle";
-	toggle.textContent = "📝 快速笔记";
-	root.append(card, toggle);
-	document.body.append(root);
-	let defaultTag = "inbox";
+/**
+* Create the quick-note card. Lazy: no DOM is created until the first
+* `open()`, so a hidden widget (`ui.showQuickNote` off, or never used) leaves
+* no side effects. Returns a handle the "知识库" FAB controls.
+*/
+function createNoteWidget() {
+	let ui;
+	let disposed = false;
 	let opened = false;
+	let defaultTag = "inbox";
+	let draftTimer;
+	let recentOpen = false;
 	const resetTitle = () => {
-		titleInput.value = timestampTitle();
+		if (ui !== void 0) ui.titleInput.value = timestampTitle();
 	};
-	const open = async () => {
-		card.hidden = false;
-		opened = true;
-		resetTitle();
-		editor.focus();
-		defaultTag = (await fetchUiOptions()).defaultTag;
-		tagEditor.setDefault(defaultTag);
+	/** Debounced draft auto-save (500ms after the last change). */
+	const scheduleDraft = () => {
+		if (disposed || !opened || ui === void 0) return;
+		if (draftTimer !== void 0) {
+			clearTimeout(draftTimer);
+			draftTimer = void 0;
+		}
+		draftTimer = window.setTimeout(() => {
+			draftTimer = void 0;
+			if (ui === void 0) return;
+			const text = ui.editor.getValue();
+			const title = ui.titleInput.value.trim();
+			if (text.trim().length === 0 && title.length === 0) {
+				clearDraft();
+				return;
+			}
+			persistDraft({
+				text,
+				title,
+				tags: ui.tagEditor.getTags(),
+				savedAt: Date.now()
+			});
+		}, DRAFT_DEBOUNCE_MS);
 	};
-	const close = () => {
-		card.hidden = true;
-		opened = false;
+	const hideDraftBanner = () => {
+		if (ui !== void 0) ui.draftBanner.hidden = true;
 	};
-	toggle.addEventListener("click", () => {
-		opened ? close() : open();
-	});
-	closeBtn.addEventListener("click", close);
-	doSave = async () => {
-		const text = editor.getValue().trim();
-		if (text.length === 0) {
-			toast("内容为空，未保存");
-			return;
-		}
-		save.disabled = true;
-		save.textContent = "保存中…";
+	const closeRecent = () => {
+		recentOpen = false;
+		if (ui !== void 0) ui.recentWrap.hidden = true;
+	};
+	/** Load a tiddler into the editor (recent picker click). */
+	const loadNote = async (title) => {
 		try {
-			const res = await fetch(NOTE_ENDPOINT, {
-				method: "POST",
-				headers: { "content-type": "application/json" },
-				body: JSON.stringify({
-					title: titleInput.value.trim(),
-					tags: tagEditor.getTags(),
-					text
-				}),
-				signal: AbortSignal.timeout(1e4)
-			});
+			const res = await fetch(`${GET_ENDPOINT}?title=${encodeURIComponent(title)}`, { signal: AbortSignal.timeout(1e4) });
 			const payload = await res.json().catch(() => null);
-			if (!res.ok || payload?.ok !== true) {
-				toast(`保存失败：${payload?.error ?? `HTTP ${res.status}`}`);
+			if (!res.ok || payload?.ok !== true || typeof payload.title !== "string") {
+				toast(`读取失败：${payload?.notFound === true ? "不存在" : payload?.error ?? `HTTP ${res.status}`}`);
 				return;
 			}
-			editor.setValue("");
-			resetTitle();
-			toast(`已保存「${payload.title ?? titleInput.value}」`);
-			close();
+			if (ui === void 0) return;
+			ui.editor.setValue(payload.text ?? "");
+			ui.titleInput.value = payload.title;
+			ui.tagEditor.setTags(payload.tags ?? []);
+			hideDraftBanner();
+			closeRecent();
+			toast(`已载入「${payload.title}」`);
+			ui.editor.focus();
 		} catch (err) {
-			toast(`保存失败：${err instanceof Error ? err.message : String(err)}`);
-		} finally {
-			save.disabled = false;
-			save.textContent = "保存";
+			toast(`读取失败：${err instanceof Error ? err.message : String(err)}`);
 		}
 	};
-	save.addEventListener("click", () => {
-		doSave?.();
-	});
-	/** Save (if non-empty) and open the tiddler in TW's native editor. */
-	const doEdit = async () => {
-		const title = titleInput.value.trim().length > 0 ? titleInput.value.trim() : timestampTitle();
-		const text = editor.getValue();
-		const tags = tagEditor.getTags();
-		edit.disabled = true;
-		edit.textContent = "打开中…";
-		try {
-			const res = await fetch(EDIT_ENDPOINT, {
-				method: "POST",
-				headers: { "content-type": "application/json" },
-				body: JSON.stringify({
-					title,
-					tags,
-					text
-				}),
-				signal: AbortSignal.timeout(1e4)
-			});
-			const payload = await res.json().catch(() => null);
-			if (!res.ok || payload?.ok !== true) {
-				toast(`打开失败：${payload?.error ?? `HTTP ${res.status}`}`);
-				return;
+	/** Toggle the recent-notes dropdown (fetches lazily each open). */
+	const toggleRecent = () => {
+		if (ui === void 0) return;
+		if (recentOpen) {
+			closeRecent();
+			return;
+		}
+		recentOpen = true;
+		ui.recentWrap.hidden = false;
+		ui.recentWrap.textContent = "";
+		const loading = document.createElement("div");
+		loading.className = "dsh-tw-note-recent-muted";
+		loading.textContent = "加载中…";
+		ui.recentWrap.append(loading);
+		(async () => {
+			try {
+				const payload = await (await fetch(`${RECENT_ENDPOINT}?limit=15`, { signal: AbortSignal.timeout(1e4) })).json().catch(() => null);
+				if (!recentOpen || ui === void 0) return;
+				ui.recentWrap.replaceChildren();
+				const items = payload?.ok === true ? payload.items ?? [] : [];
+				if (items.length === 0) {
+					const empty = document.createElement("div");
+					empty.className = "dsh-tw-note-recent-muted";
+					empty.textContent = payload?.ok === true ? "暂无笔记" : `加载失败：${payload?.error ?? "未知"}`;
+					ui.recentWrap.append(empty);
+					return;
+				}
+				for (const item of items) {
+					const row = document.createElement("div");
+					row.className = "dsh-tw-note-recent-item";
+					row.title = item.snippet || item.title;
+					const name = document.createElement("span");
+					name.className = "dsh-tw-note-recent-name";
+					name.textContent = item.title;
+					const meta = document.createElement("span");
+					meta.className = "dsh-tw-note-recent-meta";
+					const bits = [relativeTime(item.modified)];
+					if (item.tags.length > 0) bits.unshift(item.tags.slice(0, 3).join(","));
+					meta.textContent = bits.join(" · ");
+					row.append(name, meta);
+					row.addEventListener("click", () => {
+						loadNote(item.title);
+					});
+					ui.recentWrap.append(row);
+				}
+			} catch (err) {
+				if (!recentOpen || ui === void 0) return;
+				ui.recentWrap.replaceChildren();
+				const empty = document.createElement("div");
+				empty.className = "dsh-tw-note-recent-muted";
+				empty.textContent = `加载失败：${err instanceof Error ? err.message : String(err)}`;
+				ui.recentWrap.append(empty);
 			}
-			if (typeof payload.twUrl !== "string" || typeof payload.draftTitle !== "string") {
-				toast("打开失败：服务未返回编辑器地址");
+		})();
+	};
+	/** Build the whole card DOM once, then wire every interaction. */
+	const build = () => {
+		if (ui !== void 0) return;
+		const root = document.createElement("div");
+		root.className = "dsh-tw-note";
+		root.hidden = true;
+		const card = document.createElement("div");
+		card.className = "dsh-tw-note-card";
+		const head = document.createElement("div");
+		head.className = "dsh-tw-note-head";
+		const label = document.createElement("span");
+		label.className = "dsh-tw-note-label";
+		label.textContent = "📝 快速笔记";
+		const closeBtn = document.createElement("button");
+		closeBtn.type = "button";
+		closeBtn.className = "dsh-tw-note-close";
+		closeBtn.title = "收起";
+		closeBtn.textContent = "✕";
+		head.append(label, closeBtn);
+		const draftBanner = document.createElement("div");
+		draftBanner.className = "dsh-tw-note-draft";
+		draftBanner.hidden = true;
+		const bannerText = document.createElement("span");
+		bannerText.className = "dsh-tw-note-draft-text";
+		bannerText.textContent = "已恢复未保存草稿";
+		const discardBtn = document.createElement("button");
+		discardBtn.type = "button";
+		discardBtn.className = "dsh-tw-note-draft-discard";
+		discardBtn.textContent = "丢弃";
+		draftBanner.append(bannerText, discardBtn);
+		const fields = document.createElement("div");
+		fields.className = "dsh-tw-note-fields";
+		const titleInput = document.createElement("input");
+		titleInput.className = "dsh-tw-note-title";
+		titleInput.placeholder = "标题（默认时间戳）";
+		const tagEditor = buildTagEditor({ onChange: scheduleDraft });
+		fields.append(titleInput, tagEditor.el);
+		titleInput.addEventListener("input", scheduleDraft);
+		let doSave;
+		const editor = buildMarkdownEditor({
+			placeholder: "写点东西… Markdown 高亮，可 📎/拖入文件\nCtrl+Enter 保存",
+			onSave: () => {
+				doSave?.();
+			},
+			onChange: scheduleDraft
+		});
+		const uploadBtn = document.createElement("button");
+		uploadBtn.type = "button";
+		uploadBtn.className = "dsh-tw-note-upload";
+		uploadBtn.title = "上传文件到 wiki 并插入 Markdown 链接（也可直接拖入编辑器）";
+		uploadBtn.textContent = "📎 上传";
+		const fileInput = document.createElement("input");
+		fileInput.type = "file";
+		fileInput.multiple = true;
+		fileInput.hidden = true;
+		uploadBtn.addEventListener("click", () => {
+			fileInput.click();
+		});
+		fileInput.addEventListener("change", () => {
+			for (const file of Array.from(fileInput.files ?? [])) uploadInto(file, editor);
+			fileInput.value = "";
+		});
+		let dragDepth = 0;
+		editor.el.addEventListener("dragenter", (event) => {
+			event.preventDefault();
+			dragDepth++;
+			editor.el.classList.add("dsh-tw-note-drop");
+		});
+		editor.el.addEventListener("dragover", (event) => {
+			event.preventDefault();
+		});
+		editor.el.addEventListener("dragleave", (event) => {
+			event.preventDefault();
+			dragDepth = Math.max(0, dragDepth - 1);
+			if (dragDepth === 0) editor.el.classList.remove("dsh-tw-note-drop");
+		});
+		editor.el.addEventListener("drop", (event) => {
+			event.preventDefault();
+			dragDepth = 0;
+			editor.el.classList.remove("dsh-tw-note-drop");
+			const files = event.dataTransfer?.files;
+			if (files === void 0 || files.length === 0) return;
+			for (const file of Array.from(files)) uploadInto(file, editor);
+		});
+		const foot = document.createElement("div");
+		foot.className = "dsh-tw-note-foot";
+		const footLeft = document.createElement("div");
+		footLeft.className = "dsh-tw-note-foot-left";
+		const hint = document.createElement("span");
+		hint.className = "dsh-tw-note-hint";
+		hint.textContent = "Ctrl+Enter";
+		const recentBtn = document.createElement("button");
+		recentBtn.type = "button";
+		recentBtn.className = "dsh-tw-note-recent-btn";
+		recentBtn.title = "最近修改的笔记，点击载入继续编辑";
+		recentBtn.textContent = "🕘 最近";
+		recentBtn.addEventListener("click", toggleRecent);
+		footLeft.append(uploadBtn, recentBtn, hint);
+		const footRight = document.createElement("div");
+		footRight.className = "dsh-tw-note-foot-right";
+		const editBtn = document.createElement("button");
+		editBtn.type = "button";
+		editBtn.className = "dsh-tw-note-edit";
+		editBtn.title = "保存并在 TiddlyWiki 原生编辑器中打开";
+		editBtn.textContent = "✏️ 在 TW 中编辑";
+		const saveBtn = document.createElement("button");
+		saveBtn.type = "button";
+		saveBtn.className = "dsh-tw-note-save";
+		saveBtn.textContent = "保存";
+		footRight.append(editBtn, saveBtn);
+		foot.append(footLeft, footRight);
+		const recentWrap = document.createElement("div");
+		recentWrap.className = "dsh-tw-note-recent";
+		recentWrap.hidden = true;
+		card.append(head, draftBanner, fields, editor.el, foot);
+		root.append(card, recentWrap);
+		document.body.append(root);
+		ui = {
+			root,
+			card,
+			editor,
+			titleInput,
+			tagEditor,
+			saveBtn,
+			editBtn,
+			draftBanner,
+			recentBtn,
+			recentWrap
+		};
+		const close = () => {
+			opened = false;
+			root.hidden = true;
+			closeRecent();
+		};
+		const saveDone = () => {
+			clearDraft();
+			hideDraftBanner();
+			editor.setValue("");
+			titleInput.value = timestampTitle();
+			tagEditor.setTags([]);
+			close();
+		};
+		doSave = async () => {
+			const text = editor.getValue().trim();
+			if (text.length === 0) {
+				toast("内容为空，未保存");
 				return;
 			}
-			openEditorPopup(`${payload.twUrl}#${encodeURIComponent(payload.draftTitle)}`, payload.title ?? title);
-			toast(`已在弹出窗口打开「${payload.title ?? title}」编辑器`);
-		} catch (err) {
-			toast(`打开失败：${err instanceof Error ? err.message : String(err)}`);
-		} finally {
-			edit.disabled = false;
-			edit.textContent = "✏️ 在 TW 中编辑";
-		}
+			saveBtn.disabled = true;
+			saveBtn.textContent = "保存中…";
+			try {
+				const res = await fetch(NOTE_ENDPOINT, {
+					method: "POST",
+					headers: { "content-type": "application/json" },
+					body: JSON.stringify({
+						title: titleInput.value.trim(),
+						tags: tagEditor.getTags(),
+						text
+					}),
+					signal: AbortSignal.timeout(1e4)
+				});
+				const payload = await res.json().catch(() => null);
+				if (!res.ok || payload?.ok !== true) {
+					toast(`保存失败：${payload?.error ?? `HTTP ${res.status}`}`);
+					return;
+				}
+				saveDone();
+				toast(`已保存「${payload.title ?? titleInput.value}」`);
+			} catch (err) {
+				toast(`保存失败：${err instanceof Error ? err.message : String(err)}`);
+			} finally {
+				saveBtn.disabled = false;
+				saveBtn.textContent = "保存";
+			}
+		};
+		saveBtn.addEventListener("click", () => {
+			doSave?.();
+		});
+		/** Save (if non-empty) and open the tiddler in TW's native editor. */
+		const doEdit = async () => {
+			const title = titleInput.value.trim().length > 0 ? titleInput.value.trim() : timestampTitle();
+			const text = editor.getValue();
+			const tags = tagEditor.getTags();
+			editBtn.disabled = true;
+			editBtn.textContent = "打开中…";
+			try {
+				const res = await fetch(EDIT_ENDPOINT, {
+					method: "POST",
+					headers: { "content-type": "application/json" },
+					body: JSON.stringify({
+						title,
+						tags,
+						text
+					}),
+					signal: AbortSignal.timeout(1e4)
+				});
+				const payload = await res.json().catch(() => null);
+				if (!res.ok || payload?.ok !== true) {
+					toast(`打开失败：${payload?.error ?? `HTTP ${res.status}`}`);
+					return;
+				}
+				if (typeof payload.twUrl !== "string" || typeof payload.draftTitle !== "string") {
+					toast("打开失败：服务未返回编辑器地址");
+					return;
+				}
+				clearDraft();
+				hideDraftBanner();
+				openEditorPopup(`${new URL(payload.twUrl, location.origin).href}#${encodeURIComponent(payload.draftTitle)}`, payload.title ?? title);
+				toast(`已在弹出窗口打开「${payload.title ?? title}」编辑器`);
+			} catch (err) {
+				toast(`打开失败：${err instanceof Error ? err.message : String(err)}`);
+			} finally {
+				editBtn.disabled = false;
+				editBtn.textContent = "✏️ 在 TW 中编辑";
+			}
+		};
+		editBtn.addEventListener("click", () => {
+			doEdit();
+		});
+		closeBtn.addEventListener("click", close);
+		document.addEventListener("click", (event) => {
+			if (!opened) return;
+			const target = event.target;
+			if (root.contains(target)) return;
+			if (recentWrap.contains(target)) return;
+			close();
+		}, true);
+		discardBtn.addEventListener("click", () => {
+			clearDraft();
+			hideDraftBanner();
+			editor.setValue("");
+			titleInput.value = timestampTitle();
+			tagEditor.setTags([]);
+			toast("已丢弃草稿");
+		});
 	};
-	edit.addEventListener("click", () => {
-		doEdit();
-	});
 	return {
-		root,
-		editorView: editor.view
-	};
-}
-/**
-* Mount the floating quick-note widget. Fetches /status first: when
-* `ui.showQuickNote` is off the widget is never created (no DOM side effects).
-* Returns a disposer that removes it (and destroys the CodeMirror view).
-*/
-function mountNoteWidget() {
-	let disposed = false;
-	let root;
-	let editorView;
-	const disposer = () => {
-		disposed = true;
-		editorView?.destroy();
-		root?.remove();
-		document.querySelector(".dsh-tw-toast")?.remove();
+		async open() {
+			if (disposed) return;
+			build();
+			if (ui === void 0 || opened) return;
+			opened = true;
+			ui.root.hidden = false;
+			const draft = loadDraft();
+			if (draft !== null && (draft.text.trim().length > 0 || draft.title.trim().length > 0)) {
+				ui.editor.setValue(draft.text);
+				ui.titleInput.value = draft.title;
+				ui.tagEditor.setTags(draft.tags);
+				ui.draftBanner.hidden = false;
+			} else {
+				resetTitle();
+				defaultTag = (await fetchUiOptions()).defaultTag;
+				ui.tagEditor.setDefault(defaultTag);
+			}
+			ui.editor.focus();
+		},
+		close() {
+			if (ui === void 0) return;
+			opened = false;
+			ui.root.hidden = true;
+			closeRecent();
+		},
+		async toggle() {
+			if (opened) this.close();
+			else await this.open();
+		},
+		isOpen() {
+			return opened;
+		},
+		dispose() {
+			disposed = true;
+			if (draftTimer !== void 0) {
+				clearTimeout(draftTimer);
+				draftTimer = void 0;
+			}
+			ui?.editor.view.destroy();
+			ui?.root.remove();
+			document.querySelector(".dsh-tw-toast")?.remove();
+			ui = void 0;
+		}
 	};
-	(async () => {
-		const ui = await fetchUiOptions();
-		if (disposed || !ui.showQuickNote) return;
-		const widget = buildWidget();
-		root = widget.root;
-		editorView = widget.editorView;
-	})();
-	return disposer;
 }
 //#endregion
 //#region src/client/sync-button.ts
 /**
-* Floating "sync" button (bottom-right) — one click pulls + commits + pushes
-* the wiki git repository and reports the result, with a live status dot so
-* the human always sees whether the knowledge base is in sync.
+* Sync controller — the git pull→commit→push logic + live git status, decoupled
+* from any DOM. In v0.5 the visual (status dot, 同步 entry, syncing spinner)
+* lives in the "知识库" FAB (knowledge-fab.ts); this module only owns state,
+* polling and the one-click sync call.
 *
-* - honors `ui.showSyncButton`: the button is mounted async and never created
-*   when the option is off (settings page toggle);
 * - polls /dsh-tiddlywiki/status every 30s for the git state;
-* - clicking POSTs /dsh-tiddlywiki/sync (pull → commit → push) and toasts the
-*   outcome, then refreshes the dot immediately.
+* - `trigger()` POSTs /dsh-tiddlywiki/sync (pull → commit → push), returns the
+*   fresh state and notifies subscribers.
 *
 * Status dot mapping (git summary from /status):
 *   offline → gray   (no repo / service unreachable)
@@ -26893,13 +27189,11 @@ function mountNoteWidget() {
 *   behind  → red    (remote has commits we don't — pull will rebase)
 *   clean   → green  (worktree clean)
 *
-* @module dsh-tiddlywiki/client/sync-button
+* @module dsh-tiddlywiki/client/sync-controller
 */
-const STATUS_ENDPOINT = "/dsh-tiddlywiki/status";
+const STATUS_ENDPOINT$1 = "/dsh-tiddlywiki/status";
 const SYNC_ENDPOINT$1 = "/dsh-tiddlywiki/sync";
 const POLL_MS = 3e4;
-/** Inline sync icon (circular arrows, stroke-based, theme-colored). */
-const SYNC_ICON = "<svg viewBox=\"0 0 16 16\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M13 8a5 5 0 1 1-1.4-3.5\"/><path d=\"M13 2.5v3h-3\"/></svg>";
 function pad(n) {
 	return n < 10 ? `0${n}` : String(n);
 }
@@ -26909,83 +27203,83 @@ function clock(date) {
 }
 async function fetchStatus() {
 	try {
-		const res = await fetch(STATUS_ENDPOINT, { signal: AbortSignal.timeout(8e3) });
+		const res = await fetch(STATUS_ENDPOINT$1, { signal: AbortSignal.timeout(8e3) });
 		if (!res.ok) return null;
 		return await res.json();
 	} catch {
 		return null;
 	}
 }
+/** Map a git summary onto a SyncStateView. */
+function buildState(payload, lastSync) {
+	const git = payload?.git;
+	const bits = ["同步知识库"];
+	let state = "offline";
+	let label = "离线";
+	if (git === null || git === void 0 || git.exists !== true) bits.push("git 仓库不可用");
+	else {
+		bits.push(`分支 ${git.branch ?? "?"}`);
+		if (typeof git.lastCommit === "string") bits.push(git.lastCommit);
+		const behind = typeof git.behind === "number" ? git.behind : 0;
+		const ahead = typeof git.ahead === "number" ? git.ahead : 0;
+		if (ahead > 0) bits.push(`领先 ${ahead}`);
+		if (behind > 0) bits.push(`落后 ${behind}`);
+		if (git.dirty === true) {
+			state = "dirty";
+			label = "待提交";
+			bits.push(`有 ${git.dirtyFiles?.length ?? 0} 个未提交改动`);
+		} else if (behind > 0) {
+			state = "behind";
+			label = "可更新";
+		} else {
+			state = "clean";
+			label = "已同步";
+		}
+	}
+	if (lastSync !== void 0) bits.push(`上次同步 ${clock(lastSync)}`);
+	return {
+		state,
+		label,
+		tooltip: bits.join(" · "),
+		...lastSync !== void 0 ? { lastSync } : {}
+	};
+}
 /**
-* Mount the floating sync button. Fetches /status first: when
-* `ui.showSyncButton` is off the button is never created. Returns a disposer.
+* Create the sync controller: starts a 30s status poll immediately and exposes
+* `trigger()` for the FAB's 同步 entry. No DOM is created here.
 */
-function mountSyncButton() {
-	let disposed = false;
-	let root;
-	let dot;
-	let label;
+function createSyncController() {
+	let state = {
+		state: "offline",
+		label: "离线",
+		tooltip: "同步知识库"
+	};
 	let lastSync;
 	let timer;
-	const build = () => {
-		const btn = document.createElement("button");
-		btn.type = "button";
-		btn.className = "dsh-tw-sync";
-		btn.title = "同步知识库（pull → commit → push）";
-		const icon = document.createElement("span");
-		icon.className = "dsh-tw-sync-icon";
-		icon.innerHTML = SYNC_ICON;
-		dot = document.createElement("span");
-		dot.className = "dsh-tw-sync-dot";
-		dot.dataset.state = "offline";
-		label = document.createElement("span");
-		label.className = "dsh-tw-sync-label";
-		label.textContent = "同步";
-		btn.append(icon, label, dot);
-		btn.addEventListener("click", () => {
-			doSync();
-		});
-		document.body.append(btn);
-		return btn;
+	let syncing = false;
+	const listeners = /* @__PURE__ */ new Set();
+	const emit = () => {
+		for (const cb of [...listeners]) cb();
 	};
-	/** Map a git summary onto the dot + label + tooltip. */
 	const applyStatus = (payload) => {
-		if (root === void 0 || dot === void 0 || label === void 0) return;
-		const git = payload?.git;
-		const bits = ["同步知识库"];
-		let state = "offline";
-		let word = "离线";
-		if (git === null || git === void 0 || git.exists !== true) bits.push("git 仓库不可用");
-		else {
-			bits.push(`分支 ${git.branch ?? "?"}`);
-			if (typeof git.lastCommit === "string") bits.push(git.lastCommit);
-			const behind = typeof git.behind === "number" ? git.behind : 0;
-			const ahead = typeof git.ahead === "number" ? git.ahead : 0;
-			if (ahead > 0) bits.push(`领先 ${ahead}`);
-			if (behind > 0) bits.push(`落后 ${behind}`);
-			if (git.dirty === true) {
-				state = "dirty";
-				word = "待提交";
-				bits.push(`有 ${git.dirtyFiles?.length ?? 0} 个未提交改动`);
-			} else if (behind > 0) {
-				state = "behind";
-				word = "可更新";
-			} else {
-				state = "clean";
-				word = "已同步";
-			}
+		const next = buildState(payload, lastSync);
+		if (next.state !== state.state || next.tooltip !== state.tooltip) {
+			state = next;
+			emit();
 		}
-		if (lastSync !== void 0) bits.push(`上次同步 ${clock(lastSync)}`);
-		root.title = bits.join(" · ");
-		dot.dataset.state = state;
-		label.textContent = word;
+	};
+	const poll = async () => {
+		applyStatus(await fetchStatus());
 	};
 	const doSync = async () => {
-		if (root === void 0) return;
-		root.disabled = true;
-		root.classList.add("dsh-tw-sync-spin");
-		if (label !== void 0) label.textContent = "同步中…";
-		if (dot !== void 0) dot.dataset.state = "syncing";
+		if (syncing) return state;
+		syncing = true;
+		state = {
+			...state,
+			state: "syncing",
+			label: "同步中…"
+		};
+		emit();
 		try {
 			const res = await fetch(SYNC_ENDPOINT$1, {
 				method: "POST",
@@ -27003,29 +27297,249 @@ function mountSyncButton() {
 				}
 				toast(`同步完成：${payload.message ?? "OK"}${detail}`);
 			}
-			applyStatus(await fetchStatus());
+			await poll();
 		} catch (err) {
 			toast(`同步失败：${err instanceof Error ? err.message : String(err)}`);
 		} finally {
-			root.disabled = false;
-			root.classList.remove("dsh-tw-sync-spin");
+			syncing = false;
+			await poll();
 		}
+		return state;
 	};
-	const poll = async () => {
-		applyStatus(await fetchStatus());
+	poll();
+	timer = window.setInterval(() => {
+		poll();
+	}, POLL_MS);
+	return {
+		getState: () => state,
+		trigger: doSync,
+		subscribe(cb) {
+			listeners.add(cb);
+			return () => {
+				listeners.delete(cb);
+			};
+		},
+		dispose() {
+			if (timer !== void 0) {
+				clearInterval(timer);
+				timer = void 0;
+			}
+			listeners.clear();
+		}
+	};
+}
+//#endregion
+//#region src/client/knowledge-fab.ts
+const STATUS_ENDPOINT = "/dsh-tiddlywiki/status";
+/** Book icon (same visual family as the sidebar entry). */
+const BOOK_ICON = "<svg viewBox=\"0 0 16 16\" width=\"17\" height=\"17\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M4 2.5h8a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1z\"/><path d=\"M6 6h4M6 8.5h2.5\"/></svg>";
+async function fetchUiFlags() {
+	try {
+		const res = await fetch(STATUS_ENDPOINT, { signal: AbortSignal.timeout(5e3) });
+		if (!res.ok) return {
+			showQuickNote: true,
+			showPanelStatus: true,
+			showSyncButton: true
+		};
+		const p = await res.json();
+		return {
+			showQuickNote: p.ui?.showQuickNote !== false,
+			showPanelStatus: p.ui?.showPanelStatus !== false,
+			showSyncButton: p.ui?.showSyncButton !== false
+		};
+	} catch {
+		return {
+			showQuickNote: true,
+			showPanelStatus: true,
+			showSyncButton: true
+		};
+	}
+}
+/** Fetch the TW service health for the menu's status line. */
+async function fetchTwStatus() {
+	try {
+		const res = await fetch(STATUS_ENDPOINT, { signal: AbortSignal.timeout(8e3) });
+		if (!res.ok) return {
+			state: "failed",
+			text: "状态不可达"
+		};
+		const p = await res.json();
+		if (p.status === "running") return {
+			state: "running",
+			text: `TW 在线 · ${p.url ?? ""}`
+		};
+		if (p.status === "starting") return {
+			state: "starting",
+			text: "TW 启动中…"
+		};
+		return {
+			state: "failed",
+			text: p.error ?? `TW 状态：${p.status ?? "?"}`
+		};
+	} catch {
+		return {
+			state: "failed",
+			text: "状态不可达"
+		};
+	}
+}
+/**
+* Mount the knowledge FAB. Fetches /status first to read the ui.* flags; when
+* every entry is disabled the FAB is never created. Returns a disposer.
+*/
+function mountKnowledgeFab(state, note, sync) {
+	let disposed = false;
+	let root;
+	let fabBtn;
+	let dot;
+	let menu;
+	let twStatusEl;
+	let twDot;
+	let panelLabel;
+	let menuOpen = false;
+	let gitRowDot;
+	let gitRowText;
+	const closeMenu = () => {
+		menuOpen = false;
+		if (menu !== void 0) menu.hidden = true;
+	};
+	/** Refresh the git dot + tooltip from the controller (FAB dot + menu row). */
+	const renderDot = () => {
+		const s = sync.getState();
+		if (dot !== void 0) dot.dataset.state = s.state;
+		if (fabBtn !== void 0) fabBtn.title = `知识库 · ${s.tooltip}`;
+		if (gitRowDot !== void 0) gitRowDot.dataset.state = s.state;
+		if (gitRowText !== void 0) gitRowText.textContent = s.tooltip;
+	};
+	/** Refresh the TW service status line in the menu. */
+	const refreshTwStatus = async () => {
+		const info = await fetchTwStatus();
+		if (disposed) return;
+		if (twStatusEl !== void 0) twStatusEl.textContent = info.text;
+		if (twDot !== void 0) twDot.dataset.state = info.state;
+	};
+	const build = (flags) => {
+		if (disposed) return;
+		root = document.createElement("div");
+		root.className = "dsh-tw-fab-wrap";
+		menu = document.createElement("div");
+		menu.className = "dsh-tw-fab-menu";
+		menu.hidden = true;
+		if (flags.showPanelStatus) {
+			const twRow = document.createElement("div");
+			twRow.className = "dsh-tw-fab-status";
+			twDot = document.createElement("span");
+			twDot.className = "dsh-tw-fab-status-dot";
+			twDot.dataset.state = "unknown";
+			twStatusEl = document.createElement("span");
+			twStatusEl.className = "dsh-tw-fab-status-text";
+			twStatusEl.textContent = "TiddlyWiki 服务…";
+			twRow.append(twDot, twStatusEl);
+			menu.append(twRow);
+		}
+		if (flags.showSyncButton) {
+			const gitRow = document.createElement("div");
+			gitRow.className = "dsh-tw-fab-status";
+			gitRowDot = document.createElement("span");
+			gitRowDot.className = "dsh-tw-fab-status-dot";
+			gitRowDot.dataset.state = sync.getState().state;
+			gitRowText = document.createElement("span");
+			gitRowText.className = "dsh-tw-fab-status-text";
+			gitRowText.textContent = sync.getState().tooltip;
+			gitRow.append(gitRowDot, gitRowText);
+			menu.append(gitRow);
+		}
+		if (flags.showQuickNote) {
+			const item = document.createElement("button");
+			item.type = "button";
+			item.className = "dsh-tw-fab-item";
+			item.textContent = "📝 快速笔记";
+			item.addEventListener("click", () => {
+				closeMenu();
+				note.toggle();
+			});
+			menu.append(item);
+		}
+		if (flags.showPanelStatus) {
+			panelLabel = document.createElement("span");
+			panelLabel.textContent = "打开 TW 面板";
+			const item = document.createElement("button");
+			item.type = "button";
+			item.className = "dsh-tw-fab-item";
+			item.append(document.createTextNode("🖥 "), panelLabel);
+			item.addEventListener("click", () => {
+				closeMenu();
+				state.toggle();
+			});
+			menu.append(item);
+			const reload = document.createElement("button");
+			reload.type = "button";
+			reload.className = "dsh-tw-fab-item";
+			reload.textContent = "🔄 重载 TW 面板";
+			reload.addEventListener("click", () => {
+				closeMenu();
+				document.dispatchEvent(new CustomEvent("dsh-tw-panel-reload"));
+				refreshTwStatus();
+			});
+			menu.append(reload);
+		}
+		if (flags.showSyncButton) {
+			const item = document.createElement("button");
+			item.type = "button";
+			item.className = "dsh-tw-fab-item";
+			item.textContent = "🔁 同步";
+			item.addEventListener("click", () => {
+				closeMenu();
+				sync.trigger();
+			});
+			menu.append(item);
+		}
+		fabBtn = document.createElement("button");
+		fabBtn.type = "button";
+		fabBtn.className = "dsh-tw-fab";
+		fabBtn.setAttribute("aria-label", "TiddlyWiki 知识库");
+		const icon = document.createElement("span");
+		icon.className = "dsh-tw-fab-icon";
+		icon.innerHTML = BOOK_ICON;
+		dot = document.createElement("span");
+		dot.className = "dsh-tw-fab-dot";
+		dot.dataset.state = sync.getState().state;
+		fabBtn.append(icon, dot);
+		fabBtn.addEventListener("click", () => {
+			if (menu === void 0) return;
+			if (menuOpen) {
+				closeMenu();
+				return;
+			}
+			menuOpen = true;
+			menu.hidden = false;
+			renderDot();
+			refreshTwStatus();
+		});
+		root.append(menu, fabBtn);
+		document.body.append(root);
+		renderDot();
+		document.addEventListener("click", (event) => {
+			if (!menuOpen) return;
+			const target = event.target;
+			if (root !== void 0 && root.contains(target)) return;
+			closeMenu();
+		}, true);
 	};
+	const unsubPanel = state.subscribe(() => {
+		if (panelLabel !== void 0) panelLabel.textContent = state.isOpen() ? "收起 TW 面板" : "打开 TW 面板";
+	});
+	const unsubSync = sync.subscribe(renderDot);
 	(async () => {
-		const payload = await fetchStatus();
-		if (disposed || payload?.ui?.showSyncButton === false) return;
-		root = build();
-		applyStatus(payload);
-		timer = window.setInterval(() => {
-			poll();
-		}, POLL_MS);
+		const flags = await fetchUiFlags();
+		if (disposed) return;
+		if (!flags.showQuickNote && !flags.showPanelStatus && !flags.showSyncButton) return;
+		build(flags);
 	})();
 	return () => {
 		disposed = true;
-		if (timer !== void 0) window.clearInterval(timer);
+		unsubPanel();
+		unsubSync();
 		root?.remove();
 	};
 }
@@ -27228,9 +27742,9 @@ function renderConfigSection(body, config, refresh) {
 	numField("git.debounceMs", "自动 commit 防抖(ms)", typeof git.debounceMs === "number" ? git.debounceMs : 6e4);
 	textField("git.remote", "git 远端（空=仅本地）", typeof git.remote === "string" ? git.remote : "");
 	textField("git.branch", "git 分支", typeof git.branch === "string" ? git.branch : "main");
-	checkField("ui.showQuickNote", "显示「快速笔记」悬浮按钮", ui.showQuickNote !== false);
-	checkField("ui.showPanelStatus", "显示 TW 面板右下角「状态/重载」悬浮按钮", ui.showPanelStatus !== false);
-	checkField("ui.showSyncButton", "显示右下角「同步」悬浮按钮", ui.showSyncButton !== false);
+	checkField("ui.showQuickNote", "显示「知识库」按钮里的「快速笔记」入口", ui.showQuickNote !== false);
+	checkField("ui.showPanelStatus", "显示「知识库」按钮里的 TW 面板/重载入口与状态行", ui.showPanelStatus !== false);
+	checkField("ui.showSyncButton", "显示「知识库」按钮里的「同步」入口与 git 状态点", ui.showSyncButton !== false);
 	const save = make("button", "dsh-tw-settings-btn dsh-tw-settings-primary", "保存配置");
 	save.type = "button";
 	save.addEventListener("click", () => {
@@ -27464,10 +27978,13 @@ function apply(ctx) {
 		const state = new PanelState();
 		const disposers = [];
 		try {
+			const note = createNoteWidget();
+			const sync = createSyncController();
+			disposers.push(() => note.dispose());
+			disposers.push(() => sync.dispose());
 			disposers.push(mountSidebarEntry(state));
 			disposers.push(mountPanel(state));
-			disposers.push(mountNoteWidget());
-			disposers.push(mountSyncButton());
+			disposers.push(mountKnowledgeFab(state, note, sync));
 			disposers.push(disposeEditorPopup);
 		} catch (error) {
 			console.error("[dsh-tiddlywiki] mount failed:", error);