pi-studio 0.5.50 → 0.5.51

package/CHANGELOG.md

@@ -4,6 +4,19 @@ All notable changes to `pi-studio` are documented here.
 
 ## [Unreleased]
 
+## [0.5.51] — 2026-04-09
+
+### Added
+- Raw-editor selection actions now also include a transient **Jump** control beside **Comment** when the right pane is showing **Editor (Preview)**, so editor selections can reveal the corresponding preview location without creating a local comment first.
+
+### Changed
+- Selection-time **Comment** / **Jump** affordances are now more consistent across raw editor and preview: preview-side actions use a fixed top-right action area while remaining transient and selection-only.
+- Standalone selection **Jump** actions now use the same preview highlight/reveal treatment as comment-card jumps, making it easier to stay oriented after jumping in either direction.
+
+### Fixed
+- Preview-side selection actions are once again hidden unless an appropriate preview text selection is active.
+- Code/text/diff preview selection mapping now preserves literal underscores in identifiers such as `add_subplot`, avoiding comment/jump failures caused by markdown-style underscore stripping.
+
 ## [0.5.50] — 2026-04-09
 
 ### Added

package/README.md

@@ -18,7 +18,7 @@ Extension for [pi](https://pi.dev) that opens a local two-pane browser workspace
 - Supports one canonical full Studio view per Pi session, plus additional editor-only companion views when you just want extra editing/preview surfaces
 - Runs editor text directly, or asks for structured critique (auto/writing/code focus)
 - Includes a local persistent scratchpad for quick notes you want to keep out of the main editor until you're ready to copy or insert them
-- Includes local comments anchored to selections/lines, shown in a docked **Comments** rail, with **Comment** actions from raw-editor selections plus editor-preview selections for Markdown, LaTeX, and code/text/diff previews, alongside a transient preview **Jump** action and optional inline `[an: ...]` toggles when you want comments reflected in the document text
+- Includes local comments anchored to selections/lines, shown in a docked **Comments** rail, with transient **Comment** / **Jump** actions from raw-editor selections plus editor-preview selections for Markdown, LaTeX, and code/text/diff previews, alongside optional inline `[an: ...]` toggles when you want comments reflected in the document text
 - Browses response history (`Prev/Next/Last`) and loads either:
   - response text
   - critique notes/full critique

package/client/studio-client.js

@@ -53,7 +53,9 @@
       const lineNumberGutterContentEl = document.getElementById("lineNumberGutterContent");
       const lineNumberMeasureEl = document.getElementById("lineNumberMeasure");
       const sourcePreviewEl = document.getElementById("sourcePreview");
+      const editorSelectionActionsEl = document.getElementById("editorSelectionActions");
       const editorSelectionCommentBtn = document.getElementById("editorSelectionCommentBtn");
+      const editorSelectionJumpBtn = document.getElementById("editorSelectionJumpBtn");
       const leftPaneEl = document.getElementById("leftPane");
       const rightPaneEl = document.getElementById("rightPane");
       const sourceBadgeEl = document.getElementById("sourceBadge");
@@ -3859,11 +3861,6 @@
               + " data-review-note-line-end='" + String(lineNumber) + "'"
               + " data-preview-comment-kind='" + escapeHtml(kind) + "'"
               + ">"
-              + "<div class='preview-comment-controls'>"
-              + "<button type='button' class='preview-comment-summary' hidden></button>"
-              + "<button type='button' class='preview-comment-add' data-preview-comment-action='comment'>Comment</button>"
-              + "<button type='button' class='preview-comment-jump' data-preview-comment-action='jump'>Jump</button>"
-              + "</div>"
               + "<div class='preview-comment-block-content preview-code-line-content'>" + lineHtml + "</div>"
               + "</div>",
           );
@@ -3879,6 +3876,7 @@
         clearPreviewJumpHighlight(targetEl);
         finishPreviewRender(targetEl);
         targetEl.innerHTML = buildCodePreviewHtmlWithCommentBlocks(text, editorLanguage || "");
