dsh-input-assistant 0.1.3 → 0.1.4

package/lib/client.js

@@ -252,7 +252,7 @@ function useFloatingPlacement(anchor, surface, visible, card = false) {
         rect,
         element.scrollHeight || element.getBoundingClientRect().height || 160,
         bounds,
-        card ? Math.min(640, rect.width || 440) : 440
+        card ? Math.min(640, rect.width || 480) : 480
       );
       setPlacement((previous) => previous && Object.keys(next).every((key) => previous[key] === next[key]) ? previous : next);
     };
@@ -299,19 +299,46 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
   const anchor = (0, import_react.useRef)(null);
   const menuRef = (0, import_react.useRef)(null);
   const noticeRef = (0, import_react.useRef)(null);
+  const previewRef = (0, import_react.useRef)(null);
+  const previewFocused = (0, import_react.useRef)(false);
+  const setPreviewRef = (0, import_react.useCallback)((node) => {
+    const previous = previewRef.current;
+    if (!node && previous && (previewFocused.current || previous.contains(document.activeElement))) {
+      queueMicrotask(() => {
+        if (!previous.isConnected && document.activeElement === document.body && anchor.current?.isConnected) findEditor(anchor.current)?.focus();
+      });
+    }
+    previewRef.current = node;
+    previewFocused.current = Boolean(node?.contains(document.activeElement));
+  }, []);
+  const menuTrigger = (0, import_react.useRef)(null);
+  const keyboardOpen = (0, import_react.useRef)(false);
+  const keyboardOptimize = (0, import_react.useRef)(false);
+  const composing = (0, import_react.useRef)(false);
+  const [isComposing, setIsComposing] = (0, import_react.useState)(false);
+  const menuId = (0, import_react.useId)();
   const [open, setOpen] = (0, import_react.useState)(false);
   const menuPlacement = useFloatingPlacement(anchor, menuRef, open);
-  const noticePlacement = useFloatingPlacement(anchor, noticeRef, !open && Boolean(state.notice));
-  const [provider, setProvider] = (0, import_react.useState)(state.settings.provider);
-  const [modelId, setModelId] = (0, import_react.useState)(state.settings.model);
+  const previewPlacement = useFloatingPlacement(anchor, previewRef, Boolean(state.preview), true);
+  const noticePlacement = useFloatingPlacement(anchor, noticeRef, !open && !state.preview && Boolean(state.notice || state.deletedDrafts.length || state.pendingUndoDrafts.length));
+  (0, import_react.useEffect)(() => {
+    const focusChanged = (event) => {
+      previewFocused.current = event.target instanceof Node && Boolean(previewRef.current?.contains(event.target));
+    };
+    const pointerChanged = (event) => {
+      if (event.target instanceof Node && !previewRef.current?.contains(event.target)) previewFocused.current = false;
+    };
+    document.addEventListener("focusin", focusChanged);
+    document.addEventListener("pointerdown", pointerChanged);
+    return () => {
+      document.removeEventListener("focusin", focusChanged);
+      document.removeEventListener("pointerdown", pointerChanged);
+    };
+  }, []);
   (0, import_react.useEffect)(() => {
     void directory?.load().catch(() => {
     });
   }, [directory]);
-  (0, import_react.useEffect)(() => {
-    setProvider(state.settings.provider);
-    setModelId(state.settings.model);
-  }, [state.settings.provider, state.settings.model]);
   (0, import_react.useLayoutEffect)(() => {
     if (removed) {
       controller.dispose();
@@ -323,10 +350,35 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
     const editor = findEditor(anchor.current);
     if (!editor) return;
     const selectionChanged = () => controller.notifySelectionChange();
-    const compositionStart = () => controller.setComposing(true);
-    const compositionEnd = () => controller.setComposing(false);
+    const compositionStart = () => {
+      composing.current = true;
+      setIsComposing(true);
+      controller.setComposing(true);
+    };
+    const compositionEnd = () => {
+      composing.current = false;
+      setIsComposing(false);
+      controller.setComposing(false);
+    };
     const keyDown = (event) => {
-      if (!controller.getSnapshot().suggestion || !canUseTab(event, editor, false)) return;
+      if (event.defaultPrevented || composing.current || event.isComposing || event.keyCode === 229 || editor.hasAttribute("data-composer-composing") || nativeMenuOpen(editor)) return;
+      const current = controller.getSnapshot();
+      if (event.key === "Escape") {
+        const target = document.activeElement;
+        const inside = focusedIn(editor) || anchor.current?.contains(target) || menuRef.current?.contains(target) || previewRef.current?.contains(target);
+        if (!inside) return;
+        if (current.preview) {
+          controller.dismissOptimization();
+          editor.focus();
+        } else if (open) {
+          setOpen(false);
+          menuTrigger.current?.focus();
+        } else if (current.suggestion) controller.dismissSuggestion();
+        else return;
+        event.preventDefault();
+        return;
+      }
+      if (!current.suggestion || !canUseTab(event, editor, false)) return;
       if (![...document.querySelectorAll("[data-dsh-ia-visible-suggestion]")].some((node) => node.getAttribute("data-dsh-ia-session") === sessionId)) return;
       if (controller.acceptSuggestion()) event.preventDefault();
     };
@@ -344,31 +396,46 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
       editor.removeEventListener("compositionend", compositionEnd);
       window.removeEventListener("keydown", keyDown);
     };
-  }, [controller, sessionId]);
+  }, [controller, sessionId, open]);
+  (0, import_react.useLayoutEffect)(() => {
+    if (open && menuPlacement && keyboardOpen.current) {
+      (menuRef.current?.querySelector("button:not(:disabled),select:not(:disabled),input:not(:disabled)") ?? menuRef.current)?.focus();
+      keyboardOpen.current = false;
+    }
+  }, [open, menuPlacement]);
+  (0, import_react.useLayoutEffect)(() => {
+    if (state.preview && previewPlacement && (keyboardOptimize.current || anchor.current?.contains(document.activeElement))) {
+      previewRef.current?.querySelector("button:not(:disabled)")?.focus();
+      keyboardOptimize.current = false;
+    }
+  }, [state.preview, previewPlacement]);
+  (0, import_react.useEffect)(() => {
+    if (state.preview) setOpen(false);
+  }, [state.preview]);
   (0, import_react.useEffect)(() => {
     if (!open) return;
     const close = (event) => {
       if (event.target instanceof Node && !anchor.current?.contains(event.target) && !menuRef.current?.contains(event.target)) setOpen(false);
     };
-    const escape = (event) => {
-      if (event.key === "Escape" && !event.defaultPrevented) {
-        setOpen(false);
-        event.preventDefault();
-      }
-    };
     document.addEventListener("pointerdown", close);
-    window.addEventListener("keydown", escape);
     return () => {
       document.removeEventListener("pointerdown", close);
-      window.removeEventListener("keydown", escape);
     };
   }, [open]);
   const preserveSelection = (event) => {
     event.preventDefault();
   };
   const canEdit = input.phase === "plain" && !state.busy && !state.settingsSaving;
-  const canOptimize = canEdit && state.settings.optimizeEnabled;
+  const canOptimize = canEdit && !state.preview && state.settings.optimizeEnabled;
   const pure = !input.occurrences.length && !input.attachmentIds.length;
+  const auxiliaryRoute = state.settings.provider && state.settings.model ? { provider: state.settings.provider, model: state.settings.model } : model.current ?? state.status?.route;
+  const requestingSuggestion = state.suggestionStatus === "generating";
+  const canRequestSuggestion = canEdit && pure && !isComposing && !state.preview && state.connected && !running && !state.status?.running && !requestingSuggestion;
+  const retryLabel = state.suggestionStatus === "failed" || state.suggestionStatus === "abstained" ? "\u91CD\u8BD5\u672C\u6B21\u5EFA\u8BAE" : "\u751F\u6210\u5EFA\u8BAE";
+  const predict = () => {
+    findEditor(anchor.current)?.focus();
+    controller.retrySuggestion();
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia dsh-ia-root", ref: anchor, "data-dsh-input-assistant": "", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "button",
@@ -377,43 +444,127 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
         type: "button",
         disabled: !canOptimize || !input.draft.trim() || !state.connected,
         onPointerDown: preserveSelection,
-        onClick: () => {
+        onClick: (event) => {
+          keyboardOptimize.current = event.detail === 0;
           void controller.optimize();
         },
         title: "\u6709\u9009\u533A\u65F6\u4F18\u5316\u9009\u533A\uFF0C\u5426\u5219\u4F18\u5316\u6574\u7A3F",
         children: state.busy === "optimize" ? "\u4F18\u5316\u4E2D\u2026" : "\u4F18\u5316"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", "aria-label": "\u8F93\u5165\u52A9\u624B\u83DC\u5355", "aria-expanded": open, onPointerDown: preserveSelection, onClick: () => setOpen((value) => !value), children: "\u25BE" }),
-    !open && state.notice && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      {
+        className: "dsh-ia-trigger dsh-ia-predict-btn",
+        type: "button",
+        "aria-label": "\u9884\u6D4B",
+        disabled: !canRequestSuggestion,
+        onPointerDown: preserveSelection,
+        onClick: predict,
+        title: "\u751F\u6210\u4E00\u6B21\u9884\u6D4B\uFF0C\u67E5\u770B\u5019\u9009\u540E\u7531\u4F60\u91C7\u7EB3\uFF1B\u4E0D\u4F1A\u76F4\u63A5\u6539\u5199\u6216\u53D1\u9001",
+        children: requestingSuggestion ? "\u9884\u6D4B\u4E2D\u2026" : "\u9884\u6D4B"
+      }
+    ),
+    state.busy === "optimize" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "dsh-ia-cancel-btn", type: "button", onClick: () => {
+      controller.cancelOperation();
+      findEditor(anchor.current)?.focus();
+    }, children: "\u53D6\u6D88\u4F18\u5316" }),
+    !state.busy && requestingSuggestion && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "dsh-ia-cancel-btn", type: "button", onClick: () => {
+      controller.cancelOperation();
+      findEditor(anchor.current)?.focus();
+    }, children: "\u53D6\u6D88\u9884\u6D4B" }),
+    state.busy === "stash" && state.stashClearPending && !state.stashClearCancelled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "dsh-ia-cancel-btn", type: "button", onClick: () => controller.cancelOperation(), children: "\u53D6\u6D88\u6E05\u7A7A" }),
+    !open && !state.preview && state.suggestionStatus === "failed" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "dsh-ia-inline-status", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { role: "status", children: "\u5EFA\u8BAE\u672A\u5B8C\u6210" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          "aria-label": "\u91CD\u8BD5\u5EFA\u8BAE",
+          title: state.suggestionMessage,
+          disabled: !canRequestSuggestion,
+          onPointerDown: preserveSelection,
+          onClick: predict,
+          children: "\u91CD\u8BD5"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      {
+        ref: menuTrigger,
+        className: "dsh-ia-menu-btn",
+        type: "button",
+        "aria-label": "\u8F93\u5165\u52A9\u624B\u83DC\u5355",
+        "aria-expanded": open,
+        "aria-haspopup": "dialog",
+        "aria-controls": menuId,
+        title: auxiliaryRoute ? `\u8F85\u52A9\u6A21\u578B\uFF1A${auxiliaryRoute.provider} / ${auxiliaryRoute.model}` : "\u8F93\u5165\u52A9\u624B\u83DC\u5355",
+        onPointerDown: preserveSelection,
+        onClick: (event) => {
+          keyboardOpen.current = event.detail === 0;
+          setOpen((value) => !value);
+        },
+        children: "\u25BE"
+      }
+    ),
+    !open && !state.preview && (state.notice || state.deletedDrafts.length > 0 || state.pendingUndoDrafts.length > 0) && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "div",
       {
         ref: noticeRef,
         role: "status",
         className: "dsh-ia dsh-ia-notice",
         style: noticePlacement ?? { visibility: "hidden" },
-        onClick: () => controller.clearNotice(),
-        children: state.notice
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: state.notice }),
+          state.deletedDrafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: Boolean(state.busy), onClick: () => {
+            void controller.undoDeleteDrafts();
+          }, children: "\u64A4\u9500\u5220\u9664" }),
+          state.deletedDrafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+            void copyText(state.deletedDrafts.map((draft) => draft.text).join("\n\n"), controller, "\u5907\u4EFD\u5DF2\u590D\u5236");
+          }, children: "\u590D\u5236\u5220\u9664\u5907\u4EFD" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PendingUndo, { drafts: state.pendingUndoDrafts, controller, busy: Boolean(state.busy) }),
+          state.notice && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", "aria-label": "\u5173\u95ED\u63D0\u793A", onClick: () => controller.clearNotice(), children: "\xD7" })
+        ]
+      }
+    ), document.body),
+    state.preview && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        ref: setPreviewRef,
+        className: "dsh-ia dsh-ia-menu dsh-ia-preview",
+        role: "dialog",
+        "aria-label": "\u4F18\u5316\u9884\u89C8",
+        style: previewPlacement ?? { visibility: "hidden" },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: "\u4F18\u5316\u9884\u89C8" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-ia-muted", children: "\u539F\u7A3F\u5C1A\u672A\u4FEE\u6539\u3002\u67E5\u770B\u589E\u5220\u5185\u5BB9\u540E\u51B3\u5B9A\u662F\u5426\u91C7\u7EB3\uFF1B\u91C7\u7EB3\u540E\u4ECD\u7531\u4F60\u53D1\u9001\u3002" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DiffView, { before: state.preview.beforeTarget, after: state.preview.text }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "button",
+              {
+                type: "button",
+                disabled: !state.connected || state.settingsSaving || Boolean(state.busy),
+                onPointerDown: preserveSelection,
+                onClick: () => {
+                  if (controller.applyOptimization()) findEditor(anchor.current)?.focus();
+                },
+                children: "\u91C7\u7EB3\u4F18\u5316"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+              controller.dismissOptimization();
+              findEditor(anchor.current)?.focus();
+            }, children: "\u4FDD\u7559\u539F\u6587" })
+          ] })
+        ]
       }
     ), document.body),
