@spotpatch/runtime 1.15.2 → 1.15.4

package/dist/contextual-ask-panel.js

@@ -2,6 +2,10 @@ import {
   getContextualAskExtension,
   registerContextualAskExtension
 } from "./chunk-PXJKFEUJ.js";
+import {
+  SELECT_PICKER_STYLES,
+  createSelectPicker
+} from "./chunk-ELCIEQGT.js";
 import {
   createButton,
   createMarkedElement
@@ -763,158 +767,6 @@ function createContextualAskWorkflow(input) {
   });
 }
 
-// src/ui/ask-picker.ts
-function createAskPicker(document, onViewChange) {
-  const root = createMarkedElement(document, "div");
-  root.className = "spotpatch-ask-executor-picker";
-  const trigger = createButton(document, "", "spotpatch-ask-executor");
-  trigger.id = `spotpatch-ask-picker-${Math.random().toString(36).slice(2)}`;
-  trigger.setAttribute("role", "combobox");
-  trigger.setAttribute("aria-haspopup", "listbox");
-  trigger.setAttribute("aria-expanded", "false");
-  const text = createMarkedElement(document, "span");
-  trigger.append(text);
-  const menu = createMarkedElement(document, "div");
-  menu.id = `${trigger.id}-menu`;
-  menu.className = "spotpatch-ask-executor-menu";
-  menu.setAttribute("role", "listbox");
-  menu.hidden = true;
-  trigger.setAttribute("aria-controls", menu.id);
-  const select = createMarkedElement(document, "select");
-  select.className = "spotpatch-ask-executor-native";
-  select.tabIndex = -1;
-  select.setAttribute("aria-hidden", "true");
-  root.append(trigger, menu, select);
-  function close(focus = false) {
-    if (menu.hidden) return;
-    menu.hidden = true;
-    trigger.setAttribute("aria-expanded", "false");
-    trigger.removeAttribute("aria-activedescendant");
-    if (focus) trigger.focus({ preventScroll: true });
-    onViewChange();
-  }
-  function activate(index) {
-    const options = [...menu.children];
-    const active = options[index];
-    if (active === void 0) return;
-    for (const option of options) option.dataset.active = String(option === active);
-    trigger.setAttribute("aria-activedescendant", active.id);
-    const itemRect = active.getBoundingClientRect();
-    const menuRect = menu.getBoundingClientRect();
-    if (itemRect.top < menuRect.top) menu.scrollTop -= menuRect.top - itemRect.top;
-    else if (itemRect.bottom > menuRect.bottom)
-      menu.scrollTop += itemRect.bottom - menuRect.bottom;
-  }
-  function open() {
-    if (trigger.disabled || !menu.hidden) return;
-    menu.hidden = false;
-    trigger.setAttribute("aria-expanded", "true");
-    activate(Math.max(0, select.selectedIndex));
-    onViewChange();
-  }
-  function sync() {
-    text.textContent = select.selectedOptions[0]?.textContent ?? "";
-    trigger.title = text.textContent;
-    trigger.dataset.empty = String(select.value.length === 0);
-    for (const option of [...menu.children]) {
-      option.setAttribute(
-        "aria-selected",
-        String(option.dataset.value === select.value)
-      );
-    }
-  }
-  function choose(value) {
-    if (trigger.disabled) return;
-    select.value = value;
-    sync();
-    close(true);
-    select.dispatchEvent(new Event("change", { bubbles: true }));
-  }
-  function rebuild() {
-    close();
-    menu.replaceChildren();
-    for (const [index, option] of [...select.options].entries()) {
-      const item = createMarkedElement(document, "div");
-      item.id = `${menu.id}-${String(index)}`;
-      item.className = "spotpatch-ask-executor-option";
-      item.setAttribute("role", "option");
-      item.dataset.value = option.value;
-      item.textContent = option.textContent;
-      item.title = option.textContent;
-      item.addEventListener("pointerdown", (event) => {
-        event.preventDefault();
-      });
-      item.addEventListener("click", () => {
-        choose(option.value);
-      });
-      menu.append(item);
-    }
-    sync();
-  }
-  trigger.addEventListener("click", () => {
-    if (menu.hidden) open();
-    else close();
-  });
-  trigger.addEventListener("keydown", (event) => {
-    if (event.key === "Escape" && !menu.hidden) {
-      event.preventDefault();
-      event.stopPropagation();
-      close();
-      return;
-    }
-    if (event.key === "Tab") {
-      close();
-      return;
-    }
-    if (["Enter", " "].includes(event.key) && !menu.hidden) {
-      event.preventDefault();
-      const active = [...menu.children].find(
-        (item) => item.id === trigger.getAttribute("aria-activedescendant")
-      );
-      if (active?.dataset.value !== void 0) choose(active.dataset.value);
-      return;
-    }
-    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) return;
-    event.preventDefault();
-    if (menu.hidden) {
-      open();
-      return;
-    }
-    const options = [...menu.children];
-    const index = options.findIndex(
-      (item) => item.id === trigger.getAttribute("aria-activedescendant")
-    );
-    activate(
-      event.key === "Home" ? 0 : event.key === "End" ? options.length - 1 : (index + (event.key === "ArrowDown" ? 1 : -1) + options.length) % options.length
-    );
-  });
-  root.addEventListener("focusout", (event) => {
-    if (!(event.relatedTarget instanceof Node) || !root.contains(event.relatedTarget))
-      close();
-  });
-  const outside = (event) => {
-    if (!event.composedPath().includes(root)) close();
-  };
-  document.addEventListener("pointerdown", outside);
-  select.addEventListener("change", sync);
-  return {
-    root,
-    trigger,
-    select,
-    rebuild,
-    close,
-    setDisabled(disabled) {
-      select.disabled = disabled;
-      trigger.disabled = disabled || select.options.length < 2;
-      trigger.dataset.expandable = String(!trigger.disabled);
-      if (trigger.disabled) close();
-    },
-    dispose() {
-      document.removeEventListener("pointerdown", outside);
-    }
-  };
-}
-
 // src/ui/contextual-ask-localization.ts
 var EN = Object.freeze({
   mode: Object.freeze({ ask: "Ask", change: "Change", label: "Task mode" }),
@@ -930,12 +782,12 @@ var EN = Object.freeze({
   ]),
   executorLabel: "Read-only executor",
   modelLabel: "Model",
-  loadingExecutors: "Checking available executors\u2026",
+  loadingExecutors: "Checking available executors…",
   noExecutor: "No verified read-only executor is available.",
   unavailable: "unavailable",
   consent: "Allow the selected source snapshot to be sent to this provider for this answer.",
-  dataSummary: (targets, sources) => `${String(targets)} selected element${targets === 1 ? "" : "s"} \xB7 ${String(sources)} source-backed`,
-  safety: "Single turn \xB7 read-only \xB7 no history",
+  dataSummary: (targets, sources) => `${String(targets)} selected element${targets === 1 ? "" : "s"} · ${String(sources)} source-backed`,
+  safety: "Single turn · read-only · no history",
   submit: "Ask",
   cancel: "Cancel",
   newQuestion: "Start over",
@@ -955,7 +807,7 @@ var EN = Object.freeze({
     cancelled: "Cancelled",
     failed: "Could not answer"
   }),
-  sourceLabel: (path, start, end) => `${path}:${String(start)}${end === start ? "" : `\u2013${String(end)}`}`,
+  sourceLabel: (path, start, end) => `${path}:${String(start)}${end === start ? "" : `–${String(end)}`}`,
   readSource: (path) => `Reading ${path}`,
   readFiles: (bucket) => `Reading ${bucket} files`,
   copied: "Answer copied.",
@@ -987,74 +839,74 @@ var EN = Object.freeze({
   warning: (code) => code === "insufficient-evidence" ? "The selected source did not contain enough evidence for a complete answer." : "Some source references were omitted because they could not be verified."
 });
 var ZH = Object.freeze({
-  mode: Object.freeze({ ask: "\u95EE\u7B54", change: "\u4FEE\u6539", label: "\u4EFB\u52A1\u6A21\u5F0F" }),
-  title: "\u8BE2\u95EE\u6240\u9009\u5143\u7D20",
-  subtitle: "\u4E00\u6B21\u63D0\u95EE\uFF0C\u4E00\u6B21\u5E26\u6E90\u7801\u5F15\u7528\u7684\u56DE\u7B54\uFF1BSpotPatch \u4E0D\u4F1A\u5199\u5165\u4EE3\u7801\u3002",
-  questionLabel: "\u95EE\u9898",
-  questionPlaceholder: "\u8FD9\u4E2A\u7EC4\u4EF6\u662F\u505A\u4EC0\u4E48\u7684\uFF1F",
-  suggestionsLabel: "\u63A8\u8350\u95EE\u9898",
+  mode: Object.freeze({ ask: "问答", change: "修改", label: "任务模式" }),
+  title: "询问所选元素",
+  subtitle: "一次提问，一次带源码引用的回答；SpotPatch 不会写入代码。",
+  questionLabel: "问题",
+  questionPlaceholder: "这个组件是做什么的？",
+  suggestionsLabel: "推荐问题",
   suggestions: Object.freeze([
-    "\u8FD9\u4E2A\u7EC4\u4EF6\u662F\u505A\u4EC0\u4E48\u7684\uFF1F",
-    "\u5B83\u7684\u6570\u636E\u4ECE\u54EA\u91CC\u6765\uFF1F",
-    "\u4E3A\u4EC0\u4E48\u8981\u8FD9\u6837\u5B9E\u73B0\uFF1F"
+    "这个组件是做什么的？",
+    "它的数据从哪里来？",
+    "为什么要这样实现？"
   ]),
-  executorLabel: "\u53EA\u8BFB\u6267\u884C\u5668",
-  modelLabel: "\u6A21\u578B",
-  loadingExecutors: "\u6B63\u5728\u68C0\u67E5\u53EF\u7528\u6267\u884C\u5668\u2026",
-  noExecutor: "\u76EE\u524D\u6CA1\u6709\u901A\u8FC7\u53EA\u8BFB\u9A8C\u8BC1\u7684\u6267\u884C\u5668\u3002",
-  unavailable: "\u4E0D\u53EF\u7528",
-  consent: "\u5141\u8BB8\u672C\u6B21\u56DE\u7B54\u5C06\u6240\u9009\u6E90\u7801\u5FEB\u7167\u53D1\u9001\u7ED9\u8BE5\u63D0\u4F9B\u5546\u3002",
-  dataSummary: (targets, sources) => `${String(targets)} \u4E2A\u5DF2\u9009\u5143\u7D20 \xB7 ${String(sources)} \u4E2A\u5177\u5907\u6E90\u7801\u4E0A\u4E0B\u6587`,
-  safety: "\u5355\u8F6E \xB7 \u53EA\u8BFB \xB7 \u4E0D\u4FDD\u5B58\u5386\u53F2",
-  submit: "\u63D0\u95EE",
-  cancel: "\u53D6\u6D88",
-  newQuestion: "\u91CD\u65B0\u5F00\u59CB",
-  copy: "\u590D\u5236\u56DE\u7B54",
-  convert: "\u8F6C\u6210\u4FEE\u6539\u8BF7\u6C42",
-  answerTitle: "\u56DE\u7B54",
-  sourcesTitle: "\u6E90\u7801\u5F15\u7528",
-  stale: "\u56DE\u7B54\u540E\u9009\u62E9\u5DF2\u53D1\u751F\u53D8\u5316\u3002\u8BF7\u91CD\u65B0\u63D0\u95EE\u540E\u518D\u91C7\u4FE1\u6B64\u56DE\u7B54\u3002",
-  convertedTitle: "\u6765\u81EA\u4E0A\u4E0B\u6587\u95EE\u7B54",
-  convertedBody: "\u56DE\u7B54\u4E0E\u6E90\u7801\u5F15\u7528\u4EC5\u4F5C\u4E3A\u672C\u5730\u4E0A\u4E0B\u6587\u4FDD\u7559\uFF0C\u5C1A\u672A\u53D1\u8D77\u4EFB\u4F55\u4FEE\u6539\u3002",
+  executorLabel: "只读执行器",
+  modelLabel: "模型",
+  loadingExecutors: "正在检查可用执行器…",
+  noExecutor: "目前没有通过只读验证的执行器。",
+  unavailable: "不可用",
+  consent: "允许本次回答将所选源码快照发送给该提供商。",
+  dataSummary: (targets, sources) => `${String(targets)} 个已选元素 · ${String(sources)} 个具备源码上下文`,
+  safety: "单轮 · 只读 · 不保存历史",
+  submit: "提问",
+  cancel: "取消",
+  newQuestion: "重新开始",
+  copy: "复制回答",
+  convert: "转成修改请求",
+  answerTitle: "回答",
+  sourcesTitle: "源码引用",
+  stale: "回答后选择已发生变化。请重新提问后再采信此回答。",
+  convertedTitle: "来自上下文问答",
+  convertedBody: "回答与源码引用仅作为本地上下文保留，尚未发起任何修改。",
   status: Object.freeze({
-    queued: "\u5DF2\u6392\u961F",
-    authorizing: "\u6B63\u5728\u9A8C\u8BC1\u53EA\u8BFB\u6743\u9650",
-    running: "\u6B63\u5728\u5206\u6790\u6240\u9009\u6E90\u7801",
-    cancelling: "\u6B63\u5728\u53D6\u6D88",
-    answered: "\u56DE\u7B54\u5DF2\u5C31\u7EEA",
-    cancelled: "\u5DF2\u53D6\u6D88",
-    failed: "\u65E0\u6CD5\u56DE\u7B54"
+    queued: "已排队",
+    authorizing: "正在验证只读权限",
+    running: "正在分析所选源码",
+    cancelling: "正在取消",
+    answered: "回答已就绪",
+    cancelled: "已取消",
+    failed: "无法回答"
   }),
-  sourceLabel: (path, start, end) => `${path}:${String(start)}${end === start ? "" : `\u2013${String(end)}`}`,
-  readSource: (path) => `\u6B63\u5728\u8BFB\u53D6 ${path}`,
-  readFiles: (bucket) => `\u6B63\u5728\u8BFB\u53D6 ${bucket} \u4E2A\u6587\u4EF6`,
-  copied: "\u56DE\u7B54\u5DF2\u590D\u5236\u3002",
-  copyFailed: "\u65E0\u6CD5\u590D\u5236\u56DE\u7B54\u3002",
-  sourceOpenFailed: "\u65E0\u6CD5\u6253\u5F00\u6E90\u7801\u3002",
-  converted: "\u5DF2\u5207\u6362\u5230\u4FEE\u6539\u6A21\u5F0F\uFF0C\u5E76\u628A\u56DE\u7B54\u4F5C\u4E3A\u672C\u5730\u4E0A\u4E0B\u6587\u9644\u5E26\u3002",
+  sourceLabel: (path, start, end) => `${path}:${String(start)}${end === start ? "" : `–${String(end)}`}`,
+  readSource: (path) => `正在读取 ${path}`,
+  readFiles: (bucket) => `正在读取 ${bucket} 个文件`,
+  copied: "回答已复制。",
+  copyFailed: "无法复制回答。",
+  sourceOpenFailed: "无法打开源码。",
+  converted: "已切换到修改模式，并把回答作为本地上下文附带。",
   error: (code) => {
     const errors = {
-      INVALID_TOKEN: "\u672C\u5730 SpotPatch \u4F1A\u8BDD\u5DF2\u5931\u6548\uFF0C\u8BF7\u5237\u65B0\u9875\u9762\u3002",
-      ORIGIN_NOT_ALLOWED: "\u672C\u5730\u8BF7\u6C42\u672A\u901A\u8FC7\u540C\u6E90\u5B89\u5168\u6821\u9A8C\uFF0C\u8BF7\u5237\u65B0\u9875\u9762\u6216\u91CD\u542F\u5F00\u53D1\u670D\u52A1\u3002",
-      ASK_DISABLED: "\u4E0A\u4E0B\u6587\u95EE\u7B54\u672A\u542F\u7528\u3002",
-      ASK_SELECTION_REQUIRED: "\u8BF7\u5148\u9009\u62E9\u81F3\u5C11\u4E00\u4E2A\u5143\u7D20\u3002",
-      ASK_SELECTION_STALE: "\u6240\u9009\u6E90\u7801\u5DF2\u7ECF\u53D8\u5316\uFF0C\u8BF7\u5237\u65B0\u9009\u62E9\u540E\u91CD\u65B0\u63D0\u95EE\u3002",
-      ASK_QUESTION_INVALID: "\u8BF7\u8F93\u5165\u4E00\u4E2A\u6709\u6548\u7684\u95EE\u9898\u3002",
-      ASK_EXECUTOR_UNAVAILABLE: "\u6240\u9009\u53EA\u8BFB\u6267\u884C\u5668\u5F53\u524D\u4E0D\u53EF\u7528\u3002",
-      ASK_TIMEOUT: "\u53EA\u8BFB\u6267\u884C\u5668\u672A\u80FD\u5728\u9650\u5B9A\u65F6\u95F4\u5185\u8FD4\u56DE\u56DE\u7B54\uFF0C\u8BF7\u91CD\u65B0\u63D0\u95EE\u3002",
-      ASK_CONSENT_REQUIRED: "\u8BF7\u786E\u8BA4\u672C\u6B21\u56DE\u7B54\u7684\u63D0\u4F9B\u5546\u6570\u636E\u8BBF\u95EE\u3002",
-      ASK_BUSY: "\u5DE5\u4F5C\u533A\u6B63\u5728\u6267\u884C\u5176\u4ED6\u4EFB\u52A1\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5\u3002",
-      ASK_CANCELLED: "\u672C\u6B21\u63D0\u95EE\u5DF2\u53D6\u6D88\u3002",
-      ASK_RESULT_EXPIRED: "\u56DE\u7B54\u5DF2\u8FC7\u671F\uFF0C\u8BF7\u91CD\u65B0\u63D0\u95EE\u3002",
-      ASK_WRITE_ATTEMPTED: "\u6267\u884C\u5668\u5C1D\u8BD5\u5199\u5165\uFF0C\u5DF2\u88AB\u963B\u6B62\u3002",
-      ASK_ANSWER_INVALID: "\u6267\u884C\u5668\u8FD4\u56DE\u7684\u5E26\u5F15\u7528\u56DE\u7B54\u65E0\u6548\u3002",
-      ASK_PROTOCOL_INCOMPATIBLE: "\u6267\u884C\u5668\u534F\u8BAE\u4E0D\u517C\u5BB9\u3002",
-      ASK_LIMIT_EXCEEDED: "\u6240\u9009\u4E0A\u4E0B\u6587\u8FC7\u5927\u3002",
-      ASK_SOURCE_SCOPE_DENIED: "\u8BF7\u6C42\u7684\u6E90\u7801\u8D85\u51FA\u4E86\u6388\u6743\u5FEB\u7167\u8303\u56F4\u3002"
+      INVALID_TOKEN: "本地 SpotPatch 会话已失效，请刷新页面。",
+      ORIGIN_NOT_ALLOWED: "本地请求未通过同源安全校验，请刷新页面或重启开发服务。",
+      ASK_DISABLED: "上下文问答未启用。",
+      ASK_SELECTION_REQUIRED: "请先选择至少一个元素。",
+      ASK_SELECTION_STALE: "所选源码已经变化，请刷新选择后重新提问。",
+      ASK_QUESTION_INVALID: "请输入一个有效的问题。",
+      ASK_EXECUTOR_UNAVAILABLE: "所选只读执行器当前不可用。",
+      ASK_TIMEOUT: "只读执行器未能在限定时间内返回回答，请重新提问。",
+      ASK_CONSENT_REQUIRED: "请确认本次回答的提供商数据访问。",
+      ASK_BUSY: "工作区正在执行其他任务，请稍后重试。",
+      ASK_CANCELLED: "本次提问已取消。",
+      ASK_RESULT_EXPIRED: "回答已过期，请重新提问。",
+      ASK_WRITE_ATTEMPTED: "执行器尝试写入，已被阻止。",
+      ASK_ANSWER_INVALID: "执行器返回的带引用回答无效。",
+      ASK_PROTOCOL_INCOMPATIBLE: "执行器协议不兼容。",
+      ASK_LIMIT_EXCEEDED: "所选上下文过大。",
+      ASK_SOURCE_SCOPE_DENIED: "请求的源码超出了授权快照范围。"
     };
-    return code === void 0 ? "SpotPatch \u672A\u80FD\u5B8C\u6210\u672C\u6B21\u63D0\u95EE\u3002" : errors[code] ?? "SpotPatch \u672A\u80FD\u5B8C\u6210\u672C\u6B21\u63D0\u95EE\u3002";
+    return code === void 0 ? "SpotPatch 未能完成本次提问。" : errors[code] ?? "SpotPatch 未能完成本次提问。";
   },
-  warning: (code) => code === "insufficient-evidence" ? "\u6240\u9009\u6E90\u7801\u4E0D\u8DB3\u4EE5\u652F\u6301\u5B8C\u6574\u56DE\u7B54\u3002" : "\u90E8\u5206\u6E90\u7801\u5F15\u7528\u56E0\u65E0\u6CD5\u9A8C\u8BC1\u800C\u88AB\u7701\u7565\u3002"
+  warning: (code) => code === "insufficient-evidence" ? "所选源码不足以支持完整回答。" : "部分源码引用因无法验证而被省略。"
 });
 function contextualAskMessages(locale) {
   return locale === "zh-CN" ? ZH : EN;
@@ -1064,6 +916,7 @@ function contextualAskMessages(locale) {
 function createStyles(document) {
   const style = document.createElement("style");
   style.textContent = `
+    ${SELECT_PICKER_STYLES}
     .spotpatch-ask-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 14px; padding: 4px; border: 1px solid var(--spotpatch-border-subtle); border-radius: 10px; background: #0a0a0e; }
     .spotpatch-ask-mode button { min-height: 34px; border: 0; border-radius: 7px; color: var(--spotpatch-text-secondary); background: transparent; cursor: pointer; font-size: 12px; font-weight: 700; }
     .spotpatch-ask-mode button[aria-selected="true"] { color: #f7f7ff; background: linear-gradient(135deg, rgb(139 123 255 / 25%), rgb(82 168 255 / 14%)); box-shadow: inset 0 0 0 1px rgb(139 123 255 / 24%); }
@@ -1076,20 +929,6 @@ function createStyles(document) {
     .spotpatch-ask-suggestions { display: flex; flex-wrap: wrap; gap: 6px; }
     .spotpatch-ask-suggestions button { border: 1px solid var(--spotpatch-border-subtle); border-radius: 999px; padding: 5px 9px; color: var(--spotpatch-text-secondary); background: rgb(255 255 255 / 2%); cursor: pointer; font-size: 10.5px; }
     .spotpatch-ask-suggestions button:hover { border-color: rgb(139 123 255 / 42%); color: #fff; }
-    .spotpatch-ask-executor-picker { display: grid; gap: 5px; min-width: 0; }
-    .spotpatch-ask-executor { box-sizing: border-box; display: flex; width: 100%; min-height: 38px; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--spotpatch-border); border-radius: 9px; padding: 0 11px; overflow: hidden; color: var(--spotpatch-text); background: var(--spotpatch-bg-input); cursor: pointer; font: inherit; outline: none; text-align: left; }
-    .spotpatch-ask-executor > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    .spotpatch-ask-executor[data-expandable="true"]::after { width: 7px; height: 7px; flex: 0 0 auto; border-right: 1.5px solid #8f96a3; border-bottom: 1.5px solid #8f96a3; content: ""; transform: translateY(-2px) rotate(45deg); }
-    .spotpatch-ask-executor[aria-expanded="true"]::after { transform: translateY(2px) rotate(225deg); }
-    .spotpatch-ask-executor:focus-visible { border-color: rgb(139 123 255 / 68%); box-shadow: 0 0 0 3px rgb(139 123 255 / 12%); }
-    .spotpatch-ask-executor:disabled { color: var(--spotpatch-text); background: rgb(255 255 255 / 3%); cursor: default; opacity: 1; }
-    .spotpatch-ask-executor[data-empty="true"]:disabled { color: var(--spotpatch-text-muted); }
-    .spotpatch-ask-executor-menu { display: grid; gap: 3px; border: 1px solid var(--spotpatch-border); border-radius: 9px; padding: 4px; background: var(--spotpatch-bg-input); max-height: 224px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; box-shadow: 0 10px 28px rgb(0 0 0 / 28%); }
-    .spotpatch-ask-executor-menu[hidden] { display: none; }
-    .spotpatch-ask-executor-option { box-sizing: border-box; min-height: 34px; border: 0; border-radius: 6px; padding: 7px 9px; color: var(--spotpatch-text-secondary); background: transparent; cursor: pointer; font: inherit; text-align: left; overflow-wrap: anywhere; }
-    .spotpatch-ask-executor-option[data-active="true"], .spotpatch-ask-executor-option:hover { color: #fff; background: rgb(139 123 255 / 13%); outline: none; }
-    .spotpatch-ask-executor-option[aria-selected="true"] { color: #f4f1ff; background: rgb(139 123 255 / 20%); }
-    .spotpatch-ask-executor-native { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
     .spotpatch-ask-executor-status { margin: 0; border-left: 2px solid var(--spotpatch-warning); padding-left: 8px; color: #d8b66c; font-size: 10.5px; line-height: 1.45; }
     .spotpatch-ask-safety { display: grid; gap: 8px; border: 1px solid rgb(82 168 255 / 16%); border-radius: 10px; padding: 10px 11px; background: rgb(82 168 255 / 4%); }
     .spotpatch-ask-data { display: flex; justify-content: space-between; gap: 10px; color: #aab3c2; font-size: 10.5px; }
@@ -1188,13 +1027,13 @@ function createContextualAskPanel(input) {
   const executorField = createMarkedElement(document, "div");
   executorField.className = "spotpatch-ask-field";
   const executorLabel = createMarkedElement(document, "label");
-  const executorPicker = createAskPicker(document, input.onViewChange);
+  const executorPicker = createSelectPicker(document, input.onViewChange);
   const executorSelect = executorPicker.select;
   executorLabel.htmlFor = executorPicker.trigger.id;
   const modelField = createMarkedElement(document, "div");
   modelField.className = "spotpatch-ask-field";
   const modelLabel = createMarkedElement(document, "label");
-  const modelPicker = createAskPicker(document, input.onViewChange);
+  const modelPicker = createSelectPicker(document, input.onViewChange);
   modelLabel.htmlFor = modelPicker.trigger.id;
   modelField.append(modelLabel, modelPicker.root);
   let modelExecutorId;
@@ -1398,7 +1237,7 @@ function createContextualAskPanel(input) {
       for (const executor of readyExecutors) {
         const option = document.createElement("option");
         option.value = executor.executorId;
-        option.textContent = executor.models === void 0 ? `${executor.label} \xB7 ${executor.effectiveModelLabel}` : executor.label;
+        option.textContent = executor.models === void 0 ? `${executor.label} · ${executor.effectiveModelLabel}` : executor.label;
         executorSelect.append(option);
       }
       if (readyExecutors.length === 0) {
@@ -1435,7 +1274,7 @@ function createContextualAskPanel(input) {
         expandedHeadline: messages.status[snapshot.status],
         action: messages.safety,
         expandedAction: messages.safety,
-        meta: `${snapshot.executor.label} \xB7 ${snapshot.executor.modelLabel}`,
+        meta: `${snapshot.executor.label} · ${snapshot.executor.modelLabel}`,
         recentActivities: Object.freeze([]),
         startedAt: snapshot.createdAt
       });
@@ -1462,7 +1301,7 @@ function createContextualAskPanel(input) {
           expandedHeadline: messages.status.running,
           action: activityLabel,
           expandedAction: activityLabel,
-          meta: `${currentJob.executor.label} \xB7 ${currentJob.executor.modelLabel}`,
+          meta: `${currentJob.executor.label} · ${currentJob.executor.modelLabel}`,
           activity: {
             key: `ask:${String(event.sequence)}`,
             kind: "read",