+        ensurePreviewSelectionActions(targetEl);
         updatePreviewCommentBlocksForElement(targetEl);
         if (pane === "response") {
           applyPendingResponseScrollReset();
@@ -5575,8 +5573,23 @@
         return bestIndex;
       }
 
+      function buildLiteralPreviewDisplayMap(text, rawOffsets) {
+        const source = String(text || "");
+        const rawMap = Array.isArray(rawOffsets) ? rawOffsets : [];
+        const charStarts = [];
+        const charEnds = [];
+        for (let i = 0; i < source.length; i += 1) {
+          charStarts.push(rawMap[i]);
+          charEnds.push(rawMap[i] + 1);
+        }
+        return buildNormalizedPreviewDisplayMap(source, charStarts, charEnds);
+      }
+
       function buildPreviewSelectionDisplayMap(blockText, kind) {
         const body = buildPreviewSelectionSourceBody(blockText, kind);
+        if (kind === "code-line" || kind === "diff-line" || kind === "text-line") {
+          return buildLiteralPreviewDisplayMap(body.text, body.rawOffsets);
+        }
         const inlineMap = buildPreviewInlineDisplayMap(body.text, body.rawOffsets);
         return buildNormalizedPreviewDisplayMap(inlineMap.text, inlineMap.charStarts, inlineMap.charEnds);
       }
