minecodex 2.0.4 → 2.0.5

package/features/images/src/library-prompt-page.mjs

@@ -1,4 +1,4 @@
-// 仅增强原生 Library 图片详情；不创建第二个图库或侧栏入口。
+// 原生 Library 图片详情的提示词增强；Image Gen 由同功能的独立安装器承载。
 const PANEL_ID = "minecodex-library-prompt";
 const zh = () => (document.documentElement.lang || navigator.language || "en").toLowerCase().startsWith("zh");
 const label = (en, cn) => zh() ? cn : en;
@@ -7,7 +7,8 @@ const libraryApi=createLibraryApi();
 let scheduled = false;
 let candidate = null;
 
-const libraryImage=createLibraryViewerAdapter(config.codex).read;
+const libraryViewer=createLibraryViewerAdapter(config.codex,{readViewer:header=>localImageSource?.readViewer(header)});
+const libraryImage=libraryViewer.read;
 function element(tag, className, text) {
   const node = document.createElement(tag);
   node.className = className;
@@ -26,79 +27,128 @@ function copyGlyph(copied = false) {
 }
 
 function closePanel(record, restoreFocus = false) {
-  record.request?.abort();
-  record.request = null;
   record.panel.hidden = true;
-  record.button.setAttribute("aria-expanded", "false");
+
   if (restoreFocus && record.button.isConnected) record.button.focus();
 }
 
 function showPrompt(record) {
   record.panel.hidden = false;
-  record.button.setAttribute("aria-expanded", "true");
+
   record.close.focus();
 }
 
 async function resolvePrompt(file, request) {
-  if (!file.origination_thread_id || !file.origination_message_id) return null;
   request.signal.throwIfAborted();
-  const conversation = await libraryApi.conversation(file.origination_thread_id,AbortSignal.any([signal,request.signal,AbortSignal.timeout(25_000)]));
-  return promptFromConversation(file, conversation);
+  if(file.kind === "local") return config.requestHostAction("local-image-source",{operation:"prompt",id:file.id});
+  if(!file.origination_thread_id || !file.origination_message_id)return null;
+  const conversation=await libraryApi.conversation(file.origination_thread_id,AbortSignal.any([signal,request.signal,AbortSignal.timeout(25_000)]));
+  return promptFromConversation(file,conversation);
 }
 
 function unmount() {
   if (!mounted) return;
   closePanel(mounted);
   clearTimeout(mounted.copyTimer);
-  mounted.button.remove();
+  mounted.menuItem?.remove();
+  mounted.menuCleanup?.();
   mounted.panel.remove();
   mounted = null;
 }
 
+function syncMenu(record) {
+  const anchor = libraryViewer.promptMenu(record.file);
+  if (record.menuItem?.isConnected && record.menuItem.parentElement === anchor?.original.parentElement) return;
+  record.menuItem?.remove();
+  record.menuCleanup?.();
+  record.menuItem = null;
+  record.menuCleanup = null;
+  if (!anchor) return;
+  const {menu,original} = anchor;
+  const item = element("div", original.className);
+  item.setAttribute("role", "menuitem");
+  item.tabIndex = -1;
+  item.dataset.minecodexLibraryPrompt = "menuitem";
+  const row = original.firstElementChild.cloneNode(true);
+  row.querySelector(".truncate").textContent = label("View prompts", "查看提示词");
+  // 使用项目现有 Prompts 图形，保留原生菜单的紧凑／标准图标布局。
+  const glyph = document.querySelector('[aria-label="Prompts"] svg');
+  if (glyph) for (const svg of row.querySelectorAll("svg")) {
+    const icon = glyph.cloneNode(true);
+    icon.setAttribute("width", svg.getAttribute("width"));
+    icon.setAttribute("height", svg.getAttribute("height"));
+    svg.replaceWith(icon);
+  }
+  item.append(row);
+  original.before(item);
+  record.menuItem = item;
+  const open = event => {
+    event.preventDefault();
+    event.stopPropagation();
+    menu.addEventListener("focusScope.autoFocusOnUnmount", event => {
+      event.preventDefault();
+      if (mounted?.identity === record.identity) mounted.close.focus();
+    }, {once:true});
+    // 原生菜单在 document capture 处理 Escape；阻止它再冒泡关闭图片视口。
+    const stopEscape = event => event.stopPropagation();
+    menu.addEventListener("keydown", stopEscape, {once:true});
+    menu.dispatchEvent(new KeyboardEvent("keydown", {key:"Escape",bubbles:true,cancelable:true}));
+    menu.removeEventListener("keydown", stopEscape);
+    setTimeout(() => {
+      // 原生关闭菜单可能重建工具栏；把打开意图交给同一图片的新实例。
+      if (mounted?.identity === record.identity) showPrompt(mounted);
+    }, 0);
+  };
+  item.addEventListener("click", open);
+  item.addEventListener("pointermove", () => item.focus());
+  const keyboard = event => {
+    if (event.target === item && ["Enter", " "].includes(event.key)) return open(event);
+    if (!["ArrowUp", "ArrowDown"].includes(event.key)) return;
+    const items = [...menu.querySelectorAll('[role="menuitem"]')];
+    const index = items.indexOf(document.activeElement);
+    const next = items[(index + (event.key === "ArrowDown" ? 1 : -1) + items.length) % items.length];
+    // 仅补上未注册到原生 collection 的注入项，其他按键仍交给原生菜单。
+    if (index >= 0 && (document.activeElement === item || next === item)) {
+      event.preventDefault();event.stopImmediatePropagation();next.focus();
+    }
+  };
+  menu.addEventListener("keydown", keyboard, true);
+  record.menuCleanup = () => menu.removeEventListener("keydown", keyboard, true);
+}
+
 async function scan() {
   scheduled = false;
   if (signal.aborted) return;
   const header = [...document.querySelectorAll('[data-testid="viewer-header"]')].find(header => header.getBoundingClientRect().width > 0 && libraryImage(header));
   const file = header && libraryImage(header);
+  const toolbar = header && libraryViewer.toolbar(header);
   const identity = file && JSON.stringify(file);
   if (candidate?.header === header && candidate?.identity === identity
-    && (!mounted || (mounted.button.isConnected && mounted.panel.isConnected))) return;
+    && candidate?.zoom === toolbar?.zoom && candidate?.host === toolbar?.host
+    && (!mounted || (mounted.button.isConnected && mounted.panel.isConnected))) {
+    if (mounted) {syncMenu(mounted);openPendingLocalPrompt();}
+    return;
+  }
   candidate?.request.abort();
   unmount();
   candidate = null;
-  if (!file) return;
-  const next = { header, identity, request: new AbortController() };
+  // 等原生图片工具栏就绪再解析；否则早到的结果会把同图后续扫描短路。
+  if (!file || !toolbar || (file.kind !== "local" && (!file.origination_thread_id || !file.origination_message_id))) return;
+  const next = { header, identity, zoom:toolbar.zoom, host:toolbar.host, request: new AbortController() };
   candidate = next;
-  let prompt;
-  try { prompt = await resolvePrompt(file, next.request); }
-  catch { return; }
-  // 异步结果只能写回当前图片；没有提示词时不展示入口。
-  if (!prompt?.text || signal.aborted || candidate !== next || !header.isConnected) return;
-  // 缩放项在图片详情中是百分比菜单；沿用它的胶囊类，不固定构建 hash。
-  const zoom = [...header.querySelectorAll('button[aria-haspopup="menu"]')].find(button => /^\d+(?:\.\d+)?%$/.test(button.textContent.trim()));
-  const group = zoom?.parentElement?.parentElement;
-  const host = header.closest('[role="presentation"]');
-  if (!zoom || !group || !host) return;
-  const capsuleClass = zoom.className.split(/\s+/).filter(name => !/^_(?:dropdown|zoom)_/.test(name)).join(" ");
-  const button = element("button", capsuleClass, label("Prompt", "提示词"));
-  button.type = "button";
-  button.dataset.minecodexLibraryPrompt = "trigger";
-  button.setAttribute("aria-expanded", "false");
-  button.setAttribute("aria-controls", PANEL_ID);
-  button.style.width = "max-content";
-  button.style.minWidth = "0";
-  button.style.flex = "0 0 auto";
-  button.style.paddingInline = "calc(var(--mcx-spacing) * 3)";
-  group.prepend(button);
-  // 对齐原生 Library Version history 的面板、标题和内容区 token。
-  const panel = element("aside", "absolute inset-x-2 top-toolbar bottom-2 z-30 ms-auto mt-2 flex max-w-75 flex-col overflow-hidden rounded-2xl border border-default bg-surface shadow-lg select-none");
+  const {host,trigger:button} = toolbar;
+  // 对齐当前原生 File info 的实体材质、尺寸和内容区。
+  const panel = element("aside", "absolute end-2 bottom-2 z-40 flex min-h-0 flex-col overflow-hidden rounded-2xl bg-surface-elevated-secondary electron:elevation-prominent text-default select-none");
   panel.id = PANEL_ID;
   panel.setAttribute("aria-label", label("Image prompt", "图片提示词"));
   panel.hidden = true;
   panel.style.setProperty("-webkit-app-region", "no-drag");
-  panel.style.paddingBottom = "calc(var(--mcx-spacing) * 3)";
-  const heading = element("div", "flex items-center justify-between py-2 ps-4 pe-2");
-  const close = element("button", "flex size-8 shrink-0 items-center justify-center rounded-full text-default hover:bg-primary-ghost-hover focus-visible:outline-ring");
+  // File info 的 pt-13 与包装层 pt-px 合计；窄视口保留两侧 gutter。
+  panel.style.top = "calc(var(--mcx-spacing) * 13 + 1px)";
+  panel.style.width = "calc(var(--mcx-spacing) * 74)";
+  panel.style.maxWidth = "calc(100% - var(--mcx-spacing) * 4)";
+  const heading = element("div", "flex h-11 shrink-0 items-center justify-between gap-2 py-1 ps-4 pe-2");
+  const close = element("button", "no-drag cursor-interaction select-none disabled:cursor-default disabled:opacity-40 focus:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-0 flex border gap-1 rounded-full text-default bg-text/5 not-disabled:not-aria-disabled:hover:bg-text/10 border-transparent button-toolbar py-0 text-sm leading-[18px] aspect-square shrink-0 items-center justify-center !px-0");
   close.type = "button";
   close.setAttribute("aria-label", label("Close prompt", "关闭提示词"));
   // 直接复用原生关闭图标，避免手绘近似图形。
@@ -109,34 +159,82 @@ async function scan() {
   const copy = element("button", close.className);
   copy.type = "button";
   function copyFeedback(copied = false, failed = false) {
-    const text = failed ? label("Try copying again", "重试复制") : copied ? label("Copied", "已复制") : label("Copy prompt", "复制提示词");
+    const text = failed ? label("Try copying again", "重试复制") : copied ? label("Copied", "已复制") : record?.prompt?.kind === "request" ? label("Copy original request", "复制原始请求") : label("Copy prompt", "复制提示词");
     copy.setAttribute("data-minecodex-tooltip", text);
     copy.setAttribute("aria-label", text);
     copy.replaceChildren(copyGlyph(copied));
   }
-  copyFeedback();
   actions.append(copy, close);
-  heading.append(element("span", "text-base font-semibold text-default", label("Prompt", "提示词")), actions);
-  const body = element("div", "min-h-0 flex-1 overflow-y-auto px-3");
-  body.style.paddingTop = "var(--mcx-spacing)";
-  body.append(
-    element("p", "px-1 text-sm leading-5 text-default whitespace-pre-wrap break-words select-text", prompt.text),
-  );
+  const title = element("span", "text-base font-semibold text-default select-none", label("Prompt", "提示词"));
+  const titleHeading = element("h2", "min-w-0 flex-1 truncate");
+  titleHeading.append(title);
+  heading.append(titleHeading, actions);
+  const body = element("div", "min-h-0 flex-1 overflow-y-auto px-3 py-4");
   panel.append(heading, body);
   host.append(panel);
-  const record = { header, file, identity, button, panel, body, close, request: null,
+  const record = { header, file, identity, button, panel, body, close, copy, prompt: null, state: "loading", request: next.request,
     refreshLocale() {
-      button.textContent = label("Prompt", "提示词");
+      if (record.menuItem) record.menuItem.querySelector(".truncate").textContent = label("View prompts", "查看提示词");
       panel.setAttribute("aria-label", label("Image prompt", "图片提示词"));
       close.setAttribute("aria-label", label("Close prompt", "关闭提示词"));
-      heading.firstElementChild.textContent = label("Prompt", "提示词");
+      title.textContent = label("Prompt", "提示词");
       copyFeedback();
+      renderBody();
     },
   };
+  function renderBody() {
+    body.replaceChildren();
+    body.setAttribute("aria-busy", String(record.state === "loading"));
+    copy.disabled = record.state !== "ready";
+    copyFeedback();
+    if (record.state === "loading") {
+      const skeleton = element("div", "flex flex-col gap-2 px-1");
+      skeleton.setAttribute("aria-hidden", "true");
+      for (const width of ["100%", "92%", "100%", "68%"]) {
+        const line = element("div", "h-3 rounded-full bg-text/5");
+        line.style.width = width;
+        skeleton.append(line);
+      }
+      body.append(element("span", "sr-only", label("Loading prompt", "正在加载提示词")), skeleton);
+    } else if (record.state === "ready") {
+      if (record.prompt.kind === "request") {
+        body.append(element("p", "px-1 pb-4 text-sm leading-5 text-secondary", label("The generation prompt is unavailable. The original request is shown below.", "未获取到生成提示词，以下提供用户原始请求。")));
+        body.append(element("h3", "px-1 pb-2 text-sm font-semibold text-default", label("Original request", "原始请求")));
+      }
+      body.append(element("p", "px-1 text-sm leading-5 text-default whitespace-pre-wrap break-words select-text", record.prompt.text));
+    } else {
+      const message = record.state === "empty" ? label("Native data does not provide the generation prompt for this image", "原生数据未提供这张图片的生成提示词") : label("Could not load the prompt", "提示词加载失败");
+      body.append(element("p", "px-1 text-sm leading-5 text-secondary", message));
+      if (record.state === "error") {
+        const retry = element("button", "mt-3 rounded-full border border-default px-3 py-1 text-sm text-default hover:bg-primary-ghost-hover", label("Try again", "重试"));
+        retry.type = "button";
+        retry.addEventListener("click", loadPrompt);
+        body.append(retry);
+      }
+    }
+  }
+  async function loadPrompt() {
+    record.state = "loading";
+    renderBody();
+    try {
+      const prompt = await resolvePrompt(file, next.request);
+      // 换图或卸载后不写回；关闭面板仍可继续预取。
+      if (signal.aborted || candidate !== next || mounted !== record || !header.isConnected) return;
+      record.prompt = prompt;
+      record.state = prompt?.text ? "ready" : "empty";
+    } catch {
+      if (signal.aborted || candidate !== next || mounted !== record || next.request.signal.aborted) return;
+      record.state = "error";
+    }
+    renderBody();
+  }
   mounted = record;
+  renderBody();
+  openPendingLocalPrompt();
   copy.addEventListener("click", async () => {
+    if (record.state !== "ready") return;
     try {
-      await navigator.clipboard.writeText(prompt.text);
+      await navigator.clipboard.writeText(record.prompt.text);
       if (mounted !== record) return;
       copyFeedback(true);
     } catch {
@@ -146,10 +244,17 @@ async function scan() {
     clearTimeout(record.copyTimer);
     record.copyTimer = setTimeout(() => copyFeedback(), 2000);
   });
-  button.addEventListener("click", () => panel.hidden ? showPrompt(record) : closePanel(record));
+  syncMenu(record);
   close.addEventListener("click", () => closePanel(record, true));
+  await loadPrompt();
 }
 
+function openPendingLocalPrompt(){
+  if(mounted?.file.kind!=="local" || localImageSource?.pendingPrompt()!==mounted.file.id)return;
+  localImageSource.consumePrompt();showPrompt(mounted);
+}
+function localPromptRequested(){openPendingLocalPrompt();void scan();}
+document.addEventListener("minecodex:image-prompt",localPromptRequested);
 const localeObserver = new MutationObserver(() => mounted?.refreshLocale());
 localeObserver.observe(document.documentElement, { attributes:true, attributeFilter:["lang"] });
 const observer = new MutationObserver(() => {
@@ -165,7 +270,7 @@ function escape(event) {
   closePanel(mounted, true);
 }
 document.addEventListener("keydown", escape, true);
-const cleanup = () => { candidate?.request.abort(); candidate = null; observer.disconnect(); localeObserver.disconnect(); document.removeEventListener("keydown", escape, true); unmount(); };
+const cleanup = () => { document.removeEventListener("minecodex:image-prompt",localPromptRequested); candidate?.request.abort(); candidate = null; observer.disconnect(); localeObserver.disconnect(); document.removeEventListener("keydown", escape, true); unmount(); };
 signal.addEventListener("abort", cleanup, { once: true });
 scan();
 return cleanup;

package/features/images/src/library-prompt-source.mjs

@@ -1,10 +1,18 @@
+import { createCloudImageActions } from "./frontend/cloud-image-actions.mjs";
+import { createImageSourcesAdapter } from "./adapters/codex/image-sources.mjs";
+import { createNativeImageSource } from "./adapters/codex/native-image-source.mjs";
+import { installLocalImageSource } from "./frontend/local-image-source.mjs";
 import { createLibraryApi } from "./adapters/codex/library-api.mjs";
 import { createLibraryViewerAdapter } from "./adapters/codex/library-viewer.mjs";
 import { readFile } from "node:fs/promises";
 import { promptResolverSource } from "./adapters/codex/prompt-resolver-source.mjs";
 
-// 两条 Renderer 路径共享纯规则，注入后不依赖 Node 模块闭包。
 export async function createPageScriptSource() {
-  const source = await readFile(new URL("./library-prompt-page.mjs", import.meta.url), "utf8");
-  return `const createLibraryApi=${createLibraryApi.toString()};\nconst createLibraryViewerAdapter=${createLibraryViewerAdapter.toString()};\nconst promptFromConversation = ${promptResolverSource()};\n${source}`;
+  const source=await readFile(new URL("./library-prompt-page.mjs",import.meta.url),"utf8");
+  const functions={createCloudImageActions,createImageSourcesAdapter,createNativeImageSource,installLocalImageSource,createLibraryApi,createLibraryViewerAdapter};
+  const declarations=Object.entries(functions).map(([name,fn])=>`const ${name}=${fn.toString()};`).join("\n");
+  return `${declarations}
+let localImageSource=null;
+const promptFromConversation=${promptResolverSource()};
+${source.replace("const observer =", "localImageSource=installLocalImageSource(config,signal,createImageSourcesAdapter(config.codex),createNativeImageSource(config.codex,{requestHostAction:config.requestHostAction,libraryApi:createLibraryApi(),createCloudImageActions}));\nconst observer =").replace("return cleanup;", "return () => { cleanup(); localImageSource.cleanup(); };")}`;
 }

package/features/images/src/prompt-index.mjs

@@ -49,10 +49,17 @@ async function readPrompts(logPath, prompts) {
   const stored = new Map();
   const pendingSources = new Map();
   for await (const line of lines) {
-    if (line.includes('"image_generation_end"') || /"type"\s*:\s*"custom_tool_call"/.test(line) || /"name"\s*:\s*"wait"/.test(line) || [...pendingSources.keys()].some(id => line.includes(id))) {
+    if (line.includes('"image_generation_end"') || line.includes('"item_completed"') || /"type"\s*:\s*"custom_tool_call"/.test(line) || /"name"\s*:\s*"wait"/.test(line) || [...pendingSources.keys()].some(id => line.includes(id))) {
       let event;
       try { event = JSON.parse(line); } catch { continue; }
       const payload = event?.payload ?? event;
+      // 以完成事件为准；旧版内部状态可能仍是 generating，不能据此丢弃提示词。
+      const item = payload?.type === "item_completed" ? payload.item : null;
+      if (item?.type === "Extension" && item.kind === "image_gen.generation"
+        && typeof item.id === "string"
+        && typeof item.revisedPrompt === "string" && item.revisedPrompt.trim()) {
+        prompts.set(item.id, item.revisedPrompt);
+      }
       const legacy = legacyPromptFromPayload(payload);
       if (legacy && !prompts.has(legacy.imageGenerationItemId)) {
         prompts.set(legacy.imageGenerationItemId, legacy.prompt);
@@ -160,7 +167,12 @@ export class ThreadPromptIndex {
   async find(threadId, imageGenerationItemId) {
     const key = cacheKey(threadId, imageGenerationItemId);
     const cached = this.threadPrompts.get(threadId);
-    if (cached?.has(imageGenerationItemId)) return cached.get(imageGenerationItemId);
+    if (cached?.has(imageGenerationItemId)) {
+      // 工具请求先到、完成事件后到时，重新读取更准确的 revisedPrompt。
+      if (!await this.threadLogsChanged(threadId)) return cached.get(imageGenerationItemId);
+      this.threadPrompts.delete(threadId);
+      this.clearNegative(threadId);
+    }
 
     const negative = this.negativeCache.get(key);
     if (negative) {

package/features/model-slider/DESIGN.md

@@ -22,6 +22,8 @@ Composer 触发器区分两种状态：占位态（"Select model" / "Select effo
 - **Composer Trigger:** 占位态恢复原生 160px Content 宽度；真实模型态 HUG 完整名称，头部保留原生可点击 chevron。
 - **Slider Header:** 模型名最多两行，容器高度随内容自然撑开；effort 与 chevron 不收缩。无 Fast 时移除原生 12px 预留占位，让按钮与面板严格居中。
 - **Model List:** 保持 264px 原生宽度、Provider 副文本、收藏与最多六项可视高度；收藏与未收藏之间保留分隔线，弹窗内容四周保留约 6px 内边距；模型弹窗与原生 Slider 一致地水平居中于触发器。列表打开期间，Composer 占位文案从 `Select effort` 切为原生语义 `Select model`，关闭后恢复。
+- 模型列表使用共享 Dropdown 的 `opaque` 分支：不透明主题填充、无背景模糊，保留 Dropdown 圆角、边缘和阴影，避免后方聊天文字透入列表。此选择仅适用于模型列表。
+- Slider 与模型列表切换沿用 Codex 26.930.21537 的动效节奏：底边锚定，高度 320ms（`cubic-bezier(.19,1,.22,1)`）；列表内容 200ms 淡变与 10px 位移（`cubic-bezier(.23,1,.32,1)`），进入延迟 40ms。返回时收缩并淡出，Escape 先返回 Slider；减少动态效果时立即切换。切换与卸载会取消旧动画和清理定时器，不改原生 React 节点。
 - OCX 自动发现的 GPT 路由若与原生模型同名且没有独立推理档位，列表只显示原生项；当前已选中的路由仍显示，避免失去切换入口。有独立档位的 Provider 路由继续显示并标注 Provider。
 - Slider 预览档位时同步 effort 标签与 Fast 控件的 Ultra 状态；离开 Ultra 后立即恢复普通档位颜色。
 

package/features/model-slider/src/frontend/install.mjs

@@ -683,6 +683,7 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
 
   function sizeModelMenuViewport(menu, maxVisibleItems) {
     if (!menu.isConnected) return;
+    if (modelSelectorControllerMenu?.menu === menu && modelSelectorControllerMenu.animations?.length) return;
     const items = modelMenuItems(menu).filter((item) => item.dataset.codexModelSliderRaw);
     if (items.length <= maxVisibleItems) {
       menu.removeAttribute("data-codex-model-slider-overflow");
@@ -959,9 +960,38 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     }
   }
 
-  function closeControllerModelMenu() {
+  function animateControllerModelMenu(record, opening, onFinish) {
+    const height = record.menu.getBoundingClientRect().height;
+    clearTimeout(record.motionTimer);
+    record.animations?.forEach((animation) => animation.cancel());
+    record.animations = [];
+    if (matchMedia("(prefers-reduced-motion: reduce)").matches) {
+      onFinish();
+      return;
+    }
+    // 原生视图切换：底边保持锚定，高度 320ms，内容 200ms 淡变并位移 10px。
+    record.menu.style.overflowY = "hidden";
+    const size = record.menu.animate([
+      { height: `${opening ? record.sliderHeight : height}px` },
+      { height: `${opening ? record.listHeight : record.sliderHeight}px` },
+    ], { duration: 320, easing: "cubic-bezier(.19,1,.22,1)", fill: "both" });
+    const content = record.content.animate(opening
+      ? [{ opacity: 0, translate: "0 10px" }, { opacity: 1, translate: "0 0" }]
+      : [{ opacity: 1, translate: "0 0" }, { opacity: 0, translate: "0 10px" }],
+    { duration: 200, delay: opening ? 40 : 0, easing: "cubic-bezier(.23,1,.32,1)", fill: "both" });
+    record.animations.push(size, content);
+    if (!opening) {
+      record.animations.push(record.menu.animate([{ opacity: 1 }, { opacity: 0 }],
+        { duration: 200, delay: 40, easing: "cubic-bezier(.23,1,.32,1)", fill: "both" }));
+    }
+    // 后台窗口未必派发动画完成事件，清理按同一时长结束，避免残留菜单。
+    record.motionTimer = setTimeout(onFinish, 320);
+  }
+
+  function closeControllerModelMenu({ immediate = false } = {}) {
     const record = modelSelectorControllerMenu;
     if (!record) return false;
+    if (record.closing && !immediate) return true;
     const placeholder = document.querySelector(
       '[data-codex-intelligence-trigger] [class*="_ModelPickerTriggerPlaceholder_"]',
     );
@@ -969,10 +999,18 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
       placeholder.firstChild.nodeValue = record.placeholderText;
     }
     record.button.setAttribute("aria-expanded", "false");
-    record.parentMenu.style.position = record.position;
-    record.parentMenu.style.overflow = record.overflow;
-    record.menu.remove();
-    modelSelectorControllerMenu = null;
+    record.closing = true;
+    record.menu.inert = true;
+    const finish = () => {
+      clearTimeout(record.motionTimer);
+      record.animations?.forEach((animation) => animation.cancel());
+      record.parentMenu.style.position = record.position;
+      record.parentMenu.style.overflow = record.overflow;
+      record.menu.remove();
+      if (modelSelectorControllerMenu === record) modelSelectorControllerMenu = null;
+    };
+    if (immediate || !record.parentMenu.isConnected) finish();
+    else animateControllerModelMenu(record, false, finish);
     return true;
   }
 
@@ -988,8 +1026,11 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
 
   function openControllerModelMenu(parentMenu, modelButton, selector) {
     if (modelSelectorControllerMenu) {
-      closeControllerModelMenu();
-      return;
+      if (!modelSelectorControllerMenu.closing) {
+        closeControllerModelMenu();
+        return;
+      }
+      closeControllerModelMenu({ immediate: true });
     }
     const controller = nativeComposerModelController();
     if (!Array.isArray(controller?.models) || typeof controller.onSelectModel !== "function") return;
@@ -1002,7 +1043,12 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     menu.setAttribute("data-state", "open");
     menu.setAttribute("data-codex-model-slider-menu", "");
     menu.setAttribute("data-codex-model-slider-controller-menu", "");
-    featureUI.surface(menu, "dropdown");
+    featureUI.surface(menu, "dropdown", { variant: "opaque" });
+    // 切换同一个 picker 视图，不重复播放整个 Dropdown 的入场缩放。
+    menu.style.animation = "none";
+    const content = document.createElement("div");
+    content.style.flexShrink = "0";
+    menu.append(content);
     models.forEach((model, index) => {
       const item = document.createElement("div");
       item.className = "no-drag outline-hidden rounded-lg px-[var(--padding-row-x)] py-[var(--padding-row-y)] text-sm text-default group hover:bg-primary-ghost-hover focus:bg-primary-ghost-hover cursor-interaction flex flex-col";
@@ -1014,7 +1060,7 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
         scheduleReturn: false,
         owned: true,
       });
-      menu.append(item);
+      content.append(item);
     });
     menu.addEventListener("click", (event) => {
       const star = event.target.closest?.("[data-codex-model-slider-star]");
@@ -1038,6 +1084,7 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     menu.addEventListener("keydown", (event) => {
       if (event.key === "Escape") {
         event.preventDefault();
+        event.stopPropagation();
         closeControllerModelMenu();
         modelButton.focus();
         return;
@@ -1063,11 +1110,13 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
 
     modelSelectorControllerMenu = {
       menu,
+      content,
       parentMenu,
       button: modelButton,
       placeholderText,
       position: parentMenu.style.position,
       overflow: parentMenu.style.overflow,
+      sliderHeight: parentMenu.getBoundingClientRect().height,
     };
     parentMenu.style.position = "relative";
     parentMenu.style.overflow = "visible";
@@ -1076,6 +1125,15 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     modelButton.setAttribute("aria-expanded", "true");
     (menu.querySelector('[data-codex-model-slider-selected]')
       ?? menu.querySelector('[role="menuitem"]'))?.focus();
+    const record = modelSelectorControllerMenu;
+    record.listHeight = menu.getBoundingClientRect().height;
+    animateControllerModelMenu(record, true, () => {
+      if (modelSelectorControllerMenu !== record || record.closing) return;
+      record.animations.forEach((animation) => animation.cancel());
+      record.animations = [];
+      menu.style.overflowY = "auto";
+      sizeModelMenuViewport(menu, selector.maxVisibleItems);
+    });
   }
 
   // ========================================================================
@@ -2005,7 +2063,7 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     enhanceComposerModelTrigger(selector);
     const parentMenu = nativeModelPickerMenu();
     if (modelSelectorControllerMenu && modelSelectorControllerMenu.parentMenu !== parentMenu) {
-      closeControllerModelMenu();
+      closeControllerModelMenu({ immediate: true });
     }
     if (!parentMenu) {
       if (
@@ -2031,7 +2089,7 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
   }
 
   function restoreModelSelectorEnhancements() {
-    closeControllerModelMenu();
+    closeControllerModelMenu({ immediate: true });
     clearTimeout(modelSelectorReturnTimer);
     clearTimeout(modelSelectorEffortTransactionTimer);
     modelSelectorTriggerObserver?.disconnect();
@@ -2091,6 +2149,15 @@ export function installModelSlider(signal, { feature, ui, createIcon, requestRef
     modelSelectorNativeToggleHandlers.clear();
   }
 
+  window.addEventListener("keydown", event => {
+    const record = modelSelectorControllerMenu;
+    if (event.key !== "Escape" || !record) return;
+    // 先退出插件模型视图，避免原生 document 监听同时关闭整个 picker。
+    event.preventDefault();
+    event.stopImmediatePropagation();
+    closeControllerModelMenu();
+    record.button.focus();
+  }, { capture: true, signal });
   document.addEventListener("click", event => {
     if (modelSelectorControllerMenu
       && !modelSelectorControllerMenu.menu.contains(event.target)

package/features/notes/DESIGN.md

@@ -38,7 +38,9 @@ Header 为 Prompts；右侧依次为排序图标、分类调节图标、常驻
 
 点击提示词只插入当前输入框，保留原草稿且不发送。Escape 关闭并回到入口；点击外部关闭；方向键移动列表焦点。原生 Add 或权限面板打开时关闭。切换输入框时关闭，异步结果不得插入另一会话。沿用原生焦点与 hover，无额外进场动画。
 
-入口仅挂载到可见 Codex 输入框；原生可见的 Add 或菜单按钮展开时关闭 Popover。Session Status 的 Context 展开状态不是弹出菜单，不作为冲突条件；隐藏输入框和隐藏控件不参与锚点定位或菜单判断。
+入口通过 Codex Adapter 的 `purpose:"insertion"` 挂载到可见的原生输入框，覆盖 Chat、Work、Codex、Temporary Chat、浮动聊天，以及 side panel 全屏非聊天页面的 chat bar。多输入框并存时优先当前焦点所在输入框；插入操作显式绑定打开面板的输入框，切换后关闭旧面板，不向隐藏输入框插入。此插入契约不扩展会话指标使用的 Codex thread 契约。
+
+原生可见的 Add 或菜单按钮展开时关闭 Popover。Session Status 的 Context 展开状态不是弹出菜单，不作为冲突条件；隐藏输入框和隐藏控件不参与锚点定位或菜单判断。
 
 ## 统计
 成功插入后原子增加 `use_count` 并更新 `called_at`，保存于现有 SQLite。创建、编辑、复制和排序不计数。历史次数未知，从 0 开始，不从旧 `last_used_at` 推断。删除分类、切换页面、重启不清零。
@@ -50,9 +52,9 @@ Header 为 Prompts；右侧依次为排序图标、分类调节图标、常驻
 
 导航栏 book-open 单独采用 20px 容器、27×27 viewBox，实际轮廓约 16.15px，描边折算 1.33px，与原生导航一致。Lucide 两个描边子路径合为一个 path，一次绘制半透明 currentColor，避免书脊交叠变深。选中态使用 Phosphor 官方 book-open-fill 的20px资源；授权见 vendor/phosphor-LICENSE。输入框入口尺寸不变。
 
-拖拽排序使用等高 Drop Placeholder，原生拖影跟随指针；同组条目以 180ms ease-out 让位，落位淡入 140ms。放到范围外或取消恢复原位，不写入排序。遵循 prefers-reduced-motion。
+拖拽排序使用等高 Drop Placeholder，拖影跟随指针并显式按源行圆角裁切，不留下矩形外边界；同组条目以 180ms ease-out 让位，落位淡入 140ms。放到范围外或取消恢复原位，不写入排序。遵循 prefers-reduced-motion。
 
-页面选择通用 Page 外壳，保留原生 Home sidebar 的悬浮与导航行为。
+页面选择通用 Page 的 `sidebar:"none"` 分支，自身不带常驻二级侧栏，保留原生 Home、Space、Scheduled sidebar 的悬浮叠加与导航行为。关闭页面恢复原页面位置，不改变用户的侧栏展开偏好。
 
 提示词编辑沿用原生 Project 的复合标题输入：40px 图标段位于标题前，细分隔线，共用圆角边框与 focus-within 状态。图标选择入口不再单独占一行；Title 通过 aria-label 标识。
 
@@ -68,3 +70,5 @@ Category 下拉面板与触发栏等宽、左右对齐，宽度包含内边距
 内置 24 条来自 dsh-prompt 0.1.13 的 MIT 提示词，正文保持原样，按思考、学习、编程、效率分类并配 Emoji。来源与许可保存在 assets/dsh-prompt-LICENSE.txt。首次启动或旧库升级时单次导入；随后允许编辑和删除，重启不还原，也不重建被删除的分类。用户个人内容只保留在本机数据库，不纳入默认资源。
 
 简短悬浮提示调用共享 Tooltip；具体文案由本功能维护。Quick Prompts 通过通用 ComposerMenu 使用原生浮动建议列表材质和输入框主体锚点。排序、分类与图标菜单显式选择 Dropdown。
+
+Categories 管理弹窗的 New category 是有实际功能的次级操作，使用共享 Button 的 `secondary`（outline）分支；分类编辑的 Save 保留主按钮。