-    open && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref: menuRef, className: "dsh-ia dsh-ia-menu", "aria-label": "\u8F93\u5165\u52A9\u624B", style: menuPlacement ?? { visibility: "hidden" }, children: [
+    open && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { id: menuId, ref: menuRef, role: "dialog", tabIndex: -1, className: "dsh-ia dsh-ia-menu", "aria-label": "\u8F93\u5165\u52A9\u624B", style: menuPlacement ?? { visibility: "hidden" }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: "\u8F93\u5165\u52A9\u624B" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u5F53\u524D\u4F1A\u8BDD \xB7 \u91C7\u7EB3\u540E\u7531\u4F60\u53D1\u9001" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u5F53\u524D\u4F1A\u8BDD\u8349\u7A3F\u4E0E\u5FEB\u6377\u64CD\u4F5C \xB7 \u91C7\u7EB3\u540E\u7531\u4F60\u53D1\u9001" }),
       state.settingsSaving && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { role: "status", children: "\u8BBE\u7F6E\u4FDD\u5B58\u4E2D\u2026" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "checkbox", disabled: state.settingsSaving, checked: state.settings.optimizeEnabled, onChange: (event) => {
-            void controller.updateSettings({ optimizeEnabled: event.target.checked });
-          } }),
-          "\u63D0\u793A\u8BCD\u4F18\u5316"
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "checkbox", disabled: state.settingsSaving, checked: state.settings.stashEnabled, onChange: (event) => {
-            void controller.updateSettings({ stashEnabled: event.target.checked });
-          } }),
-          "\u8349\u7A3F\u6682\u5B58"
-        ] })
-      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
         "\u4F18\u5316\u5F3A\u5EA6 ",
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
@@ -433,7 +584,37 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
           }
         )
       ] }),
-      state.notice && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-notice", role: "status", children: state.notice }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u4F18\u5316\u5F3A\u5EA6\u4E3A\u5168\u5C40\u8BBE\u7F6E\uFF0C\u5BF9\u6240\u6709\u4F1A\u8BDD\u751F\u6548\u3002" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
+        "\u9884\u6D4B\u8BE6\u7565\u5EA6 ",
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "select",
+          {
+            "aria-label": "\u9884\u6D4B\u8BE6\u7565\u5EA6",
+            value: state.settings.predictionDetail,
+            disabled: state.settingsSaving,
+            onChange: (event) => {
+              void controller.updateSettings({ predictionDetail: event.target.value });
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "concise", children: "\u7B80\u660E" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "standard", children: "\u6807\u51C6" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "detailed", children: "\u8BE6\u5C3D" })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u9884\u6D4B\u8BE6\u7565\u5EA6\u4E3A\u5168\u5C40\u8BBE\u7F6E\uFF1B\u8BE6\u5C3D\u6A21\u5F0F\u53EF\u63D0\u4F9B\u591A\u884C\u7ED3\u6784\uFF0C\u4ECD\u9075\u5B88\u957F\u5EA6\u4E0A\u9650\u3002" }),
+      (state.notice || state.deletedDrafts.length > 0 || state.pendingUndoDrafts.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-notice", role: "status", children: [
+        state.notice,
+        state.deletedDrafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: Boolean(state.busy), onClick: () => {
+          void controller.undoDeleteDrafts();
+        }, children: "\u64A4\u9500\u5220\u9664" }),
+        state.deletedDrafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+          void copyText(state.deletedDrafts.map((draft) => draft.text).join("\n\n"), controller, "\u5907\u4EFD\u5DF2\u590D\u5236");
+        }, children: "\u590D\u5236\u5220\u9664\u5907\u4EFD" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PendingUndo, { drafts: state.pendingUndoDrafts, controller, busy: Boolean(state.busy) })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", { type: "button", disabled: !canOptimize, onPointerDown: preserveSelection, onClick: () => controller.lockSelection(), children: [
           "\u4FDD\u62A4\u9009\u4E2D\u539F\u6587",
@@ -444,7 +625,7 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u4EE3\u7801\u3001\u8DEF\u5F84\u548C\u7F51\u5740\u81EA\u52A8\u4FDD\u62A4\uFF1B\u624B\u52A8\u4FDD\u62A4\u5728\u7F16\u8F91\u8349\u7A3F\u540E\u6E05\u9664\u3002" }),
       state.change && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { children: "\u67E5\u770B\u6539\u52A8" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-pre dsh-ia-diff", children: diffText(state.change.beforeTarget, state.change.afterTarget).map((part, index) => part.type === "insert" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ins", { children: part.value }, index) : part.type === "delete" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("del", { children: part.value }, index) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: part.value }, index)) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DiffView, { before: state.change.beforeTarget, after: state.change.afterTarget }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: !controller.canRestore(), onPointerDown: preserveSelection, onClick: () => controller.restoreOriginal(), children: "\u8FD8\u539F" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
@@ -475,51 +656,27 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
           draft.id
         )),
         state.drafts.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-ia-muted", children: "\u6682\u5B58\u540E\u53EF\u4EE5\u5148\u8FFD\u95EE\u522B\u7684\uFF0C\u518D\u627E\u56DE\u539F\u6765\u7684\u8349\u7A3F\u3002" }),
-        state.drafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+        state.drafts.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: Boolean(state.busy), onClick: () => {
           void controller.clearDrafts();
         }, children: "\u6E05\u7A7A\u6682\u5B58" })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { children: "\u8F93\u5165\u5EFA\u8BAE" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "checkbox", disabled: state.settingsSaving, checked: state.settings.nextEnabled, onChange: (event) => {
-              void controller.updateSettings({ nextEnabled: event.target.checked });
-            } }),
-            "\u56DE\u590D\u540E\u9884\u6D4B"
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "checkbox", disabled: state.settingsSaving, checked: state.settings.completionEnabled, onChange: (event) => {
-              void controller.updateSettings({ completionEnabled: event.target.checked });
-            } }),
-            "\u8F93\u5165\u7EED\u5199"
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
-          "\u663E\u793A\u65B9\u5F0F ",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", { "aria-label": "\u663E\u793A\u65B9\u5F0F", disabled: state.settingsSaving, value: state.settings.displayMode, onChange: (event) => {
-            void controller.updateSettings({ displayMode: event.target.value });
-          }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "ghost", children: "\u7070\u5B57" }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "panel", children: "\u5019\u9009\u9762\u677F" })
-          ] })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-muted dsh-ia-route", children: [
+          "\u8F85\u52A9\u6A21\u578B\uFF1A",
+          auxiliaryRoute ? `${auxiliaryRoute.provider} / ${auxiliaryRoute.model}` : "\u5C1A\u672A\u9009\u62E9",
+          state.settings.provider ? "\uFF08\u56FA\u5B9A\uFF09" : "\uFF08\u8DDF\u968F\u8F93\u5165\u6846\uFF09"
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-row", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => controller.dismissSuggestion(), children: "\u6682\u505C\u81F3\u4E0B\u6B21\u7F16\u8F91" }) })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "dsh-ia-section", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { children: "\u8F85\u52A9\u6A21\u578B\u8BBE\u7F6E" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u4E24\u9879\u7559\u7A7A\u65F6\u8DDF\u968F\u8F93\u5165\u6846\u6A21\u578B\uFF1B\u8F85\u52A9\u8C03\u7528\u5355\u72EC\u6D88\u8017\u6A21\u578B\u7528\u91CF\u3002" }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: "dsh-ia-field", children: [
-          "\u63D0\u4F9B\u5546",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { disabled: state.settingsSaving, value: provider, onChange: (event) => setProvider(event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", autoComplete: "off" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: "dsh-ia-field", children: [
-          "\u6A21\u578B",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { disabled: state.settingsSaving, value: modelId, onChange: (event) => setModelId(event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", autoComplete: "off" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: state.settingsSaving, onClick: () => {
-          void controller.updateSettings({ provider, model: modelId });
-        }, children: "\u4FDD\u5B58\u6A21\u578B\u8BBE\u7F6E" })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-suggestion-state", role: "status", "aria-label": "\u8F93\u5165\u5EFA\u8BAE\u72B6\u6001", "aria-live": "polite", children: state.suggestionMessage || "\u53EF\u624B\u52A8\u751F\u6210\u4E00\u6B21\u5EFA\u8BAE\uFF1B\u5F00\u542F\u81EA\u52A8\u5EFA\u8BAE\u540E\u4E5F\u4F1A\u6309\u8BBE\u7F6E\u89E6\u53D1\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "Tab \u91C7\u7EB3\uFF0CEsc \u5FFD\u7565\uFF1B\u5EFA\u8BAE\u4E0D\u4F1A\u81EA\u52A8\u53D1\u9001\u3002" }),
+        !pure && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u624B\u52A8\u5EFA\u8BAE\u4EC5\u652F\u6301\u65E0\u9644\u4EF6\u3001\u65E0\u5F15\u7528\u7684\u7EAF\u6587\u672C\u8349\u7A3F\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: !canRequestSuggestion, onPointerDown: preserveSelection, onClick: () => {
+            predict();
+            setOpen(false);
+          }, children: retryLabel }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => controller.dismissSuggestion(), children: "\u6682\u505C\u81F3\u4E0B\u6B21\u7F16\u8F91" })
+        ] })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { children: "\u672C\u6B21\u4F7F\u7528\u7EDF\u8BA1" }),
@@ -538,10 +695,36 @@ function AssistantRight({ runtime, sessionId, useInput, useSession, inputActions
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-muted", children: "\u4EC5\u4FDD\u7559\u5728\u672C\u6B21\u63D2\u4EF6\u8FD0\u884C\u5185\uFF0C\u4E0D\u4E0A\u4F20\uFF1B\u5FFD\u7565\u5EFA\u8BAE\u4E0D\u4F1A\u88AB\u89C6\u4E3A\u8D1F\u53CD\u9988\u3002" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-ia-muted", children: "\u66F4\u591A\u8BBE\u7F6E\uFF1ADSH \u8BBE\u7F6E \u2192 \u8F93\u5165\u52A9\u624B" })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-ia-muted", children: "\u529F\u80FD\u5F00\u5173\u3001\u663E\u793A\u65B9\u5F0F\u4E0E\u8F85\u52A9\u6A21\u578B\uFF1ADSH \u8BBE\u7F6E \u2192 \u8F93\u5165\u52A9\u624B\uFF08\u5168\u5C40\u8BBE\u7F6E\uFF09" })
     ] }), document.body)
   ] });
 }
+function DiffView({ before, after }) {
+  const parts = (0, import_react.useMemo)(() => diffText(before, after), [before, after]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-pre dsh-ia-diff", children: parts.map((part, index) => part.type === "insert" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ins", { children: part.value }, index) : part.type === "delete" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("del", { children: part.value }, index) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: part.value }, index)) });
+}
+function PendingUndo({ drafts, controller, busy }) {
+  if (!drafts.length) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-pending-undo", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("summary", { children: [
+        "\u6682\u672A\u6062\u590D\u7684\u8349\u7A3F (",
+        drafts.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-ia-pre", children: drafts.map((draft) => draft.text).join("\n\n") })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-ia-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: busy, onClick: () => {
+        void controller.undoDeleteDrafts("pending");
+      }, children: "\u91CD\u8BD5\u6062\u590D\u8349\u7A3F" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+        void copyText(drafts.map((draft) => draft.text).join("\n\n"), controller, "\u5F85\u6062\u590D\u8349\u7A3F\u5DF2\u590D\u5236");
+      }, children: "\u590D\u5236\u5F85\u6062\u590D\u8349\u7A3F" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: busy, onClick: () => controller.discardPendingUndo(), children: "\u653E\u5F03\u6B64\u6062\u590D\u5907\u4EFD" })
+    ] })
+  ] });
+}
 function DraftCard({ draft, controller, canEdit, canReplace }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "dsh-ia-draft", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { children: draft.text.split("\n")[0].slice(0, 50) || "\u672A\u547D\u540D\u8349\u7A3F" }),
@@ -551,6 +734,9 @@ function DraftCard({ draft, controller, canEdit, canReplace }) {
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: !canEdit, onPointerDown: (event) => event.preventDefault(), onClick: () => controller.restoreDraft(draft, "append"), children: "\u8FFD\u52A0" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: !canEdit, onPointerDown: (event) => event.preventDefault(), onClick: () => controller.restoreDraft(draft, "replace"), children: "\u66FF\u6362" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => {
+        void copyText(draft.text, controller, "\u8349\u7A3F\u5DF2\u590D\u5236");
+      }, children: "\u590D\u5236\u8349\u7A3F" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", disabled: Boolean(controller.getSnapshot().busy), onClick: () => {
         void controller.deleteDraft(draft.id);
       }, children: "\u5220\u9664" }),
       canReplace && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onPointerDown: (event) => event.preventDefault(), onClick: () => {
@@ -559,12 +745,12 @@ function DraftCard({ draft, controller, canEdit, canReplace }) {
     ] })
   ] });
 }