@@ -5593,6 +5606,7 @@
       function getPreviewCommentSelectionKey(selection) {
         if (!selection) return "";
         return [
+          String(selection.paneId || ""),
           String(selection.blockKey || ""),
           String(selection.selectionStart || 0),
           String(selection.selectionEnd || 0),
@@ -5620,6 +5634,96 @@
           : null;
       }
 
+      function getPreviewSelectionPaneIdForNode(node) {
+        if (!node) return "";
+        const element = node instanceof Element ? node : node.parentElement;
+        const paneEl = element && typeof element.closest === "function"
+          ? element.closest("#sourcePreview, #critiqueView")
+          : null;
+        return paneEl && paneEl.id ? String(paneEl.id) : "";
+      }
+
+      function getPreviewSelectionPaneElement(paneId) {
+        if (paneId === "sourcePreview") return sourcePreviewEl;
+        if (paneId === "critiqueView") return critiqueViewEl;
+        return null;
+      }
+
+      function getActivePreviewSelectionForPane(paneId) {
+        if (!paneId) return null;
+        return activePreviewCommentSelection && activePreviewCommentSelection.paneId === paneId
+          ? activePreviewCommentSelection
+          : null;
+      }
+
+      function ensurePreviewSelectionActions(targetEl) {
+        if (!targetEl || typeof document.createElement !== "function") return null;
+        const paneId = targetEl.id ? String(targetEl.id) : "";
+        if (!paneId) return null;
+        const existing = Array.from(targetEl.children || []).find((child) => child.classList && child.classList.contains("preview-selection-actions"));
+        if (existing) {
+          existing.dataset.previewPane = paneId;
+          return existing;
+        }
+
+        const actionsEl = document.createElement("div");
+        actionsEl.className = "preview-selection-actions";
+        actionsEl.dataset.previewPane = paneId;
+        actionsEl.hidden = true;
+
+        const commentBtn = document.createElement("button");
+        commentBtn.type = "button";
+        commentBtn.className = "preview-comment-add";
+        commentBtn.dataset.previewCommentAction = "comment";
+        commentBtn.textContent = "Comment";
+        commentBtn.hidden = true;
+        actionsEl.appendChild(commentBtn);
+
+        const jumpBtn = document.createElement("button");
+        jumpBtn.type = "button";
+        jumpBtn.className = "preview-comment-jump";
+        jumpBtn.dataset.previewCommentAction = "jump";
+        jumpBtn.textContent = "Jump";
+        jumpBtn.hidden = true;
+        actionsEl.appendChild(jumpBtn);
+
+        targetEl.insertBefore(actionsEl, targetEl.firstChild || null);
+        return actionsEl;
+      }
+
+      function updatePreviewSelectionActions(targetEl) {
+        if (!targetEl) return;
+        const actionsEl = ensurePreviewSelectionActions(targetEl);
+        if (!actionsEl) return;
+        const paneId = targetEl.id ? String(targetEl.id) : "";
+        const selection = getActivePreviewSelectionForPane(paneId);
+        const commentBtn = actionsEl.querySelector(".preview-comment-add");
+        const jumpBtn = actionsEl.querySelector(".preview-comment-jump");
+        if (!selection) {
+          actionsEl.hidden = true;
+          if (commentBtn) commentBtn.hidden = true;
+          if (jumpBtn) jumpBtn.hidden = true;
+          return;
+        }
+        const lineLabel = summarizeReviewNoteAnchor(selection).toLowerCase();
+        const blockKindLabel = getPreviewCommentBlockKindLabel(selection.previewCommentKind || "paragraph");
+        actionsEl.hidden = false;
+        if (commentBtn) {
+          commentBtn.hidden = false;
+          commentBtn.dataset.previewCommentMode = "selection";
+          commentBtn.dataset.previewPane = paneId;
+          commentBtn.title = "Add a local comment from the current preview selection on this " + blockKindLabel + " (" + lineLabel + ").";
+          commentBtn.setAttribute("aria-label", commentBtn.title || "Comment");
+        }
+        if (jumpBtn) {
+          jumpBtn.hidden = false;
+          jumpBtn.dataset.previewCommentMode = "selection";
+          jumpBtn.dataset.previewPane = paneId;
+          jumpBtn.title = "Jump to the current preview selection on this " + blockKindLabel + " in the raw editor (" + lineLabel + ").";
+          jumpBtn.setAttribute("aria-label", jumpBtn.title || "Jump");
+        }
+      }
+
       function unwrapPreviewJumpHighlightElement(element) {
         if (!element || !element.parentNode) return;
         const parent = element.parentNode;
@@ -6449,52 +6553,26 @@
 
       function updatePreviewCommentBlockState(blockEl, sourceText, displayNotes) {
         if (!blockEl || !blockEl.dataset) return;
-        const lineStart = Math.max(1, Number(blockEl.dataset.reviewNoteLineStart) || 1);
-        const lineEnd = Math.max(lineStart, Number(blockEl.dataset.reviewNoteLineEnd) || lineStart);
-        const summaryBtn = blockEl.querySelector(".preview-comment-summary");
-        const addBtn = blockEl.querySelector(".preview-comment-add");
-        const jumpBtn = blockEl.querySelector(".preview-comment-jump");
-        const lineLabel = summarizeReviewNoteAnchor({ lineStart: lineStart, lineEnd: lineEnd }).toLowerCase();
-        const blockKindLabel = getPreviewCommentBlockKindLabel(blockEl.dataset.previewCommentKind || "paragraph");
         const blockKey = getPreviewCommentBlockKey(blockEl);
-        const hasSelection = Boolean(activePreviewCommentSelection && activePreviewCommentSelection.blockKey === blockKey);
+        const paneId = getPreviewSelectionPaneIdForNode(blockEl);
+        const hasSelection = Boolean(
+          activePreviewCommentSelection
+          && activePreviewCommentSelection.paneId === paneId
+          && activePreviewCommentSelection.blockKey === blockKey
+        );
 
         blockEl.classList.remove("has-comments");
         blockEl.classList.toggle("has-selection", hasSelection);
-
-        if (summaryBtn) {
-          summaryBtn.hidden = true;
-          summaryBtn.textContent = "";
-          summaryBtn.dataset.reviewNoteId = "";
-        }
-
-        if (addBtn) {
-          addBtn.hidden = !hasSelection;
-          addBtn.textContent = "Comment";
-          addBtn.dataset.previewCommentMode = hasSelection ? "selection" : "";
-          addBtn.title = hasSelection
-            ? ("Add a local comment from the current preview selection on this " + blockKindLabel + " (" + lineLabel + ").")
-            : "";
-          addBtn.setAttribute("aria-label", addBtn.title || "Comment");
-        }
-
-        if (jumpBtn) {
-          jumpBtn.hidden = !hasSelection;
-          jumpBtn.textContent = "Jump";
-          jumpBtn.dataset.previewCommentMode = hasSelection ? "selection" : "";
-          jumpBtn.title = hasSelection
-            ? ("Jump to the current preview selection on this " + blockKindLabel + " in the raw editor (" + lineLabel + ").")
-            : "";
-          jumpBtn.setAttribute("aria-label", jumpBtn.title || "Jump");
-        }
       }
 
       function updatePreviewCommentBlocksForElement(targetEl) {
         if (!targetEl || typeof targetEl.querySelectorAll !== "function") return;
+        ensurePreviewSelectionActions(targetEl);
         const sourceText = String(sourceTextEl && sourceTextEl.value ? sourceTextEl.value : "");
         Array.from(targetEl.querySelectorAll(".preview-comment-block")).forEach((blockEl) => {
           updatePreviewCommentBlockState(blockEl, sourceText);
         });
+        updatePreviewSelectionActions(targetEl);
       }
 
       function decorateRenderedEditorPreviewComments(targetEl, sourceText) {
@@ -6522,43 +6600,20 @@
           wrapper.dataset.reviewNoteLineEnd = String(sourceBlock.lineEnd);
           wrapper.dataset.previewCommentKind = sourceBlock.kind;
 
-          const controls = document.createElement("div");
-          controls.className = "preview-comment-controls";
-
-          const summaryBtn = document.createElement("button");
-          summaryBtn.type = "button";
-          summaryBtn.className = "preview-comment-summary";
-          summaryBtn.hidden = true;
-          controls.appendChild(summaryBtn);
-
-          const addBtn = document.createElement("button");
-          addBtn.type = "button";
-          addBtn.className = "preview-comment-add";
-          addBtn.dataset.previewCommentAction = "comment";
-          addBtn.textContent = "Comment";
-          controls.appendChild(addBtn);
-
-          const jumpBtn = document.createElement("button");
-          jumpBtn.type = "button";
-          jumpBtn.className = "preview-comment-jump";
-          jumpBtn.dataset.previewCommentAction = "jump";
-          jumpBtn.textContent = "Jump";
-          controls.appendChild(jumpBtn);
-
           originalElement.replaceWith(wrapper);
-          wrapper.appendChild(controls);
           originalElement.classList.add("preview-comment-block-content");
           wrapper.appendChild(originalElement);
         }
 
+        ensurePreviewSelectionActions(targetEl);
         updatePreviewCommentBlocksForElement(targetEl);
       }
 
       function refreshRenderedEditorPreviewComments() {
-        if (sourcePreviewEl && !sourcePreviewEl.hidden) {
+        if (sourcePreviewEl) {
           updatePreviewCommentBlocksForElement(sourcePreviewEl);
         }
-        if (critiqueViewEl && rightView === "editor-preview") {
+        if (critiqueViewEl) {
           updatePreviewCommentBlocksForElement(critiqueViewEl);
         }
       }
@@ -6792,10 +6847,11 @@
       }
 
       function revealReviewNoteInPreview(note) {
-        if (!supportsPreviewCommentsForCurrentEditor()) return;
+        if (!supportsPreviewCommentsForCurrentEditor()) return false;
         if (rightView === "editor-preview" && critiqueViewEl && critiqueViewEl.isConnected) {
-          revealReviewNoteInPreviewElement(critiqueViewEl, note);
+          return revealReviewNoteInPreviewElement(critiqueViewEl, note);
         }
+        return false;
       }
 
       function updateActivePreviewCommentSelectionFromDom() {
@@ -6827,7 +6883,9 @@
 
         setActivePreviewCommentSelection({
           ...anchor,
+          paneId: getPreviewSelectionPaneIdForNode(startBlock),
           blockKey: getPreviewCommentBlockKey(startBlock),
+          previewCommentKind: String(startBlock.dataset && startBlock.dataset.previewCommentKind || "paragraph"),
         });
       }
 
@@ -6922,11 +6980,27 @@
           && typeof sourceTextEl.selectionEnd === "number"
           && sourceTextEl.selectionEnd > sourceTextEl.selectionStart
         );
+        const canJumpToPreview = Boolean(
+          hasSelection
+          && rightView === "editor-preview"
+          && critiqueViewEl
+          && supportsPreviewCommentsForCurrentEditor()
+        );
         editorSelectionCommentBtn.hidden = !hasSelection;
+        if (editorSelectionJumpBtn) {
+          editorSelectionJumpBtn.hidden = !canJumpToPreview;
+        }
+        if (editorSelectionActionsEl) {
+          editorSelectionActionsEl.hidden = !hasSelection;
+        }
         if (hasSelection) {
           editorSelectionCommentBtn.title = "Create a new local comment from the current editor selection.";
           editorSelectionCommentBtn.setAttribute("aria-label", editorSelectionCommentBtn.title);
         }
+        if (editorSelectionJumpBtn && canJumpToPreview) {
+          editorSelectionJumpBtn.title = "Jump to the current editor selection in the preview.";
+          editorSelectionJumpBtn.setAttribute("aria-label", editorSelectionJumpBtn.title);
+        }
       }
 
       function clearSuppressedEditorSelectionComment() {
@@ -7143,17 +7217,12 @@
         });
       }
 
