dsh-rewind-plugin 0.2.7 → 0.2.8

package/lib/client.js

@@ -32,6 +32,10 @@ __export(index_exports, {
 });
 module.exports = __toCommonJS(index_exports);
 
+// src/client/portals.tsx
+var import_react = require("react");
+var import_react_dom = require("react-dom");
+
 // src/client/hidden.ts
 function targetOfOutcome(text) {
   if (text === void 0) return void 0;
@@ -85,48 +89,7 @@ function hiddenSeqsOf(snap) {
   return hidden;
 }
 
-// src/client/locales.ts
-var zh = {
-  "button.aria": "\u56DE\u9000\u5230\u6B64\u6D88\u606F",
-  "button.title": "\u56DE\u9000",
-  "popover.title": "\u56DE\u9000\u5230\u8FD9\u6761\u6D88\u606F",
-  "popover.noText": "\uFF08\u65E0\u6587\u672C\uFF09",
-  "popover.chat": "\u4EC5\u56DE\u9000\u5BF9\u8BDD",
-  "popover.chat.hint": "\u53EA\u56DE\u9000\u6A21\u578B\u4E0A\u4E0B\u6587\uFF0C\u4E0D\u52A8\u5DE5\u4F5C\u533A\u6587\u4EF6",
-  "popover.both": "\u56DE\u9000\u5BF9\u8BDD\u548C\u4EE3\u7801",
-  "popover.both.hint": "\u5BF9\u8BDD\u56DE\u9000\u5E76\u8FD8\u539F\u5DE5\u4F5C\u533A\u6587\u4EF6",
-  "popover.checking": "\u6B63\u5728\u68C0\u67E5\u6587\u4EF6\u53D8\u66F4\u2026",
-  "popover.noChanges": "\u6B64\u6D88\u606F\u4E4B\u540E\u6CA1\u6709\u53EF\u8FD8\u539F\u7684\u6587\u4EF6\u53D8\u66F4\uFF0C\u4EC5\u53EF\u56DE\u9000\u5BF9\u8BDD",
-  "popover.cancel": "\u53D6\u6D88",
-  "popover.impact.loading": "\u6B63\u5728\u83B7\u53D6\u5F71\u54CD\u6E05\u5355\u2026",
-  "popover.impact.failed": "\u65E0\u6CD5\u83B7\u53D6\u5F71\u54CD\u6E05\u5355\uFF1A{message}",
-  "popover.impact.none": "\u76EE\u6807\u4E4B\u540E\u6CA1\u6709\u8DDF\u8E2A\u5230\u7684\u5199\u7C7B\u53D8\u66F4\uFF0C\u65E0\u9700\u8FD8\u539F\u6587\u4EF6\u3002",
-  "popover.confirm": "\u786E\u8BA4\u56DE\u9000",
-  "popover.back": "\u8FD4\u56DE",
-  "guard.hint": "/rewind \u547D\u4EE4\u4E0D\u652F\u6301\u624B\u52A8\u8F93\u5165\uFF0C\u8BF7\u4F7F\u7528\u6D88\u606F\u65C1\u7684 \u21B6 \u56DE\u9000\u6309\u94AE"
-};
-var en = {
-  "button.aria": "Rewind to this message",
-  "button.title": "Rewind",
-  "popover.title": "Rewind to this message",
-  "popover.noText": "(no text)",
-  "popover.chat": "Rewind conversation only",
-  "popover.chat.hint": "Cut the model context only; workspace files stay untouched",
-  "popover.both": "Rewind conversation and code",
-  "popover.both.hint": "Cut the context and restore workspace files",
-  "popover.checking": "Checking for file changes\u2026",
-  "popover.noChanges": "No tracked file changes after this message; conversation-only rewind",
-  "popover.cancel": "Cancel",
-  "popover.impact.loading": "Fetching impact list\u2026",
-  "popover.impact.failed": "Could not fetch the impact list: {message}",
-  "popover.impact.none": "No tracked file changes after the target; nothing to restore.",
-  "popover.confirm": "Confirm rewind",
-  "popover.back": "Back",
-  "guard.hint": "/rewind cannot be typed manually \u2014 use the \u21B6 button on a message to rewind."
-};
-
 // src/client/styles.ts
-var REWIND_ATTACHED = "data-dsh-rewind-attached";
 var CLASS = {
   button: "dsh-rewind-btn",
   popover: "dsh-rewind-popover",
@@ -497,14 +460,8 @@ function openPopover(opts) {
   };
 }
 
-// src/client/index.ts
-var name = "dsh-rewind";
-var inject = ["sessions", "locale"];
-var NS = "rewind";
-var USER_SEAT_SELECTOR = '[data-chat-flow-kind="user"], [data-chat-flow-kind="steering"]';
-var CHAT_SEAT_SELECTOR = "[data-chat-anchor-key]";
-var ACTIONS_ROOT_SELECTOR = "[data-time-hover-root]";
-var COMPOSER_SELECTOR = "[data-input-scroll] textarea, textarea[data-phase]";
+// src/client/portals.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
 function messagePreviewOf(node) {
   const text = node.content.map((block) => block.type === "text" && typeof block.text === "string" ? block.text : "").join("").replace(/\s+/g, " ").trim();
   return text.length <= 80 ? text : `${text.slice(0, 79)}\u2026`;
@@ -530,90 +487,82 @@ function fillComposer(text) {
   textarea.focus();
   return true;
 }
-function apply(ctx) {
-  ctx.effect(function* () {
-    yield ctx.locale.register(NS, { zh, en });
-    const t = ctx.locale.bind(NS);
-    const style = document.createElement("style");
-    style.dataset.plugin = "dsh-rewind";
-    style.textContent = STYLE;
-    document.head.appendChild(style);
-    const hidden = /* @__PURE__ */ new WeakSet();
-    const buttons = /* @__PURE__ */ new Map();
-    let observer = null;
-    const refreshButtonLabels = () => {
-      for (const button of buttons.values()) {
-        button.setAttribute("aria-label", t("button.aria"));
-        button.title = t("button.title");
-      }
-    };
-    const unsubscribeLocale = ctx.locale.subscribe(refreshButtonLabels);
-    const sessionFor = () => {
-      const sessionId = ctx.sessions.list.getSnapshot().current;
-      if (sessionId === void 0) return void 0;
-      return ctx.sessions.binding(sessionId)?.session;
-    };
-    const userNodeFor = (key, session) => {
-      const node = session.getSnapshot().chat.nodes.get(key);
-      if (node === void 0 || node.kind !== "user" && node.kind !== "steering") return void 0;
-      return node.data;
-    };
-    const attach = (seat) => {
-      const key = seat.dataset.chatAnchorKey;
-      if (key === void 0) return;
-      const existing = buttons.get(key);
-      if (existing !== void 0 && existing.isConnected) return;
-      const hoverRoot = seat.querySelector(ACTIONS_ROOT_SELECTOR);
-      const actions = hoverRoot?.lastElementChild;
-      if (!(actions instanceof HTMLElement) || actions.querySelector("button") === null) return;
-      const button = document.createElement("button");
-      button.type = "button";
-      button.className = CLASS.button;
-      button.setAttribute("aria-label", t("button.aria"));
-      button.title = t("button.title");
-      button.innerHTML = REWIND_ICON_SVG;
-      button.addEventListener("click", (event) => {
-        event.stopPropagation();
-        const session = sessionFor();
-        if (session === void 0) {
-          console.warn("[dsh-rewind] rewind button clicked with no current session");
-          return;
-        }
-        const node = userNodeFor(key, session);
-        if (node === void 0) return;
-        openPopover({
-          session,
-          seq: node.seq,
-          time: node.time,
-          preview: messagePreviewOf(node),
-          anchor: button,
-          t,
-          onRewind: (mode) => {
-            void runRewindAndFill(session, node.seq, mode);
-          }
-        });
-      });
-      actions.appendChild(button);
-      buttons.set(key, button);
-      seat.setAttribute(REWIND_ATTACHED, "");
-    };
-    const scan = () => {
-      for (const [key, button] of buttons) {
-        if (!button.isConnected) buttons.delete(key);
+function userNodeOf(session, key) {
+  const node = session.getSnapshot().chat.nodes.get(key);
+  if (node === void 0 || node.kind !== "user" && node.kind !== "steering") return void 0;
+  return node.data;
+}
+async function runRewindAndFill(session, seq, mode, currentSessionId) {
+  const known = knownCommandSeqs(session, (node) => isExecutedRewindCommand(node, seq));
+  const result = await session.command(`/rewind @${seq} ${mode}`);
+  if (!result.ok || result.value?.matched !== true) return;
+  const outcome = await waitForCommand(session, (node) => isExecutedRewindCommand(node, seq) && !known.has(node.seq), 2e4);
+  if (outcome === null || outcome.kind !== "success") return;
+  if (currentSessionId() !== session.sessionId) return;
+  const text = userTextAt(session, seq);
+  if (text === void 0 || text === "") return;
+  fillComposer(text);
+}
+var COMPOSER_SELECTOR = "[data-input-scroll] textarea, textarea[data-phase]";
+var USER_SEAT_SELECTOR = '[data-chat-flow-kind="user"][data-chat-anchor-key], [data-chat-flow-kind="steering"][data-chat-anchor-key]';
+var CHAT_SEAT_SELECTOR = "[data-chat-anchor-key]";
+var ACTIONS_ROOT_SELECTOR = "[data-time-hover-root]";
+function collectTargets(chat, hiddenSeqs) {
+  const rows = /* @__PURE__ */ new Map();
+  for (const element of document.querySelectorAll(USER_SEAT_SELECTOR)) {
+    const key = element.dataset.chatAnchorKey;
+    if (key !== void 0) rows.set(key, element);
+  }
+  const targets = [];
+  for (const key of chat.order) {
+    const node = chat.nodes.get(key);
+    if (node === void 0 || node.kind !== "user" && node.kind !== "steering") continue;
+    const user = node.data;
+    if (hiddenSeqs.has(node.anchorSeq ?? user.seq)) continue;
+    const row = rows.get(key);
+    const messageRoot = row?.querySelector(ACTIONS_ROOT_SELECTOR);
+    const actions = messageRoot?.lastElementChild;
+    if (!(actions instanceof HTMLElement) || actions.querySelector("button") === null) continue;
+    targets.push({ key, container: actions, seq: user.seq, time: user.time, preview: messagePreviewOf(user) });
+  }
+  return targets;
+}
+function sameTargets(left, right) {
+  return left.length === right.length && left.every((target, index) => {
+    const other = right[index];
+    return other !== void 0 && target.key === other.key && target.container === other.container && target.seq === other.seq;
+  });
+}
+function RewindPortals({ sessionId, sessionOf, currentSessionId, t, subscribeLocale }) {
+  const [targets, setTargets] = (0, import_react.useState)([]);
+  const hidden = (0, import_react.useRef)(/* @__PURE__ */ new WeakSet());
+  const [, forceRender] = (0, import_react.useReducer)((count) => count + 1, 0);
+  (0, import_react.useEffect)(() => subscribeLocale(() => {
+    forceRender();
+  }), [subscribeLocale]);
+  (0, import_react.useLayoutEffect)(() => {
+    let active = true;
+    let queued = false;
+    const refresh = () => {
+      if (!active) return;
+      const session = sessionOf(sessionId);
+      if (session === void 0) {
+        setTargets([]);
+        return;
       }
-      const session = sessionFor();
-      const hiddenSeqs = session !== void 0 ? hiddenSeqsOf(session.getSnapshot().chat) : /* @__PURE__ */ new Set();
+      const chat = session.getSnapshot().chat;
+      const hiddenSeqs = hiddenSeqsOf(chat);
       let hiddenCount = 0;
       for (const seat of document.querySelectorAll(CHAT_SEAT_SELECTOR)) {
         const key = seat.dataset.chatAnchorKey;
-        const anchor = key !== void 0 && session !== void 0 ? session.getSnapshot().chat.nodes.get(key)?.anchorSeq : void 0;
+        const anchor = key !== void 0 ? chat.nodes.get(key)?.anchorSeq : void 0;
         if (anchor !== void 0 && hiddenSeqs.has(anchor)) {
           seat.style.display = "none";
-          hidden.add(seat);
+          hidden.current.add(seat);
           hiddenCount += 1;
-        } else if (hidden.has(seat)) {
+        } else if (hidden.current.has(seat)) {
           seat.style.display = "";
-          hidden.delete(seat);
+          hidden.current.delete(seat);
         }
       }
       if (hiddenSeqs.size > 0 || hiddenCount > 0) {
@@ -621,23 +570,151 @@ function apply(ctx) {
           `[dsh-rewind] hiding: ${hiddenCount} rows, seqs [${[...hiddenSeqs].slice(0, 20).join(", ")}${hiddenSeqs.size > 20 ? "\u2026" : ""}]`
         );
       }
-      for (const seat of document.querySelectorAll(USER_SEAT_SELECTOR)) {
-        if (!hidden.has(seat)) attach(seat);
-      }
+      const next = collectTargets(chat, hiddenSeqs);
+      setTargets((current) => sameTargets(current, next) ? current : next);
     };
-    const runRewindAndFill = async (session, seq, mode) => {
-      const known = knownCommandSeqs(session, (node) => isExecutedRewindCommand(node, seq));
-      const result = await session.command(`/rewind @${seq} ${mode}`);
-      if (!result.ok || result.value?.matched !== true) return;
-      const outcome = await waitForCommand(session, (node) => isExecutedRewindCommand(node, seq) && !known.has(node.seq), 2e4);
-      if (outcome === null || outcome.kind !== "success") return;
-      if (sessionFor() !== session) return;
-      const text = userTextAt(session, seq);
-      if (text === void 0 || text === "") return;
-      fillComposer(text);
+    const queueRefresh = () => {
+      if (queued || !active) return;
+      queued = true;
+      queueMicrotask(() => {
+        queued = false;
+        refresh();
+      });
     };
+    refresh();
+    const observer = new MutationObserver(queueRefresh);
+    observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ["style"] });
+    return () => {
+      active = false;
+      observer.disconnect();
+    };
+  }, [sessionId, sessionOf]);
+  return targets.map((target) => (0, import_react_dom.createPortal)(
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      RewindButton,
+      {
+        target,
+        sessionId,
+        sessionOf,
+        currentSessionId,
+        t
+      },
+      target.key
+    ),
+    target.container,
+    target.key
+  ));
+}
+function RewindButton({ target, sessionId, sessionOf, currentSessionId, t }) {
+  const onClick = (event) => {
+    event.stopPropagation();
+    const session = sessionOf(sessionId);
+    if (session === void 0) {
+      console.warn("[dsh-rewind] rewind button clicked with no session binding");
+      return;
+    }
+    const node = userNodeOf(session, target.key);
+    if (node === void 0) return;
+    openPopover({
+      session,
+      seq: node.seq,
+      time: node.time,
+      preview: messagePreviewOf(node),
+      anchor: event.currentTarget,
+      t,
+      onRewind: (mode) => {
+        void runRewindAndFill(session, node.seq, mode, currentSessionId);
+      }
+    });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      type: "button",
+      className: CLASS.button,
+      "aria-label": t("button.aria"),
+      title: t("button.title"),
+      onClick,
+      dangerouslySetInnerHTML: { __html: REWIND_ICON_SVG }
+    }
+  );
+}
+function createRewindBridge(deps) {
+  return function RewindBridge({ sessionId }) {
+    return (0, import_react.createElement)(RewindPortals, { sessionId, ...deps });
+  };
+}
+
+// src/client/locales.ts
+var zh = {
+  "button.aria": "\u56DE\u9000\u5230\u6B64\u6D88\u606F",
+  "button.title": "\u56DE\u9000",
+  "popover.title": "\u56DE\u9000\u5230\u8FD9\u6761\u6D88\u606F",
+  "popover.noText": "\uFF08\u65E0\u6587\u672C\uFF09",
+  "popover.chat": "\u4EC5\u56DE\u9000\u5BF9\u8BDD",
+  "popover.chat.hint": "\u53EA\u56DE\u9000\u6A21\u578B\u4E0A\u4E0B\u6587\uFF0C\u4E0D\u52A8\u5DE5\u4F5C\u533A\u6587\u4EF6",
+  "popover.both": "\u56DE\u9000\u5BF9\u8BDD\u548C\u4EE3\u7801",
+  "popover.both.hint": "\u5BF9\u8BDD\u56DE\u9000\u5E76\u8FD8\u539F\u5DE5\u4F5C\u533A\u6587\u4EF6",
+  "popover.checking": "\u6B63\u5728\u68C0\u67E5\u6587\u4EF6\u53D8\u66F4\u2026",
+  "popover.noChanges": "\u6B64\u6D88\u606F\u4E4B\u540E\u6CA1\u6709\u53EF\u8FD8\u539F\u7684\u6587\u4EF6\u53D8\u66F4\uFF0C\u4EC5\u53EF\u56DE\u9000\u5BF9\u8BDD",
+  "popover.cancel": "\u53D6\u6D88",
+  "popover.impact.loading": "\u6B63\u5728\u83B7\u53D6\u5F71\u54CD\u6E05\u5355\u2026",
+  "popover.impact.failed": "\u65E0\u6CD5\u83B7\u53D6\u5F71\u54CD\u6E05\u5355\uFF1A{message}",
+  "popover.impact.none": "\u76EE\u6807\u4E4B\u540E\u6CA1\u6709\u8DDF\u8E2A\u5230\u7684\u5199\u7C7B\u53D8\u66F4\uFF0C\u65E0\u9700\u8FD8\u539F\u6587\u4EF6\u3002",
+  "popover.confirm": "\u786E\u8BA4\u56DE\u9000",
+  "popover.back": "\u8FD4\u56DE",
+  "guard.hint": "/rewind \u547D\u4EE4\u4E0D\u652F\u6301\u624B\u52A8\u8F93\u5165\uFF0C\u8BF7\u4F7F\u7528\u6D88\u606F\u65C1\u7684 \u21B6 \u56DE\u9000\u6309\u94AE"
+};
+var en = {
+  "button.aria": "Rewind to this message",
+  "button.title": "Rewind",
+  "popover.title": "Rewind to this message",
+  "popover.noText": "(no text)",
+  "popover.chat": "Rewind conversation only",
+  "popover.chat.hint": "Cut the model context only; workspace files stay untouched",
+  "popover.both": "Rewind conversation and code",
+  "popover.both.hint": "Cut the context and restore workspace files",
+  "popover.checking": "Checking for file changes\u2026",
+  "popover.noChanges": "No tracked file changes after this message; conversation-only rewind",
+  "popover.cancel": "Cancel",
+  "popover.impact.loading": "Fetching impact list\u2026",
+  "popover.impact.failed": "Could not fetch the impact list: {message}",
+  "popover.impact.none": "No tracked file changes after the target; nothing to restore.",
+  "popover.confirm": "Confirm rewind",
+  "popover.back": "Back",
+  "guard.hint": "/rewind cannot be typed manually \u2014 use the \u21B6 button on a message to rewind."
+};
+
+// src/client/index.ts
+var name = "dsh-rewind";
+var inject = ["slots", "sessions", "locale"];
+var NS = "rewind";
+var HEADER_ACTIONS_SLOT = "conversation.session.header.actions";
+var COMPOSER_SELECTOR2 = "[data-input-scroll] textarea, textarea[data-phase]";
+function apply(ctx) {
+  ctx.effect(function* () {
+    yield ctx.locale.register(NS, { zh, en });
+    const t = ctx.locale.bind(NS);
+    const style = document.createElement("style");
+    style.dataset.plugin = "dsh-rewind";
+    style.textContent = STYLE;
+    document.head.appendChild(style);
+    const sessionOf = (sessionId) => ctx.sessions.binding(sessionId)?.session;
+    const currentSessionId = () => ctx.sessions.list.getSnapshot().current;
+    const subscribeLocale = (cb) => ctx.locale.subscribe(cb);
+    const slots = ctx.slots;
+    yield slots.inject(HEADER_ACTIONS_SLOT, () => slots.register(
+      {
+        name: HEADER_ACTIONS_SLOT,
+        // A distinct list-entry id keeps the bridge from shadowing any other
+        // header action; the entry renders portals only, never header UI.
+        id: "dsh-rewind-portals",
+        order: 1e3
+      },
+      createRewindBridge({ sessionOf, currentSessionId, t, subscribeLocale })
+    ));
     const MANUAL_REWIND = /^\s*\/rewind(?:\s|$)/i;
-    const composerTextarea = () => document.querySelector(COMPOSER_SELECTOR);
+    const composerTextarea = () => document.querySelector(COMPOSER_SELECTOR2);
     const hasBlockedRewindDraft = () => {
       const textarea = composerTextarea();
       return textarea !== null && MANUAL_REWIND.test(textarea.value);
@@ -651,7 +728,7 @@ function apply(ctx) {
       if (textarea === null) return;
       const card = textarea.closest("[data-composer-card]");
       const hint = document.createElement("div");
-      hint.className = CLASS.guardHint;
+      hint.className = "dsh-rewind-guard-hint";
       hint.setAttribute("role", "status");
       hint.textContent = t("guard.hint");
       document.body.appendChild(hint);
@@ -689,19 +766,11 @@ function apply(ctx) {
     };
     document.addEventListener("keydown", onKeyDownGuard, true);
     document.addEventListener("click", onClickGuard, true);
-    observer = new MutationObserver(scan);
-    observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ["style"] });
-    scan();
     yield () => {
-      unsubscribeLocale();
       document.removeEventListener("keydown", onKeyDownGuard, true);
       document.removeEventListener("click", onClickGuard, true);
       if (guardHintEl !== null) guardHintEl.remove();
       if (guardHintTimer !== void 0) window.clearTimeout(guardHintTimer);
-      observer?.disconnect();
-      for (const button of buttons.values()) button.remove();
-      buttons.clear();
-      closePopover();
       style.remove();
     };
   }, "dsh-rewind client lifecycle");

package/lib/types/client/index.d.ts

@@ -1,23 +1,19 @@
 /**
- * dsh-rewind client half: the per-user-message ↶ rewind button and the
- * mode-selection popover, injected into the conversation DOM (pure plugin —
- * no harness source patches).
+ * dsh-rewind client half: the manual `/rewind` composer guard, the locale
+ * registration, and the session-scoped portal bridge that renders the
+ * per-message ↶ rewind button (see `portals.tsx` for the button itself).
  *
- * Anchoring: each chat node seat renders `[data-chat-flow-kind]` with
- * `data-chat-anchor-key`; a `MutationObserver` tracks newly rendered user
- * seats and appends the rewind button into the message's IconActions row.
- * The seq is never parsed from DOM text — the key is looked up in the runtime
- * snapshot (`session.getSnapshot().chat.nodes.get(key)`) to get the durable
- * `UserMessageNode.seq`.
- *
- * Interaction: clicking a message's button fixes the target (step one), the
- * popover offers the two modes (step two); "rewind conversation and code"
- * first fetches the impact list via `/rewind preview @seq both` and confirms
- * before executing. Execution always goes through `session.command(...)`, the
- * same host path the `/rewind` command uses.
+ * The button is NOT injected by hand into the DOM anymore: the plugin
+ * registers a bridge into the harness's `conversation.session.header.actions`
+ * list slot, and that bridge portals a React button into every user message's
+ * IconActions row — the same rendering family as the copy button (a React
+ * child of the actions row), without touching any harness source. The
+ * registration is typed structurally (see `SlotsLike` in portals.tsx), so the
+ * plugin never imports conversation UI types and survives harness version
+ * drift.
  *
  * Manual composer input of `/rewind` is deliberately blocked (the guard
- * below): the command exists only as the per-message button's internal
+ * below): the command exists only as the per-message ↶ button's internal
  * channel, so any `/rewind` line typed by hand — bare or with arguments — is
  * stopped with a hint pointing at the button.
  *
@@ -27,7 +23,7 @@ import type { ClientContext } from '@deepseek-ai/dsh-client-runtime/client';
 export declare const name = "dsh-rewind";
 export declare const inject: string[];
 /**
- * Client plugin body: button injection + popover wiring.
- * @param ctx - client root context carrying `sessions` and `locale`.
+ * Client plugin body: composer guard + locale + the portal bridge.
+ * @param ctx - client root context carrying `slots`, `sessions` and `locale`.
  */
 export declare function apply(ctx: ClientContext): void;

package/lib/types/client/portals.d.ts

@@ -0,0 +1,66 @@
+/**
+ * dsh-rewind portal half: the per-user-message ↶ rewind button, rendered as a
+ * React portal inside the message's `MessageIconActions` row.
+ *
+ * Why portals (aligned with the copy button's own rendering): the copy button
+ * is a React child of the actions row, painted in the same commit as the
+ * bubble. A pure-DOM `appendChild` (the earlier approach) lands one microtask
+ * later and re-runs a full-transcript scan on EVERY mutation, which can push
+ * the paint of a newly sent bubble — the "occasional hiccup before the bubble
+ * shows". Portals let React own the button lifecycle (mount/unmount with the
+ * row, no orphaned buttons, no manual re-attach after harness re-renders),
+ * and the target collection is coalesced (one refresh per mutation batch) and
+ * diffed (no setState churn when nothing changed).
+ *
+ * Mount point: the plugin registers a session-scoped bridge into the harness's
+ * `conversation.session.header.actions` list slot. The bridge renders NO
+ * header UI — it only portals buttons into the user rows of the session the
+ * harness mounts it for. That slot is the harness-native way to get a
+ * per-session React mount without touching any source; the registration is
+ * typed structurally (see `SlotsLike`) so the plugin never imports the
+ * conversation UI package's types and survives its version drift.
+ *
+ * @module dsh-rewind/client/portals
+ */
+import { type ReactNode } from 'react';
+import type { SessionFace } from '@deepseek-ai/dsh-client-runtime/client';
+import type { RewindKey } from './locales.ts';
+type Translate = (key: RewindKey, params?: Record<string, unknown>) => string;
+/** Capabilities the session-scoped bridge receives from the plugin apply(). */
+export interface RewindBridgeDeps {
+    readonly sessionOf: (sessionId: string) => SessionFace | undefined;
+    readonly currentSessionId: () => string | undefined;
+    readonly t: Translate;
+    readonly subscribeLocale: (cb: () => void) => () => void;
+}
+/** Structural face of the runtime slot service (see the module doc). */
+export interface SlotsLike {
+    inject(key: string, install: () => () => void): () => void;
+    register(entry: {
+        readonly name: string;
+        readonly id: string;
+        readonly order: number;
+    }, component: (props: {
+        readonly sessionId: string;
+    }) => ReactNode): () => void;
+}
+interface RewindPortalsProps extends RewindBridgeDeps {
+    readonly sessionId: string;
+}
+/**
+ * Session-scoped portal bridge: renders the ↶ button of every user message
+ * row of the session the harness mounts it for. The refresh is coalesced
+ * (one pass per mutation batch via queueMicrotask) and diffed (setState is
+ * skipped when the target set is unchanged), so the plugin never runs a
+ * synchronous full-transcript scan inside a commit microtask.
+ */
+export declare function RewindPortals({ sessionId, sessionOf, currentSessionId, t, subscribeLocale }: RewindPortalsProps): ReactNode;
+/**
+ * Build the slot-entry component for the plugin apply(): a tiny bridge that
+ * injects the apply-time capabilities (session resolution, locale, rewind
+ * runner) into the module-level `RewindPortals`.
+ */
+export declare function createRewindBridge(deps: RewindBridgeDeps): (props: {
+    readonly sessionId: string;
+}) => ReactNode;
+export {};

package/lib/types/client/styles.d.ts

@@ -5,8 +5,6 @@
  *
  * @module dsh-rewind/client/styles
  */
-/** Marker attribute set on a seat row once its rewind button is attached. */
-export declare const REWIND_ATTACHED = "data-dsh-rewind-attached";
 /** Class names shared between the injected DOM and the stylesheet. */
 export declare const CLASS: {
     readonly button: 'dsh-rewind-btn';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-rewind-plugin",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "DeepSeek Harness plugin: in-place conversation rewind in the same session window (Claude Code /rewind semantics) with optional workspace file restore",
   "keywords": [
     "deepseek-harness",
@@ -54,7 +54,8 @@
     "client": {
       "inject": [
         "@deepseek-ai/dsh-client-locale",
-        "@deepseek-ai/dsh-client-runtime"
+        "@deepseek-ai/dsh-client-runtime",
+        "@deepseek-ai/dsh-client-ui-conversation"
       ],
       "platform": "web"
     }
@@ -126,7 +127,11 @@
     "@deepseek-ai/dsh-session": "^0.1.0-rc.7",
     "@deepseek-ai/dsh-tools": "^0.1.0-rc.7",
     "@types/node": "^24.0.0",
+    "@types/react": "^18.3.31",
+    "@types/react-dom": "^18.3.7",
     "esbuild": "^0.28.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "typescript": "^7.0.2",
     "vitest": "^4.1.10"
   }