-async function copyText(text, controller) {
+async function copyText(text, controller, success = "\u539F\u6587\u5DF2\u590D\u5236") {
   try {
     await navigator.clipboard.writeText(text);
-    controller.notice("\u539F\u6587\u5DF2\u590D\u5236");
+    controller.notice(success);
   } catch {
-    controller.notice("\u590D\u5236\u4E0D\u53EF\u7528\uFF0C\u8BF7\u5728\u6539\u52A8\u9762\u677F\u624B\u52A8\u9009\u62E9\u539F\u6587");
+    controller.notice("\u590D\u5236\u4E0D\u53EF\u7528\uFF0C\u8BF7\u5C55\u5F00\u5BF9\u5E94\u6587\u672C\u540E\u624B\u52A8\u9009\u62E9\u590D\u5236");
   }
 }
 function AssistantOverlay({ runtime, sessionId }) {
@@ -573,12 +759,13 @@ function AssistantOverlay({ runtime, sessionId }) {
   const panelRef = (0, import_react.useRef)(null);
   const [geometry, setGeometry] = (0, import_react.useState)(null);
   const suggestion = state.suggestion;
-  const panelPlacement = useFloatingPlacement(anchor, panelRef, Boolean(suggestion) && state.settings.displayMode === "panel", true);
+  const displayMode = state.settings.predictionDetail === "detailed" ? "panel" : state.settings.displayMode;
+  const panelPlacement = useFloatingPlacement(anchor, panelRef, Boolean(suggestion) && displayMode === "panel", true);
   (0, import_react.useEffect)(() => {
-    if (suggestion && (state.settings.displayMode === "panel" && panelPlacement || geometry)) controller.markExposed(suggestion.snapshot.requestId);
-  }, [controller, suggestion, geometry, panelPlacement, state.settings.displayMode]);
+    if (suggestion && (displayMode === "panel" && panelPlacement || geometry)) controller.markExposed(suggestion.snapshot.requestId);
+  }, [controller, suggestion, geometry, panelPlacement, displayMode]);
   (0, import_react.useLayoutEffect)(() => {
-    if (!suggestion || state.settings.displayMode !== "ghost") {
+    if (!suggestion || displayMode !== "ghost") {
       setGeometry(null);
       return;
     }
@@ -600,7 +787,7 @@ function AssistantOverlay({ runtime, sessionId }) {
       editor?.removeEventListener("blur", update);
       resize?.disconnect();
     };
-  }, [suggestion, state.settings.displayMode]);
+  }, [suggestion, displayMode]);
   const ghostStyle = geometry ? {
     left: geometry.left,
     top: geometry.top,
@@ -611,7 +798,7 @@ function AssistantOverlay({ runtime, sessionId }) {
     letterSpacing: geometry.letterSpacing
   } : void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { ref: anchor, className: "dsh-ia", style: { display: "contents" }, children: [
-    suggestion && state.settings.displayMode === "panel" && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    suggestion && displayMode === "panel" && (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "div",
       {
         ref: panelRef,
@@ -627,7 +814,12 @@ function AssistantOverlay({ runtime, sessionId }) {
         ]
       }
     ), document.body),
-    suggestion && geometry && state.settings.displayMode === "ghost" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    suggestion && geometry && displayMode === "ghost" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "dsh-ia-sr-only", role: "status", "aria-atomic": "true", children: [
+        "\u6709\u8F93\u5165\u5EFA\u8BAE\uFF1A",
+        suggestion.text,
+        "\u3002\u6309 Tab \u91C7\u7EB3\uFF0C\u6309 Esc \u5FFD\u7565\u3002"
+      ] }),
       suggestion.snapshot.draft === "" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { hidden: true, "data-dsh-ia-empty-ghost": "" }),
       (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "span",
@@ -651,6 +843,7 @@ var DEFAULT_CONFIG = Object.freeze({
   optimizationStrength: "standard",
   nextEnabled: true,
   completionEnabled: true,
+  predictionDetail: "standard",
   displayMode: "ghost",
   debounceMs: 600,
   minIntervalMs: 2e3,
@@ -685,21 +878,37 @@ var initial = () => ({
   status: null,
   settings: { ...DEFAULT_CONFIG },
   busy: null,
+  stashClearCancelled: false,
+  stashClearPending: false,
   notice: "",
   suggestion: null,
+  suggestionStatus: "idle",
+  suggestionMessage: "",
+  preview: null,
   change: null,
   drafts: [],
+  deletedDrafts: [],
+  pendingUndoDrafts: [],
   locked: [],
   connected: false,
   settingsSaving: false,
   metrics: emptyMetrics()
 });
 var InputAssistantController = class {
-  constructor(sessionId, transport, metrics, saveSettings) {
+  constructor(sessionId, transport, metrics, saveSettings, undo) {
     this.sessionId = sessionId;
     this.transport = transport;
     this.saveSettings = saveSettings;
     if (metrics) this.state.metrics = { ...metrics };
+    if (undo && undo.generation === transport.generation()) {
+      this.clientGeneration = undo.generation;
+      this.state.pendingUndoDrafts = undo.pending.map((draft) => ({ ...draft }));
+      if (undo.expiresAt > Date.now()) {
+        this.state.deletedDrafts = undo.recent.map((draft) => ({ ...draft }));
+        this.undoExpiresAt = undo.expiresAt;
+        this.armUndoExpiry();
+      }
+    }
   }
   state = initial();
   listeners = /* @__PURE__ */ new Set();
@@ -708,14 +917,22 @@ var InputAssistantController = class {
   timer;
   /** Cache key the armed completion timer was scheduled for; null when no timer is armed. */
   timerKey = null;
+  manualTimerKey = null;
   poll;
+  undoTimer;
+  undoExpiresAt = 0;
+  requestPrefix = Array.from(crypto.getRandomValues(new Uint32Array(4)), (word) => word.toString(36)).join("-");
+  completionRetryAt = 0;
   polling = false;
   lifecycle = new AbortController();
   disposed = false;
   composing = false;
   settingsPending = false;
   settingsEpoch = 0;
+  draftsEpoch = 0;
+  stashEpoch = 0;
   nextTurns = /* @__PURE__ */ new Set();
+  failedNextKey = null;
   nextCache = null;
   completionCache = /* @__PURE__ */ new Map();
   failedCompletionKey = null;
@@ -726,6 +943,22 @@ var InputAssistantController = class {
   lockedRanges = [];
   exposed = /* @__PURE__ */ new Set();
   acceptance = null;
+  getUndoSnapshot() {
+    return {
+      recent: this.undoExpiresAt > Date.now() ? this.state.deletedDrafts.map((draft) => ({ ...draft })) : [],
+      expiresAt: this.undoExpiresAt,
+      pending: this.state.pendingUndoDrafts.map((draft) => ({ ...draft })),
+      generation: this.clientGeneration
+    };
+  }
+  armUndoExpiry() {
+    clearTimeout(this.undoTimer);
+    if (!Number.isFinite(this.undoExpiresAt)) return;
+    this.undoTimer = setTimeout(() => {
+      this.undoExpiresAt = 0;
+      this.patch({ deletedDrafts: [], notice: this.state.notice === "\u5DF2\u5220\u9664\u6682\u5B58\uFF0C10 \u79D2\u5185\u53EF\u64A4\u9500" ? "" : this.state.notice });
+    }, Math.max(0, this.undoExpiresAt - Date.now()));
+  }
   getSnapshot = () => this.state;
   subscribe = (listener) => {
     this.listeners.add(listener);
@@ -742,15 +975,35 @@ var InputAssistantController = class {
     if (this.poll || this.disposed) return;
     void this.refresh();
     void this.refreshDrafts();
-    this.poll = setInterval(() => {
+    this.schedulePoll();
+    document.addEventListener("visibilitychange", this.visibilityChanged);
+  }
+  visibilityChanged = () => {
+    clearTimeout(this.poll);
+    if (document.visibilityState === "hidden") {
+      if (this.active?.snapshot.operation !== "optimize" && !this.active?.snapshot.manual) this.cancelActive();
+      this.clearTimer();
+      this.patch({ suggestion: null, suggestionStatus: "paused", suggestionMessage: "\u9875\u9762\u5DF2\u9690\u85CF\uFF0C\u81EA\u52A8\u5EFA\u8BAE\u5DF2\u6682\u505C" });
+    } else {
+      void this.refresh();
+      this.driveSuggestions();
+    }
+    this.schedulePoll();
+  };
+  schedulePoll() {
+    const delay = document.visibilityState === "hidden" ? 1e4 : this.binding?.running || this.state.busy ? 900 : 3e3;
+    this.poll = setTimeout(() => {
       void this.refresh();
-    }, 900);
+      this.schedulePoll();
+    }, delay);
   }
   dispose() {
     if (this.disposed) return;
     this.cancelActive();
     this.clearTimer();
-    clearInterval(this.poll);
+    clearTimeout(this.poll);
+    clearTimeout(this.undoTimer);
+    document.removeEventListener("visibilitychange", this.visibilityChanged);
     this.lifecycle.abort();
     this.disposed = true;
     this.listeners.clear();
@@ -764,7 +1017,9 @@ var InputAssistantController = class {
     if (generation !== this.clientGeneration) {
       this.clientGeneration = generation;
       this.invalidate(true);
-      this.patch({ connected: false, status: null, drafts: [] });
+      clearTimeout(this.undoTimer);
+      this.undoExpiresAt = 0;
+      this.patch({ connected: false, status: null, drafts: [], deletedDrafts: [], pendingUndoDrafts: [] });
       if (generation !== null && this.poll) {
         void this.refresh();
         void this.refreshDrafts();
@@ -776,7 +1031,7 @@ var InputAssistantController = class {
       if (previous.input.draft !== binding.input.draft) this.observeAcceptedEdit(binding.input.draft);
       if (previous.input.draft !== binding.input.draft) this.lockedRanges = [];
       if (previous.input.draft !== binding.input.draft) this.failedCompletionKey = null;
-      this.patch({ suggestion: null, ...previous.input.draft !== binding.input.draft ? { locked: [] } : {} });
+      this.patch({ suggestion: null, suggestionStatus: "idle", suggestionMessage: "", preview: null, ...previous.input.draft !== binding.input.draft ? { locked: [] } : {} });
       if (this.suppressUntilEdit !== null && binding.input.draft !== this.suppressUntilEdit) this.suppressUntilEdit = null;
     }
     this.driveSuggestions();
@@ -803,8 +1058,27 @@ var InputAssistantController = class {
   dismissSuggestion() {
     this.clearTimer();
     this.cancelActive();
-    this.patch({ suggestion: null });
+    this.patch({ suggestion: null, suggestionStatus: "paused", suggestionMessage: "\u5DF2\u6682\u505C\u81F3\u4E0B\u6B21\u7F16\u8F91" });
+    this.suppressUntilEdit = this.binding?.input.draft ?? "";
+  }
+  dismissOptimization() {
+    this.suppressUntilEdit = this.binding?.input.draft ?? "";
+    this.patch({ preview: null, notice: "\u5DF2\u4FDD\u7559\u539F\u6587" });
+  }
+  cancelOperation() {
+    if (this.state.busy === "stash" && this.state.stashClearPending) {
+      this.stashEpoch++;
+      this.patch({ stashClearCancelled: true, notice: "\u5DF2\u53D6\u6D88\u6E05\u7A7A\uFF1B\u4FDD\u5B58\u5B8C\u6210\u540E\u4ECD\u4FDD\u7559\u5F53\u524D\u8F93\u5165" });
+      return;
+    }
+    if (this.state.busy === "stash") {
+      this.patch({ notice: "\u5B58\u50A8\u64CD\u4F5C\u6B63\u5728\u5B8C\u6210\uFF0C\u8BF7\u7A0D\u540E\u518D\u64CD\u4F5C" });
+      return;
+    }
+    this.cancelActive();
+    this.clearTimer();
     this.suppressUntilEdit = this.binding?.input.draft ?? "";
+    this.patch({ preview: null, suggestion: null, notice: "\u5DF2\u53D6\u6D88\uFF0C\u539F\u7A3F\u5DF2\u4FDD\u7559" });
   }
   clearNotice() {
     this.patch({ notice: "" });
@@ -823,10 +1097,10 @@ var InputAssistantController = class {
       const previous = this.state.status;
       const changed = previous && (status.sourceTurnId !== previous.sourceTurnId || status.generation !== previous.generation || this.routeKey(status.route) !== this.routeKey(previous.route) || status.running !== previous.running || JSON.stringify(status.settings) !== JSON.stringify(previous.settings));
       if (changed) this.invalidate(true);
-      this.patch({ status, settings: status.settings, connected: this.transport.generation() !== null });
+      if (!previous || changed || !this.state.connected) this.patch({ status, settings: status.settings, connected: true });
       this.driveSuggestions();
     } catch {
-      if (!this.disposed) {
+      if (!this.disposed && this.transport.generation() === generation && settingsEpoch === this.settingsEpoch) {
         this.invalidate(false, false);
         this.patch({ connected: false });
       }
@@ -905,7 +1179,7 @@ var InputAssistantController = class {
     }
     this.clearTimer();
     this.cancelActive();
-    this.patch({ suggestion: null, busy: "optimize", notice: "" });
+    this.patch({ suggestion: null, preview: null, busy: "optimize", notice: "" });
     const snapshot = this.snapshot("optimize", target.span, target.text);
     if (!snapshot) {
       this.patch({ busy: null, notice: "\u8FDE\u63A5\u6216\u6A21\u578B\u5C1A\u672A\u5C31\u7EEA\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5" });
@@ -919,24 +1193,14 @@ var InputAssistantController = class {
         this.patch({ notice: "\u6CA1\u6709\u53EF\u5E94\u7528\u7684\u4F18\u5316\u7ED3\u679C\uFF0C\u539F\u6587\u5DF2\u4FDD\u7559" });
         return;
       }
-      const after = binding.input.draft.slice(0, target.clipboardStart) + result.text + binding.input.draft.slice(target.clipboardEnd);
-      if (!binding.actions.insertText(result.text, target.span)) {
-        this.patch({ notice: "\u8349\u7A3F\u5DF2\u53D8\u5316\uFF0C\u5DF2\u653E\u5F03\u672C\u6B21\u7ED3\u679C" });
-        return;
-      }
-      binding.actions.persistDraft?.();
-      this.suppressUntilEdit = after;
-      this.patch({ change: {
-        before: binding.input.draft,
-        after,
+      this.patch({ preview: {
+        request: snapshot,
+        text: result.text,
         beforeTarget: target.text,
-        afterTarget: result.text,
-        span: { ...target.span, end: target.span.start + result.text.length },
-        sourceTurnId: snapshot.sourceTurnId,
-        connectionGeneration: snapshot.connectionGeneration,
-        routeKey: snapshot.routeKey,
+        clipboardStart: target.clipboardStart,
+        clipboardEnd: target.clipboardEnd,
         clientGeneration: active.clientGeneration
-      }, notice: "\u5DF2\u4F18\u5316\uFF0C\u53EF\u67E5\u770B\u6539\u52A8\u6216\u64A4\u9500" });
+      }, notice: "" });
     } catch (error) {
       if (!active.controller.signal.aborted) this.patch({ notice: this.errorMessage(error) });
     } finally {
@@ -947,6 +1211,38 @@ var InputAssistantController = class {
       }
     }
   }
+  applyOptimization() {
+    const preview = this.state.preview, binding = this.binding;
+    if (!preview || !binding || !this.state.connected || this.state.busy || this.settingsPending || this.composing || !this.state.settings.optimizeEnabled || !this.isCurrent(preview.request, false) || preview.clientGeneration !== this.transport.generation()) {
+      this.patch({ preview: null, notice: "\u8349\u7A3F\u6216\u4F1A\u8BDD\u5DF2\u53D8\u5316\uFF0C\u539F\u6587\u5DF2\u4FDD\u7559" });
+      return false;
+    }
+    const { request, text, beforeTarget, clipboardStart, clipboardEnd, clientGeneration } = preview;
+    const before = binding.input.draft;
+    const after = before.slice(0, clipboardStart) + text + before.slice(clipboardEnd);
+    if (!binding.actions.insertText(text, request.span)) {
+      this.patch({ preview: null, notice: "\u8349\u7A3F\u5DF2\u53D8\u5316\uFF0C\u5DF2\u653E\u5F03\u672C\u6B21\u7ED3\u679C" });
+      return false;
+    }
+    binding.actions.persistDraft?.();
+    this.suppressUntilEdit = after;
+    this.patch({
+      preview: null,
+      change: {
+        before,
+        after,
+        beforeTarget,
+        afterTarget: text,
+        span: { ...request.span, end: request.span.start + text.length },
+        sourceTurnId: request.sourceTurnId,
+        connectionGeneration: request.connectionGeneration,
+        routeKey: request.routeKey,
+        clientGeneration
+      },
+      notice: "\u5DF2\u91C7\u7EB3\u4F18\u5316\uFF0C\u53EF\u67E5\u770B\u6539\u52A8\u6216\u8FD8\u539F"
+    });
+    return true;
+  }
   canRestore() {
     const change = this.state.change, binding = this.binding, status = this.state.status;
     return Boolean(change && binding && status && this.state.connected && binding.input.draft === change.after && binding.input.phase === "plain" && status.sourceTurnId === change.sourceTurnId && status.generation === change.connectionGeneration && this.routeKey(binding.route ?? status.route) === change.routeKey && this.transport.generation() === change.clientGeneration);
@@ -968,12 +1264,12 @@ var InputAssistantController = class {
   }
   acceptSuggestion() {
     const suggestion = this.state.suggestion, binding = this.binding;
-    if (!suggestion || !binding || !this.isCurrent(suggestion.snapshot, true) || !this.eligible() || (suggestion.kind === "next" ? !this.state.settings.nextEnabled : !this.state.settings.completionEnabled)) {
+    if (!suggestion || !binding || !this.isCurrent(suggestion.snapshot, true) || !this.eligible() || !suggestion.snapshot.manual && (suggestion.kind === "next" ? !this.state.settings.nextEnabled : !this.state.settings.completionEnabled)) {
       this.patch({ suggestion: null });
       return false;
     }
     const applied = binding.actions.insertText(suggestion.text, suggestion.snapshot.span);
-    this.patch({ suggestion: null });
+    this.patch({ suggestion: null, suggestionStatus: applied ? "paused" : "idle", suggestionMessage: applied ? "\u5DF2\u91C7\u7EB3\uFF0C\u7EE7\u7EED\u7F16\u8F91\u540E\u6062\u590D\u81EA\u52A8\u5EFA\u8BAE" : "" });
     if (applied) {
       binding.actions.persistDraft?.();
       this.suppressUntilEdit = binding.input.draft + suggestion.text;
@@ -993,13 +1289,13 @@ var InputAssistantController = class {
     this.patch({ metrics: { ...this.state.metrics, exposures: this.state.metrics.exposures + 1 } });
   }
   async refreshDrafts() {
-    const generation = this.transport.generation();
+    const generation = this.transport.generation(), epoch = this.draftsEpoch;
     if (generation === null) return;
     try {
       const drafts = await this.transport.call("drafts/list", { sessionId: this.sessionId }, this.lifecycle.signal);
-      if (generation === this.transport.generation()) this.patch({ drafts });
+      if (generation === this.transport.generation() && epoch === this.draftsEpoch) this.patch({ drafts });
     } catch (error) {
-      if (!this.lifecycle.signal.aborted) this.patch({ notice: this.errorMessage(error) });
+      if (!this.lifecycle.signal.aborted && generation === this.transport.generation() && epoch === this.draftsEpoch) this.patch({ notice: this.errorMessage(error) });
     }
   }
   async stash(replaceId) {
@@ -1019,14 +1315,21 @@ var InputAssistantController = class {
       return;
     }
     const original = binding.input.draft, rev = binding.input.draftRev, clientGeneration = this.transport.generation();
+    const stashEpoch = ++this.stashEpoch;
+    const settingsEpoch = this.settingsEpoch, routeKey = this.routeKey(binding.route ?? this.state.status?.route);
+    this.draftsEpoch++;
     this.cancelActive();
     this.clearTimer();
-    this.patch({ busy: "stash", suggestion: null, notice: "" });
+    this.patch({ busy: "stash", stashClearPending: true, stashClearCancelled: false, suggestion: null, notice: "" });
     try {
       await this.transport.call("drafts/save", { sessionId: this.sessionId, text: original, ...replaceId ? { replaceId } : {} }, this.lifecycle.signal);
       await this.refreshDrafts();
       const live = this.binding;
-      if (!this.settingsPending && this.state.settings.stashEnabled && live?.input.draftRev === rev && live.input.draft === original && live.input.phase === "plain" && clientGeneration === this.transport.generation() && this.pureText()) {
+      if (stashEpoch !== this.stashEpoch) {
+        this.patch({ notice: "\u8349\u7A3F\u5DF2\u4FDD\u5B58\uFF1B\u5DF2\u6309\u53D6\u6D88\u8981\u6C42\u4FDD\u7559\u5F53\u524D\u8F93\u5165" });
+        return;
+      }
+      if (!this.settingsPending && settingsEpoch === this.settingsEpoch && this.state.settings.stashEnabled && this.routeKey(live?.route ?? this.state.status?.route) === routeKey && live?.input.draftRev === rev && live.input.draft === original && live.input.phase === "plain" && clientGeneration === this.transport.generation() && this.pureText()) {
         if (live.actions.insertText("", { start: 0, end: original.length, draftRev: rev })) {
           live.actions.persistDraft?.();
           this.suppressUntilEdit = "";
@@ -1038,7 +1341,7 @@ var InputAssistantController = class {
     } catch (error) {
       this.patch({ notice: this.errorMessage(error) });
     } finally {
-      this.patch({ busy: null });
+      this.patch({ busy: null, stashClearCancelled: false, stashClearPending: false });
     }
   }
   restoreDraft(draft, mode) {
@@ -1076,12 +1379,90 @@ ${draft.text}` : draft.text;
     await this.mutateDraft("drafts/clear", { sessionId: this.sessionId });
   }
   async mutateDraft(method, data) {
+    if (this.state.busy || this.transport.generation() === null) return;
+    if (this.undoExpiresAt === Infinity && this.state.deletedDrafts.length && this.state.pendingUndoDrafts.length) {
+      this.patch({ notice: "\u4E24\u6279\u5F85\u6062\u590D\u5907\u4EFD\u5C1A\u672A\u5904\u7406\uFF0C\u8BF7\u5148\u590D\u5236\u6216\u653E\u5F03\u4E00\u6279\uFF0C\u518D\u5220\u9664\u65B0\u7684\u6682\u5B58" });
+      return;
+    }
+    const generation = this.transport.generation();
+    this.draftsEpoch++;
+    this.patch({ busy: "stash" });
     try {
-      await this.transport.call(method, data, this.lifecycle.signal);
-      await this.refreshDrafts();
+      const result = await this.transport.call(method, data, this.lifecycle.signal);
+      if (generation !== this.transport.generation()) return;
+      if (result.removed.length) {
+        clearTimeout(this.undoTimer);
+        this.patch({ drafts: result.drafts, deletedDrafts: result.removed, notice: "\u5DF2\u5220\u9664\u6682\u5B58\uFF0C10 \u79D2\u5185\u53EF\u64A4\u9500" });
+        this.undoExpiresAt = Date.now() + 1e4;
+        this.armUndoExpiry();
+      } else this.patch({ drafts: result.drafts });
     } catch (error) {
       this.patch({ notice: this.errorMessage(error) });
+    } finally {
+      this.patch({ busy: null });
+    }
+  }
+  async undoDeleteDrafts(target = "recent") {
+    const deleted = target === "pending" ? this.state.pendingUndoDrafts : this.state.deletedDrafts;
+    if (!deleted.length || this.state.busy || this.transport.generation() === null) return;
+    const generation = this.transport.generation();
+    this.draftsEpoch++;
+    if (target === "recent") clearTimeout(this.undoTimer);
+    this.patch({ busy: "stash" });
+    try {
+      const drafts = await this.transport.call("drafts/restore", { sessionId: this.sessionId, drafts: deleted }, this.lifecycle.signal);
+      if (generation === this.transport.generation()) {
+        if (target === "recent") this.undoExpiresAt = 0;
+        this.patch({ drafts, ...target === "recent" ? { deletedDrafts: [] } : { pendingUndoDrafts: [] }, notice: "\u5DF2\u64A4\u9500\u5220\u9664" });
+      }
+    } catch (error) {
+      if (generation === this.transport.generation()) {
+        if (target === "recent" && !this.state.pendingUndoDrafts.length) {
+          this.undoExpiresAt = 0;
+          this.patch({ pendingUndoDrafts: deleted, deletedDrafts: [] });
+        } else if (target === "recent") this.undoExpiresAt = Infinity;
+        this.patch({ notice: `${this.errorMessage(error)}\uFF1B\u5F85\u6062\u590D\u6587\u5B57\u5DF2\u4FDD\u7559\uFF0C\u53EF\u91CD\u8BD5\u6216\u590D\u5236` });
+      }
+    } finally {
+      this.patch({ busy: null });
+    }
+  }
+  discardPendingUndo() {
+    if (this.undoExpiresAt === Infinity) {
+      this.undoExpiresAt = 0;
+      this.patch({ pendingUndoDrafts: this.state.deletedDrafts, deletedDrafts: [], notice: "\u5DF2\u653E\u5F03\u9009\u5B9A\u6062\u590D\u5907\u4EFD\uFF0C\u5176\u4F59\u5907\u4EFD\u4ECD\u4FDD\u7559" });
+    } else this.patch({ pendingUndoDrafts: [], notice: "\u5DF2\u653E\u5F03\u9009\u5B9A\u6062\u590D\u5907\u4EFD" });
+  }
+  retrySuggestion() {
+    if (!this.eligibleForManual()) {
+      this.patch({ notice: "\u8BF7\u5728\u53EF\u89C1\u3001\u5DF2\u8FDE\u63A5\u4E14\u7A7A\u95F2\u7684\u7EAF\u6587\u672C\u8F93\u5165\u6846\u4E2D\uFF0C\u5C06\u5149\u6807\u79FB\u5230\u672B\u5C3E\u540E\u751F\u6210\u5EFA\u8BAE" });
+      return;
     }
+    const binding = this.binding, span = binding.actions.captureInsertion();
+    if (span.start !== span.end || span.end !== binding.input.draft.length || !focusedIn(binding.editor)) {
+      this.patch({ notice: "\u8BF7\u5C06\u5149\u6807\u79FB\u81F3\u8349\u7A3F\u672B\u5C3E\u540E\u751F\u6210\u5EFA\u8BAE" });
+      return;
+    }
+    const operation = binding.input.draft.length ? "complete" : "next";
+    if (operation === "next" && !this.state.status?.sourceTurnId || operation === "complete" && !binding.input.draft.trim()) {
+      this.patch({ notice: "\u8BF7\u5148\u8F93\u5165\u8349\u7A3F\uFF0C\u6216\u7B49\u5F85\u4E00\u8F6E\u56DE\u590D\u5B8C\u6210\u540E\u518D\u9884\u6D4B\u4E0B\u4E00\u53E5" });
+      return;
+    }
+    this.clearTimer();
+    this.cancelActive();
+    this.suppressUntilEdit = null;
+    this.failedCompletionKey = null;
+    this.failedNextKey = null;
+    this.completionCache.delete(this.completionKey());
+    this.nextTurns.delete(this.nextKey());
+    this.patch({ suggestion: null, notice: "" });
+    void this.requestSuggestion(operation, true);
+  }
+  eligibleForManual() {
+    return this.pureText() && document.visibilityState !== "hidden" && !this.composing && !this.settingsPending && !this.binding?.running && !this.state.status?.running && !this.state.busy && !this.state.preview && this.state.connected && charCount(this.binding?.input.draft ?? "") <= this.state.settings.maxDraftChars && !nativeMenuOpen(this.binding?.editor ?? null);
+  }
+  suggestionStatus(status, message) {
+    if (this.state.suggestionStatus !== status || this.state.suggestionMessage !== message) this.patch({ suggestionStatus: status, suggestionMessage: message });
   }
   captureTarget(requireSelection) {
     const binding = this.binding;
@@ -1113,7 +1494,7 @@ ${draft.text}` : draft.text;
     return Boolean(input && input.phase === "plain" && !input.occurrences.length && !input.attachmentIds.length);
   }
   eligible() {
-    return this.pureText() && !this.composing && !this.settingsPending && !this.binding?.running && !this.state.status?.running && !this.state.busy && this.state.connected && this.suppressUntilEdit === null;
+    return this.pureText() && document.visibilityState !== "hidden" && !this.composing && !this.settingsPending && !this.binding?.running && !this.state.status?.running && !this.state.busy && !this.state.preview && this.state.connected && this.suppressUntilEdit === null;
   }
   driveSuggestions() {
     const binding = this.binding, status = this.state.status;
@@ -1130,24 +1511,32 @@ ${draft.text}` : draft.text;
       this.clearTimer();
       return;
     }
+    if (this.manualTimerKey === this.completionKey() && this.timer !== void 0) return;
+    if (this.state.suggestion?.snapshot.manual && this.isCurrent(this.state.suggestion.snapshot, true)) return;
     const turn = status.sourceTurnId;
     const route = this.routeKey(binding.route ?? status.route);
     if (binding.input.draft === "") {
       this.clearTimer();
       if (!turn) return;
-      if (!this.state.settings.nextEnabled || this.nextTurns.has(`${status.generation}:${turn}:${route}`)) return;
-      if (this.nextTurns.size >= 512) this.nextTurns.clear();
-      this.nextTurns.add(`${status.generation}:${turn}:${route}`);
+      const key = this.nextKey();
+      if (!this.state.settings.nextEnabled) {
+        if (["idle", "waiting", "paused"].includes(this.state.suggestionStatus)) this.suggestionStatus("paused", "\u81EA\u52A8\u9884\u6D4B\u5DF2\u5173\u95ED\uFF0C\u53EF\u624B\u52A8\u751F\u6210");
+        return;
+      }
+      if (this.nextTurns.has(key) || key === this.failedNextKey) return;
       void this.requestSuggestion("next");
       return;
     }
     if (!this.state.settings.completionEnabled || charCount(binding.input.draft) > this.state.settings.maxDraftChars) {
       this.clearTimer();
+      if (!this.state.settings.completionEnabled && !this.state.suggestion && ["idle", "waiting", "paused"].includes(this.state.suggestionStatus)) this.suggestionStatus("paused", "\u81EA\u52A8\u7EED\u5199\u5DF2\u5173\u95ED\uFF0C\u53EF\u624B\u52A8\u751F\u6210");
       return;
     }
     if (this.nextCache && this.nextCache.turn === turn && this.nextCache.route === route && this.nextCache.generation === status.generation && this.nextCache.text.startsWith(binding.input.draft)) {
       this.clearTimer();
       const suffix = this.nextCache.text.slice(binding.input.draft.length);
+      const existing = this.state.suggestion;
+      if (existing && existing.text === suffix && existing.kind === "complete" && this.isCurrent(existing.snapshot, true)) return;
       const snapshot = this.snapshot("complete", span);
       if (suffix && charCount(suffix) <= this.state.settings.maxCompletionChars && snapshot) this.patch({ suggestion: { text: suffix, snapshot, kind: "complete" } });
       return;
@@ -1159,47 +1548,87 @@ ${draft.text}` : draft.text;
     }
     if (this.completionCache.has(cacheKey)) {
       this.clearTimer();
-      const text = this.completionCache.get(cacheKey), snapshot = this.snapshot("complete", span);
+      const text = this.completionCache.get(cacheKey);
+      if (!text) {
+        this.suggestionStatus("abstained", "\u6A21\u578B\u672C\u6B21\u672A\u7ED9\u51FA\u5EFA\u8BAE\uFF0C\u53EF\u624B\u52A8\u91CD\u8BD5");
+        return;
+      }
+      const existing = this.state.suggestion;
+      if (existing && existing.text === text && existing.kind === "complete" && this.isCurrent(existing.snapshot, true)) return;
+      const snapshot = this.snapshot("complete", span);
       if (text && snapshot) this.patch({ suggestion: { text, snapshot, kind: "complete" } });
       return;
     }
     if (this.timer !== void 0 && this.timerKey === cacheKey) return;
     this.clearTimer();
-    const delay = Math.max(this.state.settings.debounceMs, this.lastCompletionStart + this.state.settings.minIntervalMs - Date.now());
+    const delay = Math.max(this.state.settings.debounceMs, this.lastCompletionStart + this.state.settings.minIntervalMs - Date.now(), this.completionRetryAt - Date.now());
     this.timerKey = cacheKey;
+    this.suggestionStatus(this.completionRetryAt > Date.now() ? "throttled" : "waiting", this.completionRetryAt > Date.now() ? "\u7B49\u5F85\u6700\u5C0F\u8BF7\u6C42\u95F4\u9694\u7ED3\u675F" : "\u7B49\u5F85\u8F93\u5165\u505C\u987F");
     this.timer = setTimeout(() => {
       this.timer = void 0;
       this.timerKey = null;
       void this.requestSuggestion("complete");
     }, delay);
   }
-  async requestSuggestion(operation) {
+  async requestSuggestion(operation, manual = false, deferOnce = true) {
     const binding = this.binding;
     if (!binding || !this.eligible()) return;
+    if (!manual && !(operation === "next" ? this.state.settings.nextEnabled : this.state.settings.completionEnabled)) return;
     const span = binding.actions.captureInsertion(), snapshot = this.snapshot(operation, span);
     if (!snapshot || span.start !== span.end || span.end !== binding.input.draft.length) return;
+    if (manual) snapshot.manual = true;
     if (operation === "complete") this.lastCompletionStart = Date.now();
-    const active = this.begin(snapshot), cacheKey = this.completionKey();
+    const active = this.begin(snapshot), cacheKey = this.completionKey(), nextKey = this.nextKey();
+    this.suggestionStatus("generating", manual ? "\u6B63\u5728\u751F\u6210\u672C\u6B21\u5EFA\u8BAE" : "\u6B63\u5728\u751F\u6210\u5EFA\u8BAE");
+    let retry = false;
     try {
       const result = await this.transport.call("generate", snapshot, active.controller.signal);
       if (this.active !== active || !this.isCurrent(snapshot, true)) return;
       if (!this.validResult(result, snapshot)) {
         if (operation === "complete") this.failedCompletionKey = cacheKey;
+        else this.failedNextKey = nextKey;
+        this.suggestionStatus("failed", "\u5EFA\u8BAE\u8FD4\u56DE\u683C\u5F0F\u65E0\u6548\uFF0C\u53EF\u624B\u52A8\u91CD\u8BD5");
+        return;
+      }
+      if (result.outcome === "throttled") {
+        if (operation === "complete") {
+          this.completionRetryAt = Date.now() + result.retryAfterMs;
+          retry = !manual || deferOnce;
+          this.suggestionStatus("throttled", "\u7B49\u5F85\u6700\u5C0F\u8BF7\u6C42\u95F4\u9694\u7ED3\u675F\uFF0C\u53EF\u7A0D\u540E\u91CD\u8BD5");
+        }
         return;
       }
       if (operation === "complete") {
         this.completionCache.set(cacheKey, result.text);
         if (this.completionCache.size > 64) this.completionCache.delete(this.completionCache.keys().next().value);
+      } else {
+        if (this.nextTurns.size >= 512) this.nextTurns.clear();
+        this.nextTurns.add(nextKey);
       }
       if (operation === "next" && result.text) this.nextCache = { text: result.text, turn: snapshot.sourceTurnId, route: snapshot.routeKey, generation: snapshot.connectionGeneration };
-      if (result.text) this.patch({ suggestion: { text: result.text, snapshot, kind: operation } });
+      if (result.text) this.patch({ suggestion: { text: result.text, snapshot, kind: operation }, suggestionStatus: "ready", suggestionMessage: "Tab \u91C7\u7EB3\uFF0CEsc \u5FFD\u7565" });
+      else this.suggestionStatus("abstained", "\u6A21\u578B\u672C\u6B21\u672A\u7ED9\u51FA\u5EFA\u8BAE\uFF0C\u53EF\u624B\u52A8\u91CD\u8BD5");
     } catch {
       if (operation === "complete" && !active.controller.signal.aborted && this.active === active && this.isCurrent(snapshot, false)) {
         this.failedCompletionKey = cacheKey;
       }
+      if (operation === "next" && !active.controller.signal.aborted && this.active === active && this.isCurrent(snapshot, false)) this.failedNextKey = nextKey;
+      if (!active.controller.signal.aborted && this.active === active && this.isCurrent(snapshot, false)) this.suggestionStatus("failed", "\u5EFA\u8BAE\u8BF7\u6C42\u672A\u5B8C\u6210\uFF0C\u53EF\u624B\u52A8\u91CD\u8BD5");
     } finally {
       this.recordLatency(active);
-      if (this.active === active) this.active = null;
+      if (this.active === active) {
+        this.active = null;
+        if (retry && manual) {
+          this.timerKey = cacheKey;
+          this.manualTimerKey = cacheKey;
+          this.timer = setTimeout(() => {
+            this.timer = void 0;
+            this.timerKey = null;
+            this.manualTimerKey = null;
+            void this.requestSuggestion(operation, true, false);
+          }, Math.max(1, this.completionRetryAt - Date.now()));
+        } else if (retry) this.driveSuggestions();
+      }
     }
   }
   snapshot(operation, span, targetText) {
@@ -1209,7 +1638,7 @@ ${draft.text}` : draft.text;
     return {
       operation,
       sessionId: this.sessionId,
-      requestId: `${Date.now().toString(36)}-${++this.sequence}`,
+      requestId: `${this.requestPrefix}-${++this.sequence}`,
       sourceTurnId: status.sourceTurnId,
       draft: binding.input.draft,
       draftRev: binding.input.draftRev,
@@ -1268,7 +1697,7 @@ ${draft.text}` : draft.text;
     }, checkCaret));
   }
   validResult(result, request) {
-    return result.requestId === request.requestId && result.sessionId === request.sessionId && result.sourceTurnId === request.sourceTurnId && result.draftRev === request.draftRev && result.connectionGeneration === request.connectionGeneration && result.routeKey === request.routeKey && result.span.start === request.span.start && result.span.end === request.span.end && (result.text === null || typeof result.text === "string");
+    return result.requestId === request.requestId && result.sessionId === request.sessionId && result.sourceTurnId === request.sourceTurnId && result.draftRev === request.draftRev && result.connectionGeneration === request.connectionGeneration && result.routeKey === request.routeKey && result.span.start === request.span.start && result.span.end === request.span.end && (result.text === null || typeof result.text === "string") && (result.outcome === void 0 || result.outcome === "suggestion" && typeof result.text === "string" || result.outcome === "abstained" && result.text === null || result.outcome === "throttled" && result.text === null && Number.isFinite(result.retryAfterMs) && result.retryAfterMs > 0 && result.retryAfterMs <= 3e4);
   }
   sameCaret(span) {
     const current = this.binding?.actions.captureInsertion();
@@ -1277,6 +1706,11 @@ ${draft.text}` : draft.text;
   routeKey(route) {
     return route ? JSON.stringify([route.provider, route.model]) : "";
   }
+  nextKey() {
+    const settings = this.state.settings;
+    const route = settings.provider && settings.model ? { provider: settings.provider, model: settings.model } : this.binding?.route ?? this.state.status?.route;
+    return JSON.stringify([this.state.status?.generation, this.state.status?.sourceTurnId, this.routeKey(route)]);
+  }
   completionKey() {
     return JSON.stringify([this.state.status?.generation, this.state.status?.sourceTurnId, this.routeKey(this.binding?.route ?? this.state.status?.route), this.binding?.input.draft]);
   }
@@ -1288,13 +1722,16 @@ ${draft.text}` : draft.text;
       this.nextCache = null;
       this.completionCache.clear();
       this.failedCompletionKey = null;
+      this.failedNextKey = null;
+      this.completionRetryAt = 0;
     }
-    this.patch({ suggestion: null });
+    this.patch({ suggestion: null, ...cancelInFlight ? { preview: null } : {} });
   }
   clearTimer() {
     clearTimeout(this.timer);
     this.timer = void 0;
     this.timerKey = null;
+    this.manualTimerKey = null;
   }
   cancelActive() {
     const active = this.active;
@@ -1305,6 +1742,7 @@ ${draft.text}` : draft.text;
     void this.transport.call("cancel", { sessionId: this.sessionId, requestId: active.snapshot.requestId }).catch(() => {
     });
     if (active.snapshot.operation === "optimize") this.patch({ busy: null });
+    else this.suggestionStatus("idle", "");
   }
   recordLatency(active) {
     if (active.latencyRecorded) return;
@@ -1339,11 +1777,15 @@ var BrowserRuntime = class {
   pendingSettings = 0;
   settingsQueue = Promise.resolve();
   metrics = /* @__PURE__ */ new Map();
+  undo = /* @__PURE__ */ new Map();
   transport;
   controllerFor(sessionId) {
     let entry = this.entries.get(sessionId);
     if (!entry) {
-      entry = { controller: new InputAssistantController(sessionId, this.transport, this.metrics.get(sessionId), (update) => this.saveSettings(update)), refs: 0 };
+      const saved = this.undo.get(sessionId);
+      clearTimeout(saved?.timer);
+      this.undo.delete(sessionId);
+      entry = { controller: new InputAssistantController(sessionId, this.transport, this.metrics.get(sessionId), (update) => this.saveSettings(update), saved?.snapshot), refs: 0 };
       this.entries.set(sessionId, entry);
       if (this.pendingSettings) entry.controller.beginSettingsUpdate();
     }
@@ -1351,19 +1793,50 @@ var BrowserRuntime = class {
   }
   retain(sessionId) {
     const controller = this.controllerFor(sessionId), entry = this.entries.get(sessionId);
+    entry.waitForMutation?.();
+    entry.waitForMutation = void 0;
     entry.refs++;
     controller.start();
     return () => {
       entry.refs--;
       queueMicrotask(() => {
         if (entry.refs === 0 && this.entries.get(sessionId) === entry) {
-          this.metrics.set(sessionId, { ...controller.getSnapshot().metrics });
-          controller.dispose();
-          this.entries.delete(sessionId);
+          const release = () => {
+            if (entry.refs !== 0 || this.entries.get(sessionId) !== entry) return;
+            if (controller.getSnapshot().busy === "stash") {
+              entry.waitForMutation ??= controller.subscribe(() => {
+                if (controller.getSnapshot().busy !== "stash") {
+                  entry.waitForMutation?.();
+                  entry.waitForMutation = void 0;
+                  release();
+                }
+              });
+              return;
+            }
+            this.metrics.set(sessionId, { ...controller.getSnapshot().metrics });
+            this.saveUndo(sessionId, controller.getUndoSnapshot());
+            controller.dispose();
+            this.entries.delete(sessionId);
+          };
+          release();
         }
       });
     };
   }
+  saveUndo(sessionId, snapshot) {
+    clearTimeout(this.undo.get(sessionId)?.timer);
+    this.undo.delete(sessionId);
+    if (!snapshot.recent.length && !snapshot.pending.length) return;
+    const record = { snapshot };
+    if (snapshot.recent.length && Number.isFinite(snapshot.expiresAt)) {
+      record.timer = setTimeout(() => {
+        if (this.undo.get(sessionId) !== record) return;
+        record.snapshot = { ...record.snapshot, recent: [], expiresAt: 0 };
+        if (!record.snapshot.pending.length) this.undo.delete(sessionId);
+      }, Math.max(0, snapshot.expiresAt - Date.now()));
+    }
+    this.undo.set(sessionId, record);
+  }
   applySettings(settings) {
     for (const entry of this.entries.values()) entry.controller.applySettings(settings);
   }
@@ -1393,49 +1866,364 @@ var BrowserRuntime = class {
     if (this.disposed) return;
     this.disposed = true;
     this.lifetime.abort();
-    for (const entry of this.entries.values()) entry.controller.dispose();
+    for (const entry of this.entries.values()) {
+      entry.waitForMutation?.();
+      entry.controller.dispose();
+    }
     this.entries.clear();
     this.metrics.clear();
+    for (const record of this.undo.values()) clearTimeout(record.timer);
+    this.undo.clear();
   }
 };
 
 // src/browser/styles.ts
 var STYLE_TEXT = `
-.dsh-ia {--dsh-ia-fallback-bg:#fff;--dsh-ia-fallback-fg:#0f1115;--dsh-ia-fallback-muted:#61666b;--dsh-ia-fallback-border:#d7dce2;font-family:var(--dsw-font-family,system-ui,sans-serif);color:var(--dsw-alias-label-primary,var(--dsh-ia-fallback-fg));font-size:13px;line-height:1.5;box-sizing:border-box;color-scheme:light}
-body[data-ds-dark-theme] .dsh-ia {--dsh-ia-fallback-bg:#232324;--dsh-ia-fallback-fg:#f3f4f6;--dsh-ia-fallback-muted:#adb2b8;--dsh-ia-fallback-border:#43454a;color-scheme:dark}
-.dsh-ia * {box-sizing:border-box}
-.dsh-ia button,.dsh-ia input,.dsh-ia select {font:inherit;color:inherit}
-.dsh-ia button {border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:7px;padding:5px 9px;background:transparent;cursor:pointer}
-.dsh-ia button:hover:not(:disabled) {background:var(--dsw-alias-interactive-bg-hover,#8882)}
-.dsh-ia button:disabled {opacity:.45;cursor:default}
-.dsh-ia button:focus-visible,.dsh-ia input:focus-visible,.dsh-ia select:focus-visible {outline:2px solid var(--dsw-alias-state-business-primary,#4c88e4);outline-offset:2px}
-.dsh-ia-root {display:flex;align-items:center;gap:3px;position:relative}
-.dsh-ia-settings {width:100%;max-width:760px}
-.dsh-ia-settings h2 {font-size:18px;margin:0 0 8px}.dsh-ia-settings h3 {font-size:14px;margin:0 0 10px}
-.dsh-ia-settings fieldset {padding:0;margin:0;border:0;min-width:0}
-.dsh-ia-settings-toggles {display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
-.dsh-ia-settings-toggles label {display:flex;align-items:center;gap:7px}
-.dsh-ia-trigger {white-space:nowrap}
-.dsh-ia-menu {position:fixed;width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;padding:14px;border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:12px;background:var(--dsw-alias-bg-layer-2,var(--dsh-ia-fallback-bg));box-shadow:0 8px 32px #0003;z-index:1000}
-.dsh-ia-row {display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0}
-.dsh-ia-row label {display:flex;align-items:center;gap:6px}
-.dsh-ia-field {display:flex;flex-direction:column;gap:4px;margin:8px 0}
-.dsh-ia-field input,.dsh-ia select {border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:6px;background:var(--dsw-alias-bg-layer-1,var(--dsh-ia-fallback-bg));padding:6px}
-.dsh-ia-field input {width:100%}
-.dsh-ia-muted {color:var(--dsw-alias-label-secondary,var(--dsh-ia-fallback-muted));font-size:12px}
-.dsh-ia-notice {position:fixed;max-width:calc(100vw - 24px);overflow:auto;padding:8px 11px;background:var(--dsw-alias-bg-layer-2,var(--dsh-ia-fallback-bg));border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:9px;box-shadow:0 4px 18px #0002;z-index:999}
-.dsh-ia-menu .dsh-ia-notice {position:static;max-width:100%;margin:8px 0;box-shadow:none}
-.dsh-ia-section {border-top:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));margin-top:12px;padding-top:10px}
-.dsh-ia-section h4 {font-size:13px;margin:0 0 8px}
-.dsh-ia-pre {white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:12px;max-height:190px;overflow:auto;padding:9px;border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:7px;background:var(--dsw-alias-bg-module-platform,#8881)}
-.dsh-ia-diff ins {background:#27a35b26;text-decoration:none}.dsh-ia-diff del {background:#d9454526}
-.dsh-ia-draft {border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:8px;padding:8px;margin:7px 0}
-.dsh-ia-draft summary {cursor:pointer;overflow-wrap:anywhere}
-.dsh-ia-draft time {font-size:11px;opacity:.65}
-.dsh-ia-candidate {position:fixed;display:flex;align-items:center;gap:8px;padding:9px 12px;overflow:auto;border:1px solid var(--dsw-alias-border-l2,var(--dsh-ia-fallback-border));border-radius:10px;background:var(--dsw-alias-bg-layer-2,var(--dsh-ia-fallback-bg));box-shadow:0 4px 16px #0002;pointer-events:auto;z-index:998}
-.dsh-ia-candidate-text {flex:1;white-space:pre-wrap;overflow-wrap:anywhere}
-.dsh-ia-ghost {position:fixed;white-space:pre-wrap;overflow-wrap:anywhere;overflow:hidden;max-height:3lh;pointer-events:none;user-select:none;color:var(--dsw-alias-label-tertiary,#76808d);opacity:.9;z-index:34}
-[data-composer-card]:has([data-dsh-ia-empty-ghost]) [data-composer-placeholder] {visibility:hidden}
+.dsh-ia {
+  --dsh-ia-fallback-bg: #ffffff;
+  --dsh-ia-fallback-fg: #111827;
+  --dsh-ia-fallback-muted: #4b5563;
+  --dsh-ia-fallback-border: #d1d5db;
+  --dsh-ia-accent: var(--dsw-alias-state-business-primary, #3b82f6);
+  --dsh-ia-accent-subtle: rgba(59, 130, 246, 0.1);
+  --dsh-ia-pill-bg: var(--dsw-alias-interactive-bg-subtle, rgba(0, 0, 0, 0.04));
+  --dsh-ia-pill-hover: var(--dsw-alias-interactive-bg-hover, rgba(0, 0, 0, 0.08));
+  font-family: var(--dsw-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
+  color: var(--dsw-alias-label-primary, var(--dsh-ia-fallback-fg));
+  font-size: 13px;
+  line-height: 1.5;
+  box-sizing: border-box;
+  color-scheme: light;
+}
+
+body[data-ds-dark-theme] .dsh-ia {
+  --dsh-ia-fallback-bg: #1f2329;
+  --dsh-ia-fallback-fg: #f3f4f6;
+  --dsh-ia-fallback-muted: #9ca3af;
+  --dsh-ia-fallback-border: #374151;
+  --dsh-ia-pill-bg: var(--dsw-alias-interactive-bg-subtle, rgba(255, 255, 255, 0.06));
+  --dsh-ia-pill-hover: var(--dsw-alias-interactive-bg-hover, rgba(255, 255, 255, 0.12));
+  color-scheme: dark;
+}
+
+.dsh-ia * { box-sizing: border-box; }
+.dsh-ia button, .dsh-ia input, .dsh-ia select { font: inherit; color: inherit; }
+
+/* Global buttons within dsh-ia */
+.dsh-ia button {
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 7px;
+  padding: 5px 11px;
+  background: var(--dsw-alias-bg-layer-1, transparent);
+  color: var(--dsw-alias-label-primary, inherit);
+  cursor: pointer;
+  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 5px;
+}
+.dsh-ia button:hover:not(:disabled) {
+  background: var(--dsw-alias-interactive-bg-hover, #8882);
+  border-color: var(--dsw-alias-state-business-primary, var(--dsh-ia-accent));
+}
+.dsh-ia button:active:not(:disabled) {
+  transform: translateY(1px);
+}
+.dsh-ia button:disabled {
+  opacity: 0.45;
+  cursor: default;
+  transform: none;
+}
+.dsh-ia button:focus-visible, .dsh-ia input:focus-visible, .dsh-ia select:focus-visible {
+  outline: 2px solid var(--dsw-alias-state-business-primary, #3b82f6);
+  outline-offset: 2px;
+}
+
+/* Smart Pill Trigger Group in Input Card */
+.dsh-ia-root {
+  display: inline-flex;
+  align-items: center;
+  background: var(--dsh-ia-pill-bg);
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 8px;
+  padding: 2px;
+  gap: 2px;
+  position: relative;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
+}
+.dsh-ia-root .dsh-ia-trigger {
+  border: none;
+  background: transparent;
+  padding: 4px 10px;
+  font-weight: 500;
+  border-radius: 6px;
+  white-space: nowrap;
+}
+.dsh-ia-root .dsh-ia-trigger:hover:not(:disabled) {
+  background: var(--dsh-ia-pill-hover);
+}
+.dsh-ia-root .dsh-ia-menu-btn {
+  border: none;
+  background: transparent;
+  padding: 4px 6px;
+  border-radius: 6px;
+  min-width: 24px;
+}
+.dsh-ia-root .dsh-ia-menu-btn:hover:not(:disabled) {
+  background: var(--dsh-ia-pill-hover);
+}
+.dsh-ia-root .dsh-ia-cancel-btn {
+  border: none;
+  background: rgba(239, 68, 68, 0.12);
+  color: #ef4444;
+  font-size: 11px;
+  padding: 4px 8px;
+  border-radius: 6px;
+}
+.dsh-ia-root .dsh-ia-cancel-btn:hover {
+  background: rgba(239, 68, 68, 0.2);
+}
+
+/* Floating Menu Panel */
+.dsh-ia-menu {
+  position: fixed;
+  width: min(480px, calc(100vw - 24px));
+  max-height: calc(100dvh - 24px);
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  padding: 16px;
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 14px;
+  background: var(--dsw-alias-bg-layer-2, var(--dsh-ia-fallback-bg));
+  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.22);
+  z-index: 1000;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.dsh-ia-preview {
+  z-index: 1001;
+  width: min(580px, calc(100vw - 24px));
+}
+.dsh-ia-preview .dsh-ia-pre {
+  margin-top: 10px;
+  max-height: 360px;
+}
+
+/* Form Controls & Fields */
+.dsh-ia-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
+  margin: 6px 0;
+}
+.dsh-ia-row label {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  cursor: pointer;
+  user-select: none;
+}
+.dsh-ia-field {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  margin: 6px 0;
+}
+.dsh-ia-field input, .dsh-ia select {
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 7px;
+  background: var(--dsw-alias-bg-layer-1, var(--dsh-ia-fallback-bg));
+  padding: 7px 10px;
+  color: var(--dsw-alias-label-primary, inherit);
+  transition: border-color 0.15s ease;
+}
+.dsh-ia-field input:focus, .dsh-ia select:focus {
+  border-color: var(--dsw-alias-state-business-primary, var(--dsh-ia-accent));
+}
+.dsh-ia-field input { width: 100%; }
+.dsh-ia-muted {
+  color: var(--dsw-alias-label-secondary, var(--dsh-ia-fallback-muted));
+  font-size: 12px;
+  line-height: 1.45;
+}
+
+/* Sections */
+.dsh-ia-section {
+  border-top: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  margin-top: 8px;
+  padding-top: 10px;
+}
+.dsh-ia-section h4 {
+  font-size: 13px;
+  margin: 0 0 8px;
+  font-weight: 600;
+}
+
+/* Notices & Alerts */
+.dsh-ia-notice {
+  position: fixed;
+  max-width: min(360px, calc(100vw - 32px));
+  overflow: auto;
+  padding: 6px 12px;
+  background: var(--dsw-alias-bg-layer-2, var(--dsh-ia-fallback-bg));
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 20px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.14);
+  z-index: 1002;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 12px;
+  animation: dshIaFadeIn 0.2s ease-out;
+}
+@keyframes dshIaFadeIn {
+  from { opacity: 0; transform: translateY(4px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+.dsh-ia-menu .dsh-ia-notice {
+  position: static;
+  max-width: 100%;
+  margin: 6px 0;
+  box-shadow: none;
+}
+.dsh-ia-notice button { margin-left: 6px; padding: 3px 8px; font-size: 11px; }
+
+/* Diff / Pre formatting */
+.dsh-ia-pre {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  font: inherit;
+  font-size: 12px;
+  max-height: 200px;
+  overflow-y: auto;
+  padding: 10px;
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 8px;
+  background: var(--dsw-alias-bg-module-platform, rgba(128, 128, 128, 0.08));
+}
+.dsh-ia-diff ins {
+  background: rgba(39, 163, 91, 0.22);
+  color: #107c41;
+  text-decoration: none;
+  border-radius: 2px;
+  padding: 0 2px;
+}
+body[data-ds-dark-theme] .dsh-ia-diff ins {
+  color: #4ade80;
+  background: rgba(34, 197, 94, 0.22);
+}
+.dsh-ia-diff del {
+  background: rgba(217, 69, 69, 0.22);
+  color: #c42b1c;
+  text-decoration: line-through;
+  border-radius: 2px;
+  padding: 0 2px;
+}
+body[data-ds-dark-theme] .dsh-ia-diff del {
+  color: #f87171;
+  background: rgba(239, 68, 68, 0.22);
+}
+
+/* Draft Card */
+.dsh-ia-draft {
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 9px;
+  padding: 9px 12px;
+  margin: 8px 0;
+  background: var(--dsw-alias-bg-layer-1, transparent);
+  transition: border-color 0.15s ease;
+}
+.dsh-ia-draft summary {
+  cursor: pointer;
+  overflow-wrap: anywhere;
+  font-weight: 500;
+}
+.dsh-ia-draft time {
+  display: block;
+  font-size: 11px;
+  color: var(--dsw-alias-label-tertiary, var(--dsh-ia-fallback-muted));
+  margin: 3px 0 6px;
+}
+
+/* Candidate Panel & Ghost Text */
+.dsh-ia-candidate {
+  position: fixed;
+  display: flex;
+  align-items: center;
+  gap: 9px;
+  padding: 10px 14px;
+  max-width: min(640px, calc(100vw - 32px));
+  max-height: 240px;
+  overflow-y: auto;
+  border: 1px solid var(--dsw-alias-border-l2, var(--dsh-ia-fallback-border));
+  border-radius: 11px;
+  background: var(--dsw-alias-bg-layer-2, var(--dsh-ia-fallback-bg));
+  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.2);
+  pointer-events: auto;
+  z-index: 998;
+}
+.dsh-ia-candidate-text {
+  flex: 1;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  font-size: 13px;
+  line-height: 1.5;
+}
+.dsh-ia-ghost {
+  position: fixed;
+  white-space: pre-wrap;
+  word-break: break-word;
+  overflow-wrap: break-word;
+  overflow: hidden;
+  max-height: 100%;
+  pointer-events: none;
+  user-select: none;
+  color: var(--dsw-alias-label-tertiary, #76808d);
+  opacity: 0.88;
+  z-index: 34;
+}
+[data-composer-card]:has([data-dsh-ia-empty-ghost]) [data-composer-placeholder] {
+  visibility: hidden;
+}
+
+/* Settings Form page */
+.dsh-ia-settings { width: 100%; max-width: 760px; }
+.dsh-ia-settings h2 { font-size: 18px; margin: 0 0 8px; }
+.dsh-ia-settings h3 { font-size: 14px; margin: 0 0 10px; font-weight: 600; }
+.dsh-ia-settings fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }
+.dsh-ia-settings-toggles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
+.dsh-ia-settings-toggles label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
+.dsh-ia-sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip-path: inset(50%);
+  white-space: nowrap;
+  border: 0;
+}
+
+.dsh-ia-preview .dsh-ia-pre { max-height: 320px; }
+.dsh-ia-notice { flex-wrap: wrap; border-radius: 12px; }
+.dsh-ia-route, .dsh-ia-suggestion-state { overflow-wrap: anywhere; }
+.dsh-ia-suggestion-state { margin: 6px 0; }
+.dsh-ia-inline-status { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--dsw-alias-label-secondary,var(--dsh-ia-fallback-muted)); }
+.dsh-ia summary:focus-visible { outline: 2px solid var(--dsh-ia-accent); outline-offset: 2px; }
+.dsh-ia-settings-presets { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 10px; }
+.dsh-ia .dsh-ia-preset { display: flex; flex-direction: column; align-items: flex-start; text-align: left; padding: 12px; gap: 5px; }
+.dsh-ia .dsh-ia-preset[aria-pressed=true] { border-color: var(--dsh-ia-accent); background: var(--dsh-ia-accent-subtle); }
+.dsh-ia-setting-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(280px,100%),1fr)); gap: 14px; margin-top: 12px; }
+.dsh-ia-number-control { display: flex; align-items: center; gap: 10px; }
+.dsh-ia-number-control input[type=number] { width: 100px; flex: 0 0 auto; }
+.dsh-ia-number-control input[type=range] { min-width: 0; flex: 1; accent-color: var(--dsh-ia-accent); }
+.dsh-ia-setting-heading { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
+.dsh-ia-setting-heading label { font-weight: 500; }
+@media (prefers-reduced-motion: reduce) { .dsh-ia *, .dsh-ia-notice { transition: none !important; animation: none !important; } }
 `;
 
 // src/browser/settings.tsx
@@ -1447,8 +2235,8 @@ var numeric = {
   minIntervalMs: [500, 3e4],
   maxHistoryChars: [1e3, 64e3],
   maxDraftChars: [100, 32e3],
-  maxNextChars: [20, 300],
-  maxCompletionChars: [10, 200],
+  maxNextChars: [20, 1e3],
+  maxCompletionChars: [10, 500],
   optimizeTimeoutMs: [1e3, 12e4],
   suggestionTimeoutMs: [1e3, 6e4]
 };
@@ -1460,6 +2248,7 @@ function validate(config) {
   }
   if (!["ghost", "panel"].includes(config.displayMode)) throw new AssistantError("CONFIG", "\u663E\u793A\u65B9\u5F0F\u5FC5\u987B\u662F ghost \u6216 panel");
   if (!["light", "standard", "deep"].includes(config.optimizationStrength)) throw new AssistantError("CONFIG", "\u4F18\u5316\u5F3A\u5EA6\u5FC5\u987B\u662F light\u3001standard \u6216 deep");
+  if (!["concise", "standard", "detailed"].includes(config.predictionDetail)) throw new AssistantError("CONFIG", "\u9884\u6D4B\u8BE6\u7565\u5EA6\u5FC5\u987B\u662F concise\u3001standard \u6216 detailed");
   for (const [key, [min, max]] of Object.entries(numeric)) {
     const value = config[key];
     if (typeof value !== "number" || !Number.isInteger(value) || value < min || value > max) {
@@ -1481,16 +2270,44 @@ function resolveConfig(input = {}) {
 // src/browser/settings.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var NUMBERS = [
-  ["debounceMs", "\u7EED\u5199\u505C\u987F", "\u6BEB\u79D2", 200, 5e3],
-  ["minIntervalMs", "\u7EED\u5199\u8BF7\u6C42\u6700\u5C0F\u95F4\u9694", "\u6BEB\u79D2", 500, 3e4],
-  ["maxHistoryChars", "\u4F1A\u8BDD\u4E0A\u4E0B\u6587\u4E0A\u9650", "\u5B57\u7B26", 1e3, 64e3],
-  ["maxDraftChars", "\u5F85\u5904\u7406\u8349\u7A3F\u4E0A\u9650", "\u5B57\u7B26", 100, 32e3],
-  ["maxNextChars", "\u4E0B\u4E00\u53E5\u957F\u5EA6\u4E0A\u9650", "\u5B57\u7B26", 20, 300],
-  ["maxCompletionChars", "\u7EED\u5199\u957F\u5EA6\u4E0A\u9650", "\u5B57\u7B26", 10, 200],
-  ["optimizeTimeoutMs", "\u4F18\u5316\u8D85\u65F6", "\u6BEB\u79D2", 1e3, 12e4],
-  ["suggestionTimeoutMs", "\u81EA\u52A8\u5EFA\u8BAE\u8D85\u65F6", "\u6BEB\u79D2", 1e3, 6e4]
+  ["debounceMs", "\u7EED\u5199\u505C\u987F", "\u6BEB\u79D2", 200, 5e3, 50],
+  ["minIntervalMs", "\u7EED\u5199\u8BF7\u6C42\u6700\u5C0F\u95F4\u9694", "\u6BEB\u79D2", 500, 3e4, 100],
+  ["maxHistoryChars", "\u4F1A\u8BDD\u4E0A\u4E0B\u6587\u4E0A\u9650", "\u5B57\u7B26", 1e3, 64e3, 500],
+  ["maxDraftChars", "\u5F85\u5904\u7406\u8349\u7A3F\u4E0A\u9650", "\u5B57\u7B26", 100, 32e3, 100],
+  ["maxNextChars", "\u4E0B\u4E00\u53E5\u957F\u5EA6\u4E0A\u9650", "\u5B57\u7B26", 20, 1e3, 10],
+  ["maxCompletionChars", "\u7EED\u5199\u957F\u5EA6\u4E0A\u9650", "\u5B57\u7B26", 10, 500, 5],
+  ["optimizeTimeoutMs", "\u4F18\u5316\u8D85\u65F6", "\u6BEB\u79D2", 1e3, 12e4, 1e3],
+  ["suggestionTimeoutMs", "\u81EA\u52A8\u5EFA\u8BAE\u8D85\u65F6", "\u6BEB\u79D2", 1e3, 6e4, 500]
+];
+var PRESETS = [
+  { name: "\u654F\u6377\u6A21\u5F0F", description: "\u66F4\u77ED\u505C\u987F\u4E0E\u7CBE\u7B80\u9884\u6D4B\uFF0C\u9002\u5408\u5FEB\u901F\u8F93\u5165\u3002", values: {
+    debounceMs: 300,
+    minIntervalMs: 1e3,
+    optimizationStrength: "light",
+    predictionDetail: "concise",
+    maxNextChars: 60,
+    maxCompletionChars: 40
+  } },
+  { name: "\u6807\u51C6\u5E73\u8861", description: "\u5E73\u8861\u54CD\u5E94\u65F6\u673A\u4E0E\u6A21\u578B\u7528\u91CF\uFF0C\u9002\u5408\u65E5\u5E38\u5BF9\u8BDD\u3002", values: {
+    debounceMs: 600,
+    minIntervalMs: 2e3,
+    optimizationStrength: "standard",
+    predictionDetail: "standard",
+    maxNextChars: 120,
+    maxCompletionChars: 80
+  } },
+  { name: "\u8282\u6D41\u7701\u6D41", description: "\u5EF6\u957F\u505C\u987F\u4E0E\u8BF7\u6C42\u95F4\u9694\uFF0C\u51CF\u5C11\u81EA\u52A8\u8BF7\u6C42\u3002", values: {
+    debounceMs: 1500,
+    minIntervalMs: 5e3,
+    optimizationStrength: "standard",
+    predictionDetail: "concise",
+    maxNextChars: 80,
+    maxCompletionChars: 40
+  } }
 ];
+var formatValue = (value, unit) => Number.isNaN(value) ? "\u672A\u586B\u5199" : unit === "\u6BEB\u79D2" && value >= 1e3 ? `\u7EA6 ${Number((value / 1e3).toFixed(1))} \u79D2` : `${value} ${unit}`;
 function AssistantSettings({ runtime }) {
+  const fieldsId = (0, import_react2.useId)();
   const generation = (0, import_react2.useSyncExternalStore)(
     runtime.connection.generation.subscribe.bind(runtime.connection.generation),
     () => runtime.transport.generation(),
@@ -1502,13 +2319,22 @@ function AssistantSettings({ runtime }) {
   const [saving, setSaving] = (0, import_react2.useState)(false);
   const [message, setMessage] = (0, import_react2.useState)("");
   const [error, setError] = (0, import_react2.useState)("");
+  const [loadFailed, setLoadFailed] = (0, import_react2.useState)(false);
+  const [reload, setReload] = (0, import_react2.useState)(0);
+  const [catalog, setCatalog] = (0, import_react2.useState)(null);
+  const [catalogLoading, setCatalogLoading] = (0, import_react2.useState)(false);
+  const [catalogError, setCatalogError] = (0, import_react2.useState)("");
+  const [catalogReload, setCatalogReload] = (0, import_react2.useState)(0);
   (0, import_react2.useEffect)(() => {
     const abort = new AbortController();
     setLoading(true);
+    setLoadFailed(false);
+    setAccepted(null);
     setError("");
     setMessage("");
     if (generation === null) {
       setLoading(false);
+      setLoadFailed(true);
       setError("\u8FDE\u63A5\u5DF2\u65AD\u5F00\uFF0C\u8BF7\u91CD\u8FDE\u540E\u52A0\u8F7D\u8BBE\u7F6E");
       return () => abort.abort();
     }
@@ -1521,11 +2347,34 @@ function AssistantSettings({ runtime }) {
     }).catch((reason) => {
       if (!abort.signal.aborted) {
         setLoading(false);
+        setLoadFailed(true);
         setError(reason instanceof Error ? reason.message : "\u8BBE\u7F6E\u52A0\u8F7D\u5931\u8D25");
       }
     });
     return () => abort.abort();
-  }, [runtime, generation]);
+  }, [runtime, generation, reload]);
+  (0, import_react2.useEffect)(() => {
+    const abort = new AbortController();
+    setCatalog(null);
+    setCatalogError("");
+    if (generation === null) {
+      setCatalogLoading(false);
+      return () => abort.abort();
+    }
+    setCatalogLoading(true);
+    void runtime.transport.call("models/list", {}, abort.signal).then((value) => {
+      if (!abort.signal.aborted) {
+        setCatalog(value);
+        setCatalogLoading(false);
+      }
+    }).catch((reason) => {
+      if (!abort.signal.aborted) {
+        setCatalogLoading(false);
+        setCatalogError(reason instanceof Error ? reason.message : "\u6A21\u578B\u76EE\u5F55\u52A0\u8F7D\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5\u6216\u624B\u52A8\u586B\u5199");
+      }
+    });
+    return () => abort.abort();
+  }, [runtime, generation, catalogReload]);
   const change = (key, value) => {
     setForm((previous) => ({ ...previous, [key]: value }));
     setMessage("");
@@ -1558,15 +2407,41 @@ function AssistantSettings({ runtime }) {
     }
   };
   const changed = accepted !== null && JSON.stringify(form) !== JSON.stringify(accepted);
+  const selection = form.provider || form.model ? JSON.stringify([form.provider, form.model]) : "";
+  const available = catalog?.groups.some((group) => group.provider === form.provider && group.models.some((model) => model.id === form.model)) ?? false;
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("form", { className: "dsh-ia dsh-ia-settings", "aria-label": "\u8F93\u5165\u52A9\u624B\u8BBE\u7F6E", onSubmit: (event) => {
     void save(event);
   }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h2", { children: "\u8F93\u5165\u52A9\u624B" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u5E2E\u52A9\u4F60\u5F62\u6210\u51C6\u786E\u3001\u53EF\u53D1\u9001\u7684\u8F93\u5165\u3002\u5404\u529F\u80FD\u72EC\u7ACB\u5F00\u5173\uFF0C\u91C7\u7EB3\u5185\u5BB9\u540E\u4ECD\u7531\u4F60\u53D1\u9001\u3002" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u4EE5\u4E0B\u4E3A\u5168\u5C40\u8BBE\u7F6E\uFF0C\u5BF9\u6240\u6709\u4F1A\u8BDD\u751F\u6548\u3002\u5404\u529F\u80FD\u72EC\u7ACB\u5F00\u5173\uFF0C\u91C7\u7EB3\u5185\u5BB9\u540E\u4ECD\u7531\u4F60\u53D1\u9001\u3002" }),
     loading && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { role: "status", children: "\u6B63\u5728\u52A0\u8F7D\u8BBE\u7F6E\u2026" }),
     message && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { role: "status", children: message }),
     error && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { role: "alert", children: error }),
+    loadFailed && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { type: "button", disabled: loading || generation === null, onClick: () => setReload((value) => value + 1), children: "\u91CD\u65B0\u52A0\u8F7D" }),
     /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("fieldset", { disabled: loading || saving || generation === null || !accepted, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { className: "dsh-ia-section", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { children: "\u9884\u8BBE\u6863\u4F4D" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u9884\u8BBE\u53EA\u4FEE\u6539\u4E0B\u65B9\u8868\u5355\uFF0C\u70B9\u51FB\u4FDD\u5B58\u540E\u624D\u5BF9\u6240\u6709\u4F1A\u8BDD\u751F\u6548\uFF1B\u4E0D\u4F1A\u7ACB\u5373\u8C03\u7528\u6A21\u578B\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "dsh-ia-settings-presets", children: PRESETS.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          "button",
+          {
+            type: "button",
+            className: "dsh-ia-preset",
+            "aria-label": preset.name,
+            "aria-pressed": Object.entries(preset.values).every(([key, value]) => form[key] === value),
+            onClick: () => {
+              setForm((previous) => ({ ...previous, ...preset.values }));
+              setMessage(`\u5DF2\u5957\u7528\u300C${preset.name}\u300D\uFF0C\u4FDD\u5B58\u540E\u751F\u6548`);
+              setError("");
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: preset.name }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "dsh-ia-muted", children: preset.description })
+            ]
+          },
+          preset.name
+        )) })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { children: "\u529F\u80FD\u5F00\u5173" }),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dsh-ia-settings-toggles", children: [
@@ -1587,7 +2462,8 @@ function AssistantSettings({ runtime }) {
             "\u8349\u7A3F\u6682\u5B58"
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u5173\u95ED\u6682\u5B58\u540E\u4ECD\u53EF\u67E5\u770B\u548C\u5220\u9664\u5386\u53F2\u8349\u7A3F\uFF1B\u5DF2\u6709\u4F18\u5316\u6539\u52A8\u4ECD\u53EF\u67E5\u770B\u548C\u8FD8\u539F\u3002" })
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u5173\u95ED\u6682\u5B58\u540E\u4ECD\u53EF\u67E5\u770B\u548C\u5220\u9664\u5386\u53F2\u8349\u7A3F\uFF1B\u5DF2\u6709\u4F18\u5316\u6539\u52A8\u4ECD\u53EF\u67E5\u770B\u548C\u8FD8\u539F\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u56DE\u590D\u540E\u9884\u6D4B\u4E0E\u8F93\u5165\u7EED\u5199\u5F00\u542F\u540E\u4F1A\u81EA\u52A8\u8C03\u7528\u6A21\u578B\uFF0C\u6D88\u8017\u6A21\u578B\u7528\u91CF\u3002" })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { children: "\u4F18\u5316\u4E0E\u5EFA\u8BAE" }),
@@ -1599,7 +2475,16 @@ function AssistantSettings({ runtime }) {
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "deep", children: "\u6DF1\u5EA6\u68B3\u7406" })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u8F7B\u5EA6\u6DA6\u8272\u53EA\u4FEE\u6B63\u8868\u8FBE\uFF1B\u6807\u51C6\u4F18\u5316\u6574\u7406\u76EE\u6807\u4E0E\u7EA6\u675F\uFF1B\u6DF1\u5EA6\u68B3\u7406\u53EF\u91CD\u7EC4\u7ED3\u6784\u3002\u5404\u6863\u4F4D\u5747\u8981\u6C42\u4FDD\u7559\u539F\u610F\uFF0C\u4E0D\u65B0\u589E\u4EFB\u52A1\u6216\u6388\u6743\uFF1B\u5E94\u7528\u540E\u53EF\u67E5\u770B\u6539\u52A8\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u8F7B\u5EA6\u6DA6\u8272\u53EA\u4FEE\u6B63\u8868\u8FBE\uFF1B\u6807\u51C6\u4F18\u5316\u6574\u7406\u76EE\u6807\u4E0E\u7EA6\u675F\uFF1B\u6DF1\u5EA6\u68B3\u7406\u53EF\u91CD\u7EC4\u7ED3\u6784\u3002\u5404\u6863\u4F4D\u5747\u8981\u6C42\u4FDD\u7559\u539F\u610F\uFF0C\u4E0D\u65B0\u589E\u4EFB\u52A1\u6216\u6388\u6743\uFF1B\u5148\u9884\u89C8\u5DEE\u5F02\uFF0C\u91C7\u7EB3\u540E\u624D\u5199\u5165\u8349\u7A3F\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
+          "\u9884\u6D4B\u8BE6\u7565\u5EA6",
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("select", { "aria-label": "\u9884\u6D4B\u8BE6\u7565\u5EA6", value: form.predictionDetail, onChange: (event) => change("predictionDetail", event.target.value), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "concise", children: "\u7B80\u660E" }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "standard", children: "\u6807\u51C6" }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "detailed", children: "\u8BE6\u5C3D" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u7B80\u660E\u4FA7\u91CD\u77ED\u53E5\uFF0C\u6807\u51C6\u63D0\u4F9B\u81EA\u7136\u8854\u63A5\uFF0C\u8BE6\u5C3D\u5141\u8BB8\u591A\u884C\u7ED3\u6784\u5E76\u4EE5\u5019\u9009\u9762\u677F\u5B8C\u6574\u5C55\u793A\u3002\u5404\u6863\u5747\u9075\u5B88\u4F60\u8BBE\u7F6E\u7684\u957F\u5EA6\u4E0A\u9650\u3002" }),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
           "\u5EFA\u8BAE\u663E\u793A\u65B9\u5F0F",
           /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("select", { value: form.displayMode, onChange: (event) => change("displayMode", event.target.value), children: [
@@ -1610,36 +2495,93 @@ function AssistantSettings({ runtime }) {
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { children: "\u8F85\u52A9\u6A21\u578B" }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u4E24\u9879\u540C\u65F6\u7559\u7A7A\u65F6\u8DDF\u968F\u8F93\u5165\u6846\u6A21\u578B\u3002\u8F85\u52A9\u8C03\u7528\u5355\u72EC\u6D88\u8017\u6A21\u578B\u7528\u91CF\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u4EC5\u8BBE\u7F6E\u8F93\u5165\u52A9\u624B\u4F7F\u7528\u7684\u6A21\u578B\uFF0C\u4E0D\u6539\u53D8\u4E3B\u4F1A\u8BDD\u6A21\u578B\u3002\u8F85\u52A9\u8C03\u7528\u5355\u72EC\u6D88\u8017\u6A21\u578B\u7528\u91CF\u3002" }),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
-          "\u63D0\u4F9B\u5546",
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { value: form.provider, onChange: (event) => change("provider", event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", maxLength: 200, autoComplete: "off" })
+          "\u8F85\u52A9\u6A21\u578B\u9009\u62E9",
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("select", { "aria-label": "\u8F85\u52A9\u6A21\u578B\u9009\u62E9", value: selection, onChange: (event) => {
+            const [provider, model] = event.target.value ? JSON.parse(event.target.value) : ["", ""];
+            setForm((previous) => ({ ...previous, provider, model }));
+            setMessage("");
+            setError("");
+          }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "", children: "\u8DDF\u968F\u8F93\u5165\u6846\u6A21\u578B" }),
+            selection && !available && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("option", { value: selection, children: [
+              catalog ? "\u5F53\u524D\u624B\u52A8\u9009\u62E9\uFF0F\u76EE\u5F55\u672A\u5217\u51FA" : "\u5F53\u524D\u9009\u62E9\uFF0F\u76EE\u5F55\u5C1A\u672A\u786E\u8BA4",
+              "\uFF1A",
+              form.provider || "\u672A\u586B\u63D0\u4F9B\u5546",
+              " / ",
+              form.model || "\u672A\u586B\u6A21\u578B"
+            ] }),
+            catalog?.groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("optgroup", { label: group.name, children: group.models.map((model) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: JSON.stringify([group.provider, model.id]), children: model.name }, model.id)) }, group.provider))
+          ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
-          "\u6A21\u578B",
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { value: form.model, onChange: (event) => change("model", event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", maxLength: 200, autoComplete: "off" })
+        catalogLoading && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { role: "status", children: "\u6B63\u5728\u52A0\u8F7D\u6A21\u578B\u76EE\u5F55\u2026" }),
+        catalogError && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { role: "status", children: [
+          "\u6A21\u578B\u76EE\u5F55\uFF1A",
+          catalogError
+        ] }),
+        catalog && catalog.groups.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u5BBF\u4E3B\u6682\u65E0\u53EF\u7528\u6A21\u578B\uFF1B\u53EF\u5237\u65B0\u76EE\u5F55\u6216\u624B\u52A8\u586B\u5199\u3002" }),
+        catalog && catalog.failures.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { role: "status", children: [
+          "\u90E8\u5206\u63D0\u4F9B\u5546\u76EE\u5F55\u52A0\u8F7D\u5931\u8D25\uFF1A",
+          catalog.failures.map((item) => item.name).join("\u3001"),
+          "\u3002\u5DF2\u52A0\u8F7D\u6A21\u578B\u4ECD\u53EF\u9009\u62E9\u3002"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { type: "button", disabled: catalogLoading || generation === null, onClick: () => setCatalogReload((value) => value + 1), children: "\u5237\u65B0\u6A21\u578B\u5217\u8868" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("details", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("summary", { children: "\u624B\u52A8\u586B\u5199\u6A21\u578B ID" }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u76EE\u5F55\u6682\u65F6\u4E0D\u53EF\u7528\u6216\u4F7F\u7528\u81EA\u5B9A\u4E49\u6A21\u578B\u65F6\uFF0C\u53EF\u586B\u5199\u63D0\u4F9B\u5546\u4E0E\u6A21\u578B ID\uFF1B\u4E24\u9879\u540C\u65F6\u7559\u7A7A\u5219\u8DDF\u968F\u8F93\u5165\u6846\u3002" }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
+            "\u63D0\u4F9B\u5546",
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { value: form.provider, onChange: (event) => change("provider", event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", maxLength: 200, autoComplete: "off" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
+            "\u6A21\u578B",
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("input", { value: form.model, onChange: (event) => change("model", event.target.value), placeholder: "\u8DDF\u968F\u8F93\u5165\u6846", maxLength: 200, autoComplete: "off" })
+          ] })
         ] })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("details", { className: "dsh-ia-section", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("summary", { children: "\u9AD8\u7EA7\u8BBE\u7F6E" }),
-        NUMBERS.map(([key, label, unit, min, max]) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { className: "dsh-ia-field", children: [
-          label,
-          "\uFF08",
-          unit,
-          "\uFF09",
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-            "input",
-            {
-              type: "number",
-              "aria-label": `${label}\uFF08${unit}\uFF09`,
-              value: Number.isNaN(form[key]) ? "" : form[key],
-              min,
-              max,
-              step: 1,
-              required: true,
-              onChange: (event) => change(key, event.target.value === "" ? NaN : Number(event.target.value))
-            }
-          ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "dsh-ia-muted", children: "\u6ED1\u5757\u7528\u4E8E\u5FEB\u901F\u8C03\u6574\uFF0C\u6570\u503C\u6846\u652F\u6301\u7CBE\u786E\u6574\u6570\u8F93\u5165\u3002" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "dsh-ia-setting-grid", children: NUMBERS.map(([key, label, unit, min, max, step]) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dsh-ia-field", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dsh-ia-setting-heading", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { htmlFor: `${fieldsId}-${key}`, children: [
+              label,
+              "\uFF08",
+              unit,
+              "\uFF09"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "dsh-ia-muted", children: formatValue(form[key], unit) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dsh-ia-number-control", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "input",
+              {
+                id: `${fieldsId}-${key}`,
+                type: "number",
+                "aria-label": `${label}\uFF08${unit}\uFF09`,
+                value: Number.isNaN(form[key]) ? "" : form[key],
+                min,
+                max,
+                step: 1,
+                required: true,
+                onChange: (event) => change(key, event.target.value === "" ? NaN : Number(event.target.value))
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "input",
+              {
+                type: "range",
+                tabIndex: -1,
+                "aria-hidden": "true",
+                min,
+                max,
+                step,
+                value: Number.isNaN(form[key]) ? min : Math.min(max, min + Math.round((form[key] - min) / step) * step),
+                onChange: (event) => change(key, Number(event.target.value))
+              }
+            )
+          ] }),
           /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: "dsh-ia-muted", children: [
             min.toLocaleString(),
             "\u2013",
@@ -1647,7 +2589,7 @@ function AssistantSettings({ runtime }) {
             " ",
             unit
           ] })
-        ] }, key))
+        ] }, key)) })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "dsh-ia-row", children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { type: "submit", disabled: !changed, children: saving ? "\u4FDD\u5B58\u4E2D\u2026" : "\u4FDD\u5B58\u8BBE\u7F6E" }),