-      function getActivePreviewSelectionAnchorForBlock(blockEl) {
-        if (!blockEl) return null;
-        const blockKey = getPreviewCommentBlockKey(blockEl);
-        return activePreviewCommentSelection && activePreviewCommentSelection.blockKey === blockKey
-          ? activePreviewCommentSelection
-          : null;
+      function getActivePreviewSelectionAnchorForPane(paneId) {
+        return getActivePreviewSelectionForPane(paneId);
       }
 
-      function addReviewNoteFromPreviewSelection(blockEl) {
-        if (!blockEl) return null;
-        const anchor = getActivePreviewSelectionAnchorForBlock(blockEl);
+      function addReviewNoteFromPreviewSelection(paneId) {
+        const anchor = getActivePreviewSelectionAnchorForPane(paneId);
         if (!anchor) {
           setStatus("Select some preview text within a single block first.", "warning");
           return null;
@@ -7189,6 +7258,12 @@
         if (editorSelectionCommentBtn) {
           editorSelectionCommentBtn.hidden = true;
         }
+        if (editorSelectionJumpBtn) {
+          editorSelectionJumpBtn.hidden = true;
+        }
+        if (editorSelectionActionsEl) {
+          editorSelectionActionsEl.hidden = true;
+        }
         const shouldOpenReviewNotes = !isReviewNotesOpen();
         pendingReviewNoteFocusId = note.id;
         setReviewNotes(reviewNotes.concat([note]));
@@ -7218,6 +7293,30 @@
         });
       }
 
+      function jumpToEditorSelectionInPreview() {
+        if (editorView !== "markdown") {
+          setStatus("Switch to Editor (Raw) before jumping from an editor selection.", "warning");
+          return false;
+        }
+        if (rightView !== "editor-preview" || !critiqueViewEl || !supportsPreviewCommentsForCurrentEditor()) {
+          setStatus("Open Editor (Preview) on the right to jump the current editor selection there.", "warning");
+          return false;
+        }
+        const anchor = getEditorAnchorForReviewNote();
+        const jumped = revealReviewNoteInPreview(anchor);
+        if (!jumped) {
+          setStatus("Could not find the current editor selection in the preview.", "warning");
+          return false;
+        }
+        const current = String(sourceTextEl.value || "");
+        const range = resolveReviewNoteRange(anchor, current);
+        if (range) {
+          scrollEditorRangeIntoView(range);
+        }
+        setStatus("Jumped to the current editor selection in the preview.", "success");
+        return true;
+      }
+
       function addReviewNoteFromEditorLine() {
         if (editorView !== "markdown") {
           setStatus("Switch to Editor (Raw) before adding a line comment.", "warning");
@@ -7260,23 +7359,32 @@
         return true;
       }
 
-      function jumpToPreviewSelection(blockEl) {
-        if (!blockEl) return false;
-        const anchor = getActivePreviewSelectionAnchorForBlock(blockEl);
+      function jumpToPreviewSelection(paneId) {
+        const anchor = getActivePreviewSelectionAnchorForPane(paneId);
         if (!anchor) {
           setStatus("Select some preview text within a single block first.", "warning");
           return false;
         }
-        const jumped = jumpToReviewAnchor(anchor, {
+        const previewNote = normalizeReviewNote(anchor);
+        const jumped = jumpToReviewAnchor(previewNote, {
           statusMessage: "Jumped to preview selection in the raw editor.",
+          afterJump: () => {
+            const paneEl = getPreviewSelectionPaneElement(paneId);
+            if (paneEl && previewNote) {
+              revealReviewNoteInPreviewElement(paneEl, previewNote);
+            }
+            const schedule = typeof window.requestAnimationFrame === "function"
+              ? window.requestAnimationFrame.bind(window)
+              : (cb) => window.setTimeout(cb, 16);
+            schedule(() => {
+              const selection = typeof window.getSelection === "function" ? window.getSelection() : null;
+              if (selection && typeof selection.removeAllRanges === "function") {
+                selection.removeAllRanges();
+              }
+              clearPreviewCommentSelection();
+            });
+          },
         });
-        if (jumped) {
-          const selection = typeof window.getSelection === "function" ? window.getSelection() : null;
-          if (selection && typeof selection.removeAllRanges === "function") {
-            selection.removeAllRanges();
-          }
-          clearPreviewCommentSelection();
-        }
         return jumped;
       }
 
@@ -9203,6 +9311,15 @@
         });
       }
 
+      if (editorSelectionJumpBtn) {
+        editorSelectionJumpBtn.addEventListener("mousedown", (event) => {
+          event.preventDefault();
+        });
+        editorSelectionJumpBtn.addEventListener("click", () => {
+          jumpToEditorSelectionInPreview();
+        });
+      }
+
       if (reviewNotesInlineAllBtn) {
         reviewNotesInlineAllBtn.addEventListener("click", () => {
           toggleAllReviewNotesInlineAnnotations();
@@ -9231,18 +9348,17 @@
         const target = event.target;
         const actionBtn = target instanceof Element ? target.closest(".preview-comment-add, .preview-comment-jump, .preview-comment-summary") : null;
         if (!actionBtn) return;
-        const blockEl = actionBtn.closest(".preview-comment-block");
-        if (!blockEl) return;
         event.preventDefault();
         event.stopPropagation();
         const mode = String(actionBtn.dataset && actionBtn.dataset.previewCommentMode ? actionBtn.dataset.previewCommentMode : "");
         if (!mode || !mode.startsWith("selection")) return;
+        const paneId = String(actionBtn.dataset && actionBtn.dataset.previewPane ? actionBtn.dataset.previewPane : "");
         const action = String(actionBtn.dataset && actionBtn.dataset.previewCommentAction ? actionBtn.dataset.previewCommentAction : "comment");
         if (action === "jump") {
-          jumpToPreviewSelection(blockEl);
+          jumpToPreviewSelection(paneId);
           return;
         }
-        addReviewNoteFromPreviewSelection(blockEl);
+        addReviewNoteFromPreviewSelection(paneId);
       }
 
       if (leftPaneEl) {

package/client/studio.css

@@ -661,11 +661,17 @@
       -webkit-text-fill-color: transparent;
     }
 
-    .editor-selection-comment-btn {
+    .editor-selection-actions {
       position: absolute;
       top: 12px;
       right: 12px;
       z-index: 4;
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+    }
+
+    .editor-selection-action-btn {
       min-height: 24px;
       border-radius: 999px;
       padding: 0 10px;
@@ -677,13 +683,22 @@
       box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
     }
 
-    .editor-selection-comment-btn:hover,
-    .editor-selection-comment-btn:focus-visible {
+    .editor-selection-action-btn:hover,
+    .editor-selection-action-btn:focus-visible {
       background: var(--accent-soft-strong);
       color: var(--accent);
       border-color: var(--accent);
     }
 
+    .editor-selection-actions[hidden],
+    .editor-selection-action-btn[hidden],
+    .preview-selection-actions[hidden],
+    .preview-comment-add[hidden],
+    .preview-comment-jump[hidden],
+    .preview-comment-summary[hidden] {
+      display: none !important;
+    }
+
     .hl-heading {
       color: var(--md-heading);
       font-weight: 700;
@@ -916,15 +931,16 @@
       overflow-wrap: inherit;
     }
 
-    .preview-comment-controls {
-      position: absolute;
-      top: 0;
-      right: 0;
+    .preview-selection-actions {
+      position: sticky;
+      top: 12px;
       z-index: 6;
-      display: inline-flex;
-      align-items: center;
+      height: 0;
+      display: flex;
+      justify-content: flex-end;
+      align-items: flex-start;
       gap: 8px;
-      transform: translateY(-0.46rem);
+      pointer-events: none;
     }
 
     .preview-comment-summary {
@@ -941,21 +957,11 @@
       padding: 0 10px;
       font-size: 12px;
       line-height: 1;
-      opacity: 0;
-      pointer-events: none;
-      transform: translateY(-2px);
-      transition: opacity 120ms ease, transform 120ms ease, color 120ms ease, border-color 120ms ease, background-color 120ms ease;
       background: var(--accent-soft);
       border-color: var(--accent);
       color: var(--accent);
       box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
-    }
-
-    .preview-comment-block.has-selection .preview-comment-add,
-    .preview-comment-block.has-selection .preview-comment-jump {
-      opacity: 1;
       pointer-events: auto;
-      transform: translateY(0);
     }
 
     .preview-comment-add:hover,

package/index.ts

@@ -6095,7 +6095,10 @@ ${cssVarsBlock}
               <div id="lineNumberMeasure" class="editor-line-number-measure" aria-hidden="true"></div>
               <pre id="sourceHighlight" class="editor-highlight" aria-hidden="true"></pre>
               <textarea id="sourceText" placeholder="Paste or edit text here.">${initialText}</textarea>
-              <button id="editorSelectionCommentBtn" type="button" class="editor-selection-comment-btn" hidden title="Create a new local comment from the current editor selection.">Comment</button>
+              <div id="editorSelectionActions" class="editor-selection-actions" hidden>
+                <button id="editorSelectionCommentBtn" type="button" class="editor-selection-action-btn" hidden title="Create a new local comment from the current editor selection.">Comment</button>
+                <button id="editorSelectionJumpBtn" type="button" class="editor-selection-action-btn" hidden title="Jump to the current editor selection in the preview.">Jump</button>
+              </div>
             </div>
             <div id="sourcePreview" class="panel-scroll rendered-markdown" hidden><pre class="plain-markdown"></pre></div>
           </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-studio",
-  "version": "0.5.50",
+  "version": "0.5.51",
   "description": "Two-pane browser workspace for pi with prompt/response editing, annotations, critiques, prompt/response history, and live Markdown/LaTeX/code preview",
   "type": "module",
   "license": "MIT",