@musnows/scriverse 1.0.7 → 1.0.9

package/dist/public/app.js

@@ -1,9 +1,11 @@
 import { buildRelationshipGraph, createGalaxyRenderer, normalizeGalaxyFrameRate, normalizeGalaxyMotionMode, renderRelationshipMindMap } from "/relationship-graph.js?v=20260817-relationship-canvas-scale-v1&feature=galaxy-motion-mode-v3&feature=galaxy-edge-label-threshold-v1";
 import { formatDateTime, normalizeParagraphSpacing } from "/text-formatting.js?v=20260713-saved-at-seconds";
 import { countProseWords } from "/text-count.js?v=20260906-chapter-word-count-consistency-v1";
-import { renderMarkdown } from "/markdown.js?v=20260830-adjacent-blockquotes-v1";
+import { renderMarkdown } from "/markdown.js?v=20260912-stream-render-v2";
+import { createStreamingMarkdownRenderer } from "/stream-markdown.js?v=20260912-stream-render-v2";
+import { createAiRenderScheduler } from "/ai-render-scheduler.js?v=20260912-stream-render-v2";
 import { createImWorkspace } from "/im.js?v=20260904-im-judge-outcomes-v106";
-import { findAiMention, listAiMentionOptions, mergeAiReferenceScope, userMessageMentionNames } from "/ai-mentions.js?v=20260811-user-message-mentions-v1";
+import { findAiMention, listAiMentionOptions, mergeAiReferenceScope } from "/ai-mentions.js?v=20260811-user-message-mentions-v1";
 import { applyAiSkillCommand, findAiSkillCommand, listAiSkillOptions } from "/ai-skill-menu.js?v=20260830-ai-skill-slash-menu-v1";
 import {
   emptyRoleplayScenePin,
@@ -32,11 +34,11 @@ import { MIN_MODEL_CONTEXT_WINDOW, MODEL_PURPOSE_OPTIONS, MODEL_THINKING_EFFORT_
 import { connectivityConfigurationSavedToast, connectivityTestErrorToast, connectivityTestResultToast } from "/ai-connectivity-test.js?v=20260822-private-ai-endpoint-hint-v1";
 import { shouldSendAiPrompt } from "/ai-prompt-keyboard.js?v=20260713-enter-to-send";
 import { estimateAiMessageTokens, formatAiMessageMeta } from "/ai-message-meta.js?v=20260814-ai-model-lock-v1";
-import { createStreamTypewriter, createStreamTypewriterSpeedController } from "/stream-typewriter.js?v=20260906-background-stream-v2";
+import { createStreamTypewriter, createStreamTypewriterSpeedController } from "/stream-typewriter.js?v=20260912-stream-render-v2";
 import { assertAiStreamCompleted, readAiEventStream } from "/ai-stream-protocol.js?v=20260812-ai-stream-complete-v1";
 import { buildUsageCalendar, formatCacheHitRate, formatEstimatedCost, formatTokenCount, usageCalendarYears } from "/ai-usage.js?v=20260830-ai-usage-year-v1";
 import { formatAiMessageTime } from "/ai-message-time.js?v=20260801-month-day-time";
-import { formatAiContextUsagePercent, formatAiContextUsageTooltip, mergeAiContextUsage, normalizeAiContextTokenDistribution, resolveAiContextUsage } from "/ai-context-meter.js?v=20260828-context-output-usage-v1";
+import { attachAiContextCacheHitPercent, formatAiContextPopoverDescription, formatAiContextUsageTooltip, mergeAiContextUsage, normalizeAiContextTokenDistribution, resolveAiContextUsage } from "/ai-context-meter.js?v=20260911-context-cache-hit-v1";
 import { isPhoneClient } from "/phone-client.js?v=20260819-phone-client-v1";
 import { formatAiToolCallResult } from "/ai-tool-call.js?v=20260801-ai-tool-result-chars-v1";
 import {
@@ -2324,6 +2326,148 @@ function aiReferenceKindLabel(reference) {
   return ({ character: "角色", setting: "设定", chapter: "章节", "context-settings": "能力" })[reference.kind] ?? "引用";
 }
 
+function escapeAiReferenceXmlText(value) {
+  return String(value ?? "").replaceAll("&", "&amp;").replaceAll("<", "&lt;");
+}
+
+function escapeAiReferenceXmlAttribute(value) {
+  return escapeAiReferenceXmlText(value).replaceAll('"', "&quot;");
+}
+
+function unescapeAiReferenceXmlText(value) {
+  return String(value ?? "").replaceAll("&quot;", '"').replaceAll("&lt;", "<").replaceAll("&amp;", "&");
+}
+
+function serializeAiReference(reference) {
+  return `<ai_reference kind="${escapeAiReferenceXmlAttribute(reference.kind)}" id="${escapeAiReferenceXmlAttribute(reference.id)}">${escapeAiReferenceXmlText(reference.name)}</ai_reference>`;
+}
+
+function parseAiReferenceMarkup(value) {
+  const references = [];
+  const pattern = /<ai_reference kind="(character|setting|chapter|context-settings)" id="([^"]+)">([\s\S]*?)<\/ai_reference>/gu;
+  let text = "";
+  let cursor = 0;
+  for (const match of String(value ?? "").matchAll(pattern)) {
+    const index = match.index ?? 0;
+    const reference = {
+      kind: match[1],
+      id: unescapeAiReferenceXmlText(match[2]),
+      name: unescapeAiReferenceXmlText(match[3])
+    };
+    const marker = `\uE000ai-reference-${references.length}\uE001`;
+    text += `${String(value).slice(cursor, index)}${marker}`;
+    references.push({ ...reference, marker });
+    cursor = index + match[0].length;
+  }
+  return { text: `${text}${String(value ?? "").slice(cursor)}`, references };
+}
+
+function aiReferenceByKey(kind, referenceId) {
+  return state.aiReferences.find((reference) => reference.kind === kind && String(reference.id) === String(referenceId)) ?? null;
+}
+
+function aiPromptMarkupFromNode(node, root = node) {
+  if (node.nodeType === Node.TEXT_NODE) return node.textContent ?? "";
+  if (!(node instanceof Element)) return "";
+  if (node.matches("[data-ai-reference-key]")) {
+    const [kind, ...idParts] = String(node.dataset.aiReferenceKey ?? "").split(":");
+    const reference = aiReferenceByKey(kind, idParts.join(":"));
+    return reference ? serializeAiReference(reference) : "";
+  }
+  if (node.tagName === "BR") return "\n";
+  const text = [...node.childNodes].map((child) => aiPromptMarkupFromNode(child, root)).join("");
+  return node !== root && ["DIV", "P"].includes(node.tagName) ? `${text}\n` : text;
+}
+
+function aiPromptMarkup() {
+  return aiPromptMarkupFromNode($("#ai-prompt")).replace(/\n$/u, "");
+}
+
+function setAiPromptMarkup(value) {
+  const prompt = $("#ai-prompt");
+  const { text, references } = parseAiReferenceMarkup(value);
+  prompt.replaceChildren();
+  let cursor = 0;
+  for (const reference of references) {
+    const markerIndex = text.indexOf(reference.marker, cursor);
+    if (markerIndex < 0) continue;
+    if (markerIndex > cursor) prompt.append(document.createTextNode(text.slice(cursor, markerIndex)));
+    const currentReference = aiReferenceByKey(reference.kind, reference.id);
+    if (currentReference) prompt.append(createAiReferenceChip(currentReference));
+    else prompt.append(document.createTextNode(reference.name));
+    cursor = markerIndex + reference.marker.length;
+  }
+  if (cursor < text.length) prompt.append(document.createTextNode(text.slice(cursor)));
+  renderAiReferences();
+}
+
+function aiMessageReferenceReadable(reference) {
+  const module = ({
+    character: "characters",
+    setting: "settings",
+    chapter: "prose",
+    "context-settings": "settings"
+  })[reference.kind];
+  return !module || canReadModule(module);
+}
+
+function createInlineUserMessageReference(reference) {
+  const bubble = document.createElement("span");
+  const kind = aiReferenceKindLabel(reference);
+  const name = aiMessageReferenceReadable(reference) && reference.name.trim()
+    ? reference.name.trim()
+    : "已隐藏引用";
+  bubble.className = "user-message-mention user-message-inline-mention";
+  bubble.textContent = `${kind} · ${name}`;
+  bubble.title = `${kind}：${name}`;
+  bubble.setAttribute("aria-label", `${kind}：${name}`);
+  return bubble;
+}
+
+function replaceAiReferenceMarkers(host, references) {
+  if (!host || references.length === 0) return;
+  const markers = new Map(references.map((reference) => [reference.marker, reference]));
+  const textNodes = [];
+  const walker = document.createTreeWalker(host, NodeFilter.SHOW_TEXT);
+  while (walker.nextNode()) textNodes.push(walker.currentNode);
+  for (const textNode of textNodes) {
+    const value = textNode.textContent ?? "";
+    const matches = [...markers.keys()].filter((marker) => value.includes(marker));
+    if (matches.length === 0) continue;
+    const fragment = document.createDocumentFragment();
+    let cursor = 0;
+    while (cursor < value.length) {
+      const match = [...markers.keys()]
+        .map((marker) => ({ marker, index: value.indexOf(marker, cursor) }))
+        .filter((item) => item.index >= 0)
+        .sort((left, right) => left.index - right.index)[0];
+      if (!match) {
+        fragment.append(document.createTextNode(value.slice(cursor)));
+        break;
+      }
+      if (match.index > cursor) fragment.append(document.createTextNode(value.slice(cursor, match.index)));
+      fragment.append(createInlineUserMessageReference(markers.get(match.marker)));
+      cursor = match.index + match.marker.length;
+    }
+    textNode.replaceWith(fragment);
+  }
+}
+
+function userMessageMentionEntries(ids, items) {
+  if (!Array.isArray(ids) || !Array.isArray(items)) return [];
+  const names = new Map(items.map((item) => [String(item?.id ?? ""), String(item?.name ?? "").trim()]));
+  const seen = new Set();
+  const entries = [];
+  for (const id of ids) {
+    const value = String(id ?? "");
+    if (!value || seen.has(value)) continue;
+    seen.add(value);
+    const name = names.get(value);
+    if (name) entries.push({ id: value, name });
+  }
+  return entries;
+}
+
 function createAiReferenceChip(reference) {
   const chip = document.createElement("span");
   chip.className = "ai-prompt-reference";
@@ -2397,7 +2541,7 @@ function createAiChatTabState(input = {}) {
     roleplayUserCharacter: input.roleplayUserCharacter ?? null,
     citations: input.citations ?? [],
     references: input.references ?? [],
-    composer: input.composer ?? { text: "", citations: [], references: [], images: [], semanticSnapshot: null, sceneDirection: "", scenePin: emptyRoleplayScenePin() },
+    composer: input.composer ?? { text: "", markup: "", citations: [], references: [], images: [], semanticSnapshot: null, sceneDirection: "", scenePin: emptyRoleplayScenePin() },
     contextUsage: input.contextUsage ?? null,
     contextWarning: input.contextWarning === true,
     lastMessageAt: input.lastMessageAt ?? null,
@@ -2437,6 +2581,7 @@ function setAiChatTabComposerSnapshot(tab, snapshot) {
   tab.references = snapshot.references.map((reference) => ({ ...reference }));
   tab.composer = {
     text: snapshot.text,
+    markup: snapshot.markup,
     citations: tab.citations.map((citation) => ({ ...citation })),
     references: tab.references.map((reference) => ({ ...reference })),
     images: normalizeAiChatImageAttachments(snapshot.images),
@@ -2449,6 +2594,7 @@ function setAiChatTabComposerSnapshot(tab, snapshot) {
 function clearAiChatTabComposer(tab) {
   setAiChatTabComposerSnapshot(tab, {
     text: "",
+    markup: "",
     citations: [],
     references: [],
     images: [],
@@ -2475,7 +2621,7 @@ function applyAiChatTabState(tab) {
   const selectedModelId = tab.modelId ?? tab.selectedModelId;
   if (selectedModelId && state.models.some((model) => model.id === selectedModelId)) $("#ai-model").value = selectedModelId;
   syncAiModelPicker();
-  setAiPromptText(tab.composer.text);
+  setAiPromptMarkup(tab.composer.markup ?? tab.composer.text);
   restoreAiSceneComposer(tab.composer);
   renderAiCitations();
   renderAiSemanticInjection();
@@ -2688,6 +2834,7 @@ function activateAiChatTab(tabId, { persistCurrent = true, force = false } = {})
     feed.id = feed === tab.feed ? "ai-feed" : `ai-chat-panel-${feed.dataset.aiTabId}`;
   }
   tab.feed.classList.remove("hidden");
+  aiStreamRenders.refresh();
   applyAiChatTabState(tab);
   renderAiChatTabs();
   return tab;
@@ -2703,6 +2850,7 @@ function closeAiChatTab(tabId) {
   }
   const { active } = aiChatTabManager.close(tab.id);
   tab.feed.remove();
+  aiStreamRenders.refresh();
   if (!wasActive) {
     renderAiChatTabs();
     return;
@@ -3087,6 +3235,42 @@ const aiFeedScrollFrames = new WeakMap();
 const aiFeedAutoScrollStates = new WeakMap();
 const aiFeedScrollBindings = new WeakSet();
 const aiProcessScrollFrames = new WeakMap();
+const aiProcessRenderStates = new WeakMap();
+const aiMarkdownRenderers = new WeakMap();
+function aiStreamTargetVisible(target) {
+  target = target.element ?? target;
+  const feed = target.closest(".ai-feed");
+  const app = $("#app");
+  return document.visibilityState !== "hidden" && Boolean(feed?.isConnected)
+    && !feed.classList.contains("hidden") && !app.classList.contains("shelf-mode")
+    && (!app.classList.contains("ai-panel-collapsed") || app.classList.contains("ai-workspace-mode"));
+}
+const aiStreamRenders = createAiRenderScheduler({
+  isVisible: aiStreamTargetVisible,
+  isConnected: (target) => (target.element ?? target).isConnected
+});
+document.addEventListener("visibilitychange", () => aiStreamRenders.refresh());
+// 只监听面板显隐，不观察正文或消息内容，避免渲染自身触发新的刷新。
+const aiPanelVisibilityObserver = new MutationObserver(() => aiStreamRenders.refresh());
+aiPanelVisibilityObserver.observe($("#app"), { attributes: true, attributeFilter: ["class"] });
+
+function updateAiMarkdown(body, content) {
+  let render = aiMarkdownRenderers.get(body);
+  if (!render) {
+    const target = { element: body };
+    render = createStreamingMarkdownRenderer(body, {
+      enqueue: (callback) => queueMicrotask(() => aiStreamRenders.enqueue(target, callback)),
+      onRender: () => {
+        const message = body.closest(".assistant-message");
+        if (message?.classList.contains("is-streaming")) scrollAiProcessStepsToBottom(message);
+        const feed = body.closest(".ai-feed");
+        if (feed) scrollAiFeedToBottom(feed);
+      }
+    });
+    aiMarkdownRenderers.set(body, render);
+  }
+  return render(content);
+}
 const AI_FEED_BOTTOM_THRESHOLD_PX = 24;
 let markdownTableMenuTarget = null;
 let markdownTableMenuTrigger = null;
@@ -3153,9 +3337,8 @@ function scrollAiFeedToBottom(feed = $("#ai-feed"), { force = false } = {}) {
   bindAiFeedAutoScroll(feed);
   if (force) aiFeedAutoScrollStates.set(feed, true);
   if (!aiFeedAutoScrollStates.get(feed)) return;
-  feed.scrollTop = feed.scrollHeight;
   const currentFrame = aiFeedScrollFrames.get(feed);
-  if (currentFrame !== undefined) window.cancelAnimationFrame(currentFrame);
+  if (currentFrame !== undefined || !aiStreamTargetVisible(feed)) return;
   const nextFrame = window.requestAnimationFrame(() => {
     feed.scrollTop = feed.scrollHeight;
     aiFeedScrollFrames.delete(feed);
@@ -3169,9 +3352,8 @@ function scrollAiProcessStepsToBottom(message) {
       body.scrollTop = body.scrollHeight;
     });
   };
-  scroll();
   const currentFrame = aiProcessScrollFrames.get(message);
-  if (currentFrame !== undefined) window.cancelAnimationFrame(currentFrame);
+  if (currentFrame !== undefined || !aiStreamTargetVisible(message)) return;
   const nextFrame = window.requestAnimationFrame(() => {
     scroll();
     aiProcessScrollFrames.delete(message);
@@ -3724,74 +3906,80 @@ function shouldRenderAiProcessStep(step) {
 }
 
 function renderAiProcessSteps(message, steps, completed, durationMs = null, visibleContents = null) {
-  const previousDetails = message.querySelector(".ai-process-details");
-  const previousScrollStates = new Map();
-  previousDetails?.querySelectorAll(".ai-process-step[data-ai-process-step-id]").forEach((section) => {
-    const body = section.querySelector(".ai-process-step-body");
-    if (!body) return;
-    previousScrollStates.set(section.dataset.aiProcessStepId, {
-      scrollTop: body.scrollTop,
-      nearBottom: body.scrollHeight - body.scrollTop - body.clientHeight < 24
-    });
-  });
-  previousDetails?.remove();
+  const cached = aiProcessRenderStates.get(message);
   const renderableSteps = (Array.isArray(steps) ? steps : []).filter(shouldRenderAiProcessStep);
-  if (!renderableSteps.length) return;
-  const details = document.createElement("details");
+  if (!renderableSteps.length) {
+    cached?.details.remove();
+    aiProcessRenderStates.delete(message);
+    return;
+  }
+  const details = cached?.details ?? document.createElement("details");
   details.className = "ai-process-details";
   // 存在待确认/待回答的交互卡片时保持展开，避免审批入口在历史消息中被折叠。
   details.open = !completed || steps.some((step) => step?.type === "tool" && isInteractiveToolPending(step.toolCall));
-  const summary = document.createElement("summary");
-  const title = document.createElement("span");
+  const summary = cached?.summary ?? document.createElement("summary");
+  const title = cached?.title ?? document.createElement("span");
   title.textContent = completed ? "思考与执行过程" : "正在思考与执行";
-  const status = document.createElement("small");
+  const status = cached?.status ?? document.createElement("small");
   const duration = durationMs === null || durationMs === undefined ? "" : formatAiProcessDuration(durationMs);
   status.textContent = `${renderableSteps.length} 个步骤${duration ? ` · 耗时 ${duration}` : ""}`;
-  summary.append(title, status);
-  const list = document.createElement("div");
+  if (!cached) summary.append(title, status);
+  const list = cached?.list ?? document.createElement("div");
   list.className = "ai-process-list";
-  for (const step of renderableSteps) {
+  const entries = new Map();
+  const nextNodes = [];
+  for (const [index, step] of renderableSteps.entries()) {
+    const key = `${step.type}:${String(step.id ?? index)}`;
+    const previous = cached?.entries.get(key);
     if (step?.type === "context_compaction") {
-      list.append(createAiContextCompactionDivider({
+      const divider = previous?.node ?? createAiContextCompactionDivider({
         kind: "tool",
         ariaLabel: `第 ${Number(step.round) || 1} 轮已压缩上下文`,
         title: `已将 ${Number(step.sourceMessageCount) || 0} 条工具上下文压缩为摘要`
-      }));
+      });
+      entries.set(key, { node: divider });
+      nextNodes.push(divider);
       continue;
     }
     if (step?.type === "tool" && step.toolCall) {
+      if (previous?.value === step.toolCall) {
+        entries.set(key, previous);
+        nextNodes.push(previous.node);
+        continue;
+      }
       const tool = document.createElement("section");
       tool.className = "ai-process-step ai-process-tool-step";
       const label = document.createElement("small");
       label.textContent = `第 ${Number(step.round) || 1} 轮 · 工具调用`;
       tool.append(label, createAiToolCallButton(step.toolCall));
-      list.append(tool);
+      entries.set(key, { node: tool, value: step.toolCall });
+      nextNodes.push(tool);
       continue;
     }
-    const section = document.createElement("section");
+    const section = previous?.node ?? document.createElement("section");
     section.className = `ai-process-step ai-process-${step.type}-step`;
     section.dataset.aiProcessStepId = `${step.type}:${String(step.id ?? step.round ?? "")}`;
-    const label = document.createElement("small");
+    const label = previous?.label ?? document.createElement("small");
     label.textContent = `第 ${Number(step.round) || 1} 轮 · ${step.type === "thinking" ? "Thinking" : "中间输出"}`;
-    const body = document.createElement("div");
+    const body = previous?.body ?? document.createElement("div");
     body.className = "message-body ai-process-step-body";
     const content = visibleContents?.has(step) ? visibleContents.get(step) : step.content;
-    body.innerHTML = renderMarkdown(content);
-    section.append(label, body);
-    list.append(section);
-  }
-  details.append(summary, list);
-  list.querySelectorAll(".ai-process-step[data-ai-process-step-id]").forEach((section) => {
-    const scrollState = previousScrollStates.get(section.dataset.aiProcessStepId);
-    const body = section.querySelector(".ai-process-step-body");
-    if (!scrollState || !body) return;
-    body.scrollTop = scrollState.nearBottom
-      ? body.scrollHeight
-      : Math.min(scrollState.scrollTop, body.scrollHeight);
-  });
-  const body = message.querySelector(".message-body");
-  if (body) body.before(details);
-  else message.append(details);
+    updateAiMarkdown(body, content);
+    if (!previous) section.append(label, body);
+    entries.set(key, { node: section, label, body });
+    nextNodes.push(section);
+  }
+  if (!cached) details.append(summary, list);
+  nextNodes.forEach((node, index) => {
+    if (list.children[index] !== node) list.insertBefore(node, list.children[index] ?? null);
+  });
+  while (list.children.length > nextNodes.length) list.lastElementChild.remove();
+  if (!cached) {
+    const body = message.querySelector(".message-body");
+    if (body) body.before(details);
+    else message.append(details);
+  }
+  aiProcessRenderStates.set(message, { details, summary, title, status, list, entries, completed });
   if (!completed) scrollAiProcessStepsToBottom(message);
 }
 
@@ -4964,11 +5152,14 @@ function aiModelSupportsImageInput() {
 function syncAiImageAttachmentControl() {
   const button = $("#ai-attachment-button");
   if (!button) return;
-  const enabled = aiModelSupportsImageInput();
-  button.classList.toggle("hidden", !enabled);
+  const model = activeAiModel();
+  const enabled = model?.multimodalEnabled === true;
   button.disabled = !enabled || aiInteractionBusy();
-  button.setAttribute("aria-hidden", String(!enabled));
-  button.title = enabled ? "添加图片附件" : "当前模型不支持图片输入";
+  button.title = enabled
+    ? "添加图片附件"
+    : model
+      ? "当前模型不支持图片输入"
+      : "选择多模态模型后可添加图片附件";
 }
 
 function renderAiImageAttachments() {
@@ -5089,6 +5280,7 @@ function clearAiPromptComposer({ collapseScenePanel = false } = {}) {
 function captureAiPromptComposer() {
   return {
     text: aiPromptText(),
+    markup: aiPromptMarkup(),
     citations: state.aiCitations.map((citation) => ({ ...citation })),
     references: state.aiReferences.map((reference) => ({ ...reference })),
     images: normalizeAiChatImageAttachments(state.aiImageAttachments),
@@ -5103,7 +5295,7 @@ function restoreAiPromptComposer(snapshot) {
   state.aiReferences = snapshot.references.map((reference) => ({ ...reference }));
   state.aiImageAttachments = normalizeAiChatImageAttachments(snapshot.images);
   state.aiSemanticSnapshot = snapshot.semanticSnapshot ? structuredClone(snapshot.semanticSnapshot) : null;
-  setAiPromptText(snapshot.text);
+  setAiPromptMarkup(snapshot.markup ?? snapshot.text);
   restoreAiSceneComposer(snapshot);
   renderAiCitations();
   renderAiImageAttachments();
@@ -9108,6 +9300,7 @@ function openChapterTypeMenu(chapterId, clientX, clientY) {
   menu.querySelector("strong").textContent = `操作“${chapter.title}”`;
   menu.querySelectorAll("[data-chapter-type], [data-delete-chapter]").forEach((button) => button.classList.toggle("hidden", !canManageChapter));
   menu.querySelector("[data-add-chapter-ai-reference]")?.classList.toggle("hidden", !canAddAiReference);
+  menu.querySelector("#chapter-type-ai-reference-separator")?.classList.toggle("hidden", !(canManageChapter && canAddAiReference));
   menu.querySelectorAll("[data-chapter-type]").forEach((button) => {
     button.classList.toggle("active", button.dataset.chapterType === (chapter.chapterType || "正文"));
     button.setAttribute("aria-checked", String(button.classList.contains("active")));
@@ -14633,10 +14826,7 @@ function renderAiContextDistribution(usage) {
   const popover = $("#ai-context-popover");
   const host = $("#ai-context-distribution");
   const distribution = normalizeAiContextTokenDistribution(usage);
-  const contextWindow = distribution.contextWindow.toLocaleString("zh-CN");
-  $("#ai-context-popover-description").textContent = usage
-    ? `已占用 ${distribution.occupiedTokens.toLocaleString("zh-CN")} / ${contextWindow} tok · ${formatAiContextUsagePercent(distribution.occupiedTokens, distribution.contextWindow)}`
-    : "选择可用模型后显示当前上下文用量";
+  $("#ai-context-popover-description").textContent = formatAiContextPopoverDescription(usage);
   host.replaceChildren(...distribution.items.map((item) => {
     const row = document.createElement("div");
     row.className = "ai-context-distribution-row";
@@ -14678,13 +14868,11 @@ function setAiContextMeter(usage, allowShrink = true) {
     : mergeAiContextUsage(latestAiContextUsage, usage, false);
   latestAiContextUsage = displayUsage;
   const meter = $("#ai-context-meter");
-  const value = meter.querySelector("b");
   const distribution = renderAiContextDistribution(displayUsage);
   if (!displayUsage) {
     meter.classList.add("is-empty");
     meter.classList.remove("is-warning", "is-danger");
     meter.style.setProperty("--context-usage", "0");
-    value.textContent = "—";
     const tooltip = formatAiContextUsageTooltip(null);
     meter.dataset.tooltip = tooltip;
     meter.setAttribute("aria-label", tooltip);
@@ -14697,7 +14885,6 @@ function setAiContextMeter(usage, allowShrink = true) {
   meter.classList.toggle("is-warning", percent >= 70 && percent < 90);
   meter.classList.toggle("is-danger", percent >= 90);
   meter.style.setProperty("--context-usage", String(percent));
-  value.textContent = formatAiContextUsagePercent(distribution.occupiedTokens, distribution.contextWindow);
   const tooltip = formatAiContextUsageTooltip(displayUsage);
   meter.dataset.tooltip = tooltip;
   meter.setAttribute("aria-label", `当前上下文用量：${tooltip}`);
@@ -18227,6 +18414,7 @@ async function sendAiWithOptions({ ignoreContextWarning = false, retry = null }
   const requestComposerSnapshot = retry
     ? {
       text: retry.prompt,
+      markup: retry.prompt,
       citations: retry.citations ?? [],
       references: [],
       images: retry.images ?? [],
@@ -18234,14 +18422,15 @@ async function sendAiWithOptions({ ignoreContextWarning = false, retry = null }
       scenePin: captureAiScenePin()
     }
     : composerSnapshot;
-  const instruction = requestComposerSnapshot.text.trim();
+  const instruction = String(requestComposerSnapshot.markup ?? requestComposerSnapshot.text).trim();
+  const instructionText = String(requestComposerSnapshot.text ?? "").trim();
   const sceneDirection = $("#ai-task").value === "roleplay"
     ? String(requestComposerSnapshot.sceneDirection ?? "").trim()
     : "";
   const scenePin = $("#ai-task").value === "roleplay"
     ? normalizeRoleplayScenePin(requestComposerSnapshot.scenePin)
     : emptyRoleplayScenePin();
-  if (!instruction && !sceneDirection) {
+  if (!instructionText && !sceneDirection) {
     return toast($("#ai-task").value === "roleplay" ? "请输入台词或场景旁白" : "请输入指令", "error");
   }
   if ($("#ai-task").value === "roleplay" && !state.aiRoleplayCharacter) return toast("请先选择角色卡", "error");
@@ -18295,7 +18484,6 @@ async function sendAiWithOptions({ ignoreContextWarning = false, retry = null }
     let assistantMessage;
     let assistantMetadata = {};
     let persistedStreamMessage = null;
-    let writingSuggestion = null;
     const streamed = await streamChat(requestHolder, aiRetryStreamRequestBody({
       instruction,
       ...(sceneDirection ? { sceneDirection } : {}),
@@ -18312,7 +18500,6 @@ async function sendAiWithOptions({ ignoreContextWarning = false, retry = null }
     assistantContent = streamed.content;
     assistantMessage = streamed.message;
     assistantMetadata = streamed.metadata;
-    writingSuggestion = streamed.writingSuggestion;
     persistedStreamMessage = streamed.messageId ? { id: streamed.messageId, createdAt: streamed.createdAt } : null;
     applyAiConversationTitle(streamed.conversationTitle, streamedRequest.conversationId);
     try {
@@ -18342,7 +18529,6 @@ async function sendAiWithOptions({ ignoreContextWarning = false, retry = null }
           attachMessageIdentity(assistantMessage, persistedAssistantMessage.id);
         }
       }
-      if (writingSuggestion && assistantMessage) attachWritingSuggestion(assistantMessage, writingSuggestion, { tab });
     } catch (error) {
       if (isAiRequestCancellation(error, requestHolder.snapshot) || !aiRequestTargetsCurrentState(requestHolder.snapshot)) throw error;
       setAiChatTabStatus(tab, "error");
@@ -18494,11 +18680,15 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
   };
   const typewriter = createStreamTypewriter({
     speedController: streamSpeedController,
+    shouldAnimate: () => aiStreamTargetVisible(feed),
     onRender: (text, progress) => {
       if (!aiRequestTargetsCurrentState(requestHolder.snapshot) || !mountAssistantMessage()) return;
-      content.innerHTML = renderMarkdown(text);
-      renderAiStreamingCharacterProgress(meta, progress.visibleCharacters);
-      scrollAiFeedToBottom(feed);
+      aiStreamRenders.enqueue(content, () => {
+        if (!aiRequestTargetsCurrentState(requestHolder.snapshot) && message.classList.contains("is-streaming")) return;
+        updateAiMarkdown(content, text);
+        if (message.classList.contains("is-streaming")) renderAiStreamingCharacterProgress(meta, progress.visibleCharacters);
+        scrollAiFeedToBottom(feed);
+      });
     }
   });
   let streamedText = "";
@@ -18509,7 +18699,6 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
   let persistedMessageId = null;
   let persistedMessageCreatedAt = null;
   let conversationTitle = null;
-  let writingSuggestion = null;
   let question = null;
   let persistedUserMessage = null;
   let contextAction = "ready";
@@ -18522,7 +18711,10 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
   const processStepVisibleContents = new Map();
   const renderStreamingProcessSteps = (completed, durationMs = elapsedProcessTime()) => {
     if (!aiRequestTargetsCurrentState(requestHolder.snapshot)) return;
-    renderAiProcessSteps(message, processSteps, completed, durationMs, processStepVisibleContents);
+    aiStreamRenders.enqueue(message, () => {
+      renderAiProcessSteps(message, processSteps, completed, durationMs, processStepVisibleContents);
+      scrollAiFeedToBottom(feed);
+    });
   };
   const processStepTypewriter = (step) => {
     const existing = processStepTypewriters.get(step);
@@ -18530,6 +18722,7 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
     processStepVisibleContents.set(step, "");
     const typewriter = createStreamTypewriter({
       speedController: streamSpeedController,
+      shouldAnimate: () => aiStreamTargetVisible(feed),
       onRender: (text) => {
         if (!aiRequestTargetsCurrentState(requestHolder.snapshot)) return;
         processStepVisibleContents.set(step, text);
@@ -18684,15 +18877,8 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
         persistedMessageId = typeof payload.messageId === "string" ? payload.messageId : null;
         persistedMessageCreatedAt = typeof payload.messageCreatedAt === "string" ? payload.messageCreatedAt : null;
         conversationTitle = typeof payload.conversationTitle === "string" ? payload.conversationTitle : null;
-        writingSuggestion = payload.writingSuggestion && typeof payload.writingSuggestion === "object"
-          ? payload.writingSuggestion
-          : null;
-        const writingSuggestionFailed = writingSuggestion?.guard?.status === "failed"
-          || writingSuggestion?.toolCalls?.some((toolCall) => toolCall.status === "failed")
-          || writingSuggestion?.processSteps?.some((step) => step?.toolCall?.status === "failed");
-        if (writingSuggestionFailed) setAiChatTabStatus(tab, "error");
         const announcedCompaction = contextAction === "compacted" || streamContextCompacted;
-        setAiChatTabContextUsage(tab, payload.contextUsage, announcedCompaction);
+        setAiChatTabContextUsage(tab, attachAiContextCacheHitPercent(payload.contextUsage, payload.cacheHitPercent), announcedCompaction);
         await Promise.all([typewriter.finish(), finishProcessStepTypewriters()]);
         assertAiRequestCurrent(requestHolder.snapshot);
         message.classList.remove("is-streaming");
@@ -18710,12 +18896,8 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
           toolCalls,
           processSteps,
           processDurationMs,
-          ...(writingSuggestion ? {
-            activeSkills: [writingSuggestion.taskType === "continue" ? "continue-writing" : "polish-writing"],
-            writingSuggestionId: writingSuggestion.id
-          } : {})
         };
-        renderAiProcessSteps(message, processSteps, true, processDurationMs);
+        renderStreamingProcessSteps(true, processDurationMs);
         meta.textContent = formatAiMessageMeta(payload.model?.displayName, payload.outputTokens, payload.cacheHitPercent, "", processDurationMs);
         attachAssistantCopyAction(message, streamedText);
         scrollAiFeedToBottom(feed);
@@ -18731,7 +18913,7 @@ async function streamChat(requestHolder, body, idempotencyKey, { endpoint = null
     assertAiRequestCurrent(requestHolder.snapshot);
     if (streamError) throw streamError;
     assertAiStreamCompleted(streamCompleted);
-    return { action: warningOnly ? "warn" : contextAction, content: streamedText, message, metadata: generatedMetadata, messageId: persistedMessageId, createdAt: persistedMessageCreatedAt, conversationTitle, writingSuggestion, userMessage: persistedUserMessage, question };
+    return { action: warningOnly ? "warn" : contextAction, content: streamedText, message, metadata: generatedMetadata, messageId: persistedMessageId, createdAt: persistedMessageCreatedAt, conversationTitle, userMessage: persistedUserMessage, question };
   } catch (error) {
     const streamFailure = error instanceof Error ? error : new Error(String(error ?? "AI 流式调用失败"));
     const interruptionCode = typeof streamFailure.code === "string" ? streamFailure.code.slice(0, 100) : "AI_STREAM_FAILED";
@@ -18821,10 +19003,14 @@ function appendMessage(role, text, citations = [], createdAt = null, metadata =
   if (errorCode) message.dataset.errorCode = errorCode;
   if (isFailure && typeof metadata?.pendingQuestionId === "string") message.dataset.pendingQuestionId = metadata.pendingQuestionId;
   const parsedUserTurn = role === "user" ? parseRoleplayUserTurn(text) : null;
+  const userMessageContent = parsedUserTurn?.hasMarkup ? parsedUserTurn.userMessage : text;
+  const inlineReferences = role === "user" ? parseAiReferenceMarkup(userMessageContent).references : [];
+  const renderedUserMessage = role === "user" ? parseAiReferenceMarkup(userMessageContent).text : userMessageContent;
   const messageBody = isFailure
     ? `<p class="ai-error-text">${esc(text)}</p>${aiToolCallSettingsLinkMarkup(text)}`
-    : renderMarkdown(parsedUserTurn?.hasMarkup ? parsedUserTurn.userMessage : text);
+    : renderMarkdown(renderedUserMessage);
   message.innerHTML = `<div class="message-body">${messageBody}</div>`;
+  if (role === "user") replaceAiReferenceMarkers(message.querySelector(".message-body"), inlineReferences);
   message.querySelector("[data-ai-tool-call-settings-link]")?.addEventListener("click", (event) => {
     event.preventDefault();
     openAiToolCallSettings().catch((error) => toast(`打开 AI 设置失败：${error.message}`, "error"));
@@ -18863,16 +19049,19 @@ function appendMessage(role, text, citations = [], createdAt = null, metadata =
   }))) ?? [];
   const settingReferences = state.settings.map((setting) => ({ id: setting.id, name: setting.title }));
   const contextSettingReferences = [{ id: "include-setting-info", name: "注入上下文设定" }];
+  const inlineReferenceKeys = new Set(inlineReferences.map((reference) => aiReferenceKey(reference)));
   const mentionGroups = role === "user"
     ? [
-      ["角色", metadata?.mentionCharacterIds, state.characters],
-      ["种族", metadata?.mentionRaceIds, state.races],
-      ["组织", metadata?.mentionOrganizationIds, state.organizations],
-      ["设定", metadata?.mentionSettingIds, settingReferences],
-      ["章节", metadata?.mentionChapterIds, chapterReferences],
-      ["能力", metadata?.mentionContextSettingIds, contextSettingReferences]
+      ["character", "角色", metadata?.mentionCharacterIds, state.characters],
+      ["race", "种族", metadata?.mentionRaceIds, state.races],
+      ["organization", "组织", metadata?.mentionOrganizationIds, state.organizations],
+      ["setting", "设定", metadata?.mentionSettingIds, settingReferences],
+      ["chapter", "章节", metadata?.mentionChapterIds, chapterReferences],
+      ["context-settings", "能力", metadata?.mentionContextSettingIds, contextSettingReferences]
     ]
-      .flatMap(([kind, ids, items]) => userMessageMentionNames(ids, items).map((name) => ({ kind, name })))
+      .flatMap(([referenceKind, kind, ids, items]) => userMessageMentionEntries(ids, items)
+        .filter((reference) => !inlineReferenceKeys.has(`${referenceKind}:${reference.id}`))
+        .map((reference) => ({ kind, name: reference.name })))
     : [];
   if (mentionGroups.length) {
     const references = document.createElement("div");
@@ -18953,109 +19142,10 @@ function appendMessage(role, text, citations = [], createdAt = null, metadata =
   if (isFailure) renderMessageCardActions(message);
   attachMessageIdentity(message, messageId);
   feed.append(message);
-  const writingSuggestionId = role === "assistant" && typeof metadata?.writingSuggestionId === "string"
-    ? metadata.writingSuggestionId
-    : "";
-  if (writingSuggestionId && !isFailure && !isInterrupted) {
-    api(`/api/suggestions/${encodeURIComponent(writingSuggestionId)}`)
-      .then((suggestion) => attachWritingSuggestion(message, suggestion, { tab }))
-      .catch(() => undefined);
-  }
   scrollAiFeedToBottom(feed);
   return message;
 }
 
-function continuationGuardMarkup(guard) {
-  if (!guard) return "";
-  const issues = Array.isArray(guard.issues) ? guard.issues : [];
-  const failure = typeof guard.failure === "string" && guard.failure.trim()
-    ? guard.failure.trim()
-    : "无法完成检查，请谨慎采纳";
-  return `<section class="guard-card ${esc(guard.status)}" data-testid="continuation-guard"><strong>${guard.status === "clear" ? "一致性守卫：未发现冲突" : guard.status === "warning" ? `一致性守卫：发现 ${issues.length} 项风险` : "一致性守卫：检查失败"}</strong>${guard.status === "failed" ? `<details class="guard-failure-details"><summary>查看失败原因</summary><p>${esc(failure)}</p></details>` : issues.map((issue) => `<p><b>${esc(levelLabel(issue.severity))} · ${esc(reviewItemTypeLabel(issue.type))}</b> ${esc(issue.title)}${issue.description ? `：${esc(issue.description)}` : ""}</p>`).join("")}</section>`;
-}
-
-async function applyAcceptedWritingSuggestion(message, suggestion) {
-  if (state.work?.id === suggestion.workId && state.chapter?.id === suggestion.chapterId
-    && (state.dirty || chapterSaveInFlight || chapterSaveGuardInFlight)) {
-    throw new Error("当前章节有未保存修改或正在保存，请先完成保存，再重新生成正文建议");
-  }
-  const result = await api(`/api/suggestions/${encodeURIComponent(suggestion.id)}/accept`, { method: "POST", body: {} });
-  const workId = result.chapter.workId;
-  if (state.work?.id === workId && state.chapter?.id === result.chapter.id
-    && !state.dirty && !chapterSaveInFlight && !chapterSaveGuardInFlight) {
-    cancelChapterAutoSave();
-    state.chapter = result.chapter;
-    resetChapterDraftLineIds(state.chapter);
-    lastSavedChapterSnapshot = { chapterId: state.chapter.id, title: state.chapter.title, content: state.chapter.content };
-    $("#chapter-title").value = state.chapter.title;
-    $("#chapter-content").value = state.chapter.content;
-    scheduleChapterLineNumbers();
-    updateChapterStats();
-  }
-  if (state.work?.id === workId) {
-    const work = await api(`/api/works/${workId}`);
-    if (state.work?.id === workId) {
-      state.work = work;
-      renderTree();
-    }
-  }
-  message.querySelector("[data-writing-suggestion-actions]").innerHTML = "<span>已采纳并生成新版本</span>";
-  toast("AI 建议已采纳，正文已生成新版本");
-}
-
-function attachWritingSuggestion(message, suggestion, options = {}) {
-  if (!suggestion || suggestion.action === "note" || !suggestion.id) return message;
-  const suggestionId = String(suggestion.id);
-  if (message.dataset.writingSuggestionId === suggestionId) return message;
-  message.dataset.writingSuggestionId = suggestionId;
-  message.querySelector("[data-writing-suggestion-ui]")?.remove();
-  const heading = message.querySelector(".message-heading > span");
-  if (heading) heading.textContent = "助手建议";
-  const host = document.createElement("div");
-  host.dataset.writingSuggestionUi = "";
-  host.className = "writing-suggestion-ui";
-  host.innerHTML = `${continuationGuardMarkup(suggestion.guard)}<div class="message-actions" data-writing-suggestion-actions></div>`;
-  const actions = host.querySelector("[data-writing-suggestion-actions]");
-  if (suggestion.status === "accepted") {
-    actions.innerHTML = "<span>已采纳并生成新版本</span>";
-  } else if (suggestion.status === "rejected") {
-    actions.innerHTML = "<span>已拒绝</span>";
-  } else {
-    actions.innerHTML = '<button type="button" data-action="accept">采纳到正文</button><button type="button" data-action="reject">拒绝</button>';
-    actions.querySelector('[data-action="accept"]').addEventListener("click", async () => {
-      try {
-        await applyAcceptedWritingSuggestion(message, suggestion);
-      } catch (error) {
-        toast(error.message, "error");
-      }
-    });
-    actions.querySelector('[data-action="reject"]').addEventListener("click", async () => {
-      try {
-        await api(`/api/suggestions/${encodeURIComponent(suggestion.id)}/reject`, { method: "POST", body: {} });
-        actions.innerHTML = "<span>已拒绝</span>";
-      } catch (error) {
-        toast(error.message, "error");
-      }
-    });
-  }
-  message.append(host);
-  const tab = options.tab ?? activeAiChatTab();
-  scrollAiFeedToBottom(options.feed ?? tab?.feed ?? $("#ai-feed"));
-  return message;
-}
-
-function appendSuggestion(suggestion, createdAt = null, messageId = null, options = {}) {
-  const tab = options.tab ?? activeAiChatTab();
-  const feed = options.feed ?? tab?.feed ?? $("#ai-feed");
-  const message = appendMessage("assistant", suggestion.content, [], createdAt, {
-    modelDisplayName: suggestion.model?.displayName,
-    outputTokens: suggestion.outputTokens,
-    cacheHitPercent: suggestion.cacheHitPercent,
-    processDurationMs: suggestion.processDurationMs
-  }, messageId, { tab, feed });
-  return attachWritingSuggestion(message, suggestion, { tab, feed });
-}
-
 function chapterVersionCompareOption(version) {
   return `<option value="version:${Number(version.versionNo)}">v${Number(version.versionNo)} · ${esc(chapterVersionSourceLabel(version.source))}</option>`;
 }