pi-studio 0.9.29 → 0.9.30

package/CHANGELOG.md

@@ -4,6 +4,11 @@ All notable changes to `pi-studio` are documented here.
 
 ## [Unreleased]
 
+## [0.9.30] — 2026-06-09
+
+### Fixed
+- Rendered inline strikethrough, emphasis, and code inside `[an: ...]` annotation badges consistently across Studio preview and HTML/PDF export paths.
+
 ## [0.9.29] — 2026-06-09
 
 ### Added

package/client/studio-annotation-helpers.js

@@ -443,6 +443,13 @@
     let index = 0;
 
     while (index < source.length) {
+      const strikeMatch = readAnnotationEmphasisSpanAt(source, index, "~~", "s");
+      if (strikeMatch) {
+        out += strikeMatch.html;
+        index = strikeMatch.end;
+        continue;
+      }
+
       const strongMatch = readAnnotationEmphasisSpanAt(source, index, "**", "strong")
         || readAnnotationEmphasisSpanAt(source, index, "__", "strong");
       if (strongMatch) {

package/index.ts

@@ -30,6 +30,7 @@ import {
 import { escapeStudioPdfLatexTextFragment } from "./shared/studio-pdf-escape.js";
 import { resolveStudioPdfResourceFile } from "./shared/studio-pdf-resource.js";
 import { buildStudioForwardingHint, buildStudioSshTunnelHint, isStudioSshSession as isSshSession } from "./shared/studio-ssh-hint.js";
+import { renderStudioAnnotationInlineHtml } from "./shared/studio-annotation-render.js";
 
 type Lens = "writing" | "code";
 type RequestedLens = Lens | "auto";
@@ -1086,6 +1087,7 @@ function buildStudioPdfPreamble(options?: StudioPdfRenderOptions, extraPreamble
 \\titlespacing*{\\subparagraph}{0pt}{0.7ex plus 0.2ex minus 0.1ex}{0.7em}
 \\usepackage{xcolor}
 \\usepackage{varwidth}
+\\usepackage[normalem]{ulem}
 \\definecolor{StudioAnnotationBg}{HTML}{EAF3FF}
 \\definecolor{StudioAnnotationBorder}{HTML}{8CB8FF}
 \\definecolor{StudioAnnotationText}{HTML}{1F5FBF}
@@ -5031,6 +5033,13 @@ function renderStudioAnnotationPlainTextPdfLatex(text: string): string {
 	let index = 0;
 
 	while (index < source.length) {
+		const strikeMatch = readStudioAnnotationPdfEmphasisSpanAt(source, index, "~~", "sout");
+		if (strikeMatch) {
+			out += strikeMatch.latex;
+			index = strikeMatch.end;
+			continue;
+		}
+
 		const strongMatch = readStudioAnnotationPdfEmphasisSpanAt(source, index, "**", "textbf")
 			?? readStudioAnnotationPdfEmphasisSpanAt(source, index, "__", "textbf");
 		if (strongMatch) {
@@ -5648,13 +5657,14 @@ function prepareStudioPdfMarkdown(markdown: string, isLatex?: boolean, editorLan
 		? wrapStudioCodeAsMarkdown(input, effectiveEditorLanguage)
 		: input;
 	const fenceNormalizedSource = effectiveEditorLanguage === "latex" ? source : normalizeStudioMarkdownSmartFences(source);
-	const annotationReadySource = !effectiveEditorLanguage || effectiveEditorLanguage === "markdown" || effectiveEditorLanguage === "latex"
-		? replaceStudioAnnotationMarkersForPdf(fenceNormalizedSource)
-		: fenceNormalizedSource;
-	const commentStrippedSource = stripStudioMarkdownHtmlCommentsPreservingYamlFrontMatter(annotationReadySource);
-	return prepareStudioMarkdownForPandoc(commentStrippedSource, {
-		preserveLiteralLatexCommands: !hasStudioYamlHeaderIncludes(annotationReadySource),
+	const annotationReadyLanguage = !effectiveEditorLanguage || effectiveEditorLanguage === "markdown" || effectiveEditorLanguage === "latex";
+	const commentStrippedSource = stripStudioMarkdownHtmlCommentsPreservingYamlFrontMatter(fenceNormalizedSource);
+	const pandocReadySource = prepareStudioMarkdownForPandoc(commentStrippedSource, {
+		preserveLiteralLatexCommands: !hasStudioYamlHeaderIncludes(fenceNormalizedSource),
 	});
+	return annotationReadyLanguage
+		? replaceStudioAnnotationMarkersForPdf(pandocReadySource)
+		: pandocReadySource;
 }
 
 function stripMathMlAnnotationTags(html: string): string {
@@ -6118,7 +6128,7 @@ function applyStudioAnnotationPlaceholdersToHtml(html: string, placeholders: Stu
 	let transformed = String(html ?? "");
 	for (const placeholder of placeholders) {
 		const tokenPattern = new RegExp(escapeStudioRegExpLiteral(placeholder.token), "g");
-		const markerHtml = `<span class="annotation-preview-marker" title="${escapeStudioHtmlText(placeholder.title)}">${escapeStudioHtmlText(placeholder.text)}</span>`;
+		const markerHtml = `<span class="annotation-preview-marker" title="${escapeStudioHtmlText(placeholder.title)}">${renderStudioAnnotationInlineHtml(placeholder.text)}</span>`;
 		transformed = transformed.replace(tokenPattern, markerHtml);
 	}
 	return transformed;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-studio",
-  "version": "0.9.29",
+  "version": "0.9.30",
   "description": "Two-pane browser workspace for pi with prompt/response editing, annotations, critiques, active quiz, prompt/response history, live previews, and tmux-backed REPL/literate REPL workflows",
   "type": "module",
   "license": "MIT",

package/shared/studio-annotation-render.js

@@ -0,0 +1,148 @@
+import {
+  advancePastStudioInlineBacktickSpan,
+  isStudioAnnotationWordChar,
+  normalizeStudioAnnotationText,
+  readStudioAnnotationProtectedTokenAt,
+} from "./studio-annotation-scanner.js";
+
+function escapeHtml(text) {
+  return String(text ?? "")
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/\"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
+function canOpenAnnotationInlineDelimiter(source, startIndex, delimiter) {
+  const text = String(source || "");
+  if (text.slice(startIndex, startIndex + delimiter.length) !== delimiter) return false;
+  const prev = startIndex > 0 ? text[startIndex - 1] : "";
+  const next = text[startIndex + delimiter.length] || "";
+  if (!next || /\s/.test(next)) return false;
+  return !isStudioAnnotationWordChar(prev);
+}
+
+function canCloseAnnotationInlineDelimiter(source, startIndex, delimiter) {
+  const text = String(source || "");
+  if (text.slice(startIndex, startIndex + delimiter.length) !== delimiter) return false;
+  const prev = startIndex > 0 ? text[startIndex - 1] : "";
+  const next = text[startIndex + delimiter.length] || "";
+  if (!prev || /\s/.test(prev)) return false;
+  return !isStudioAnnotationWordChar(next);
+}
+
+function readAnnotationInlineSpanAt(source, startIndex, delimiter, tagName) {
+  const text = String(source || "");
+  if (!canOpenAnnotationInlineDelimiter(text, startIndex, delimiter)) return null;
+
+  let index = startIndex + delimiter.length;
+  while (index < text.length) {
+    if (text[index] === "\\") {
+      index = Math.min(text.length, index + 2);
+      continue;
+    }
+
+    const protectedToken = readStudioAnnotationProtectedTokenAt(text, index);
+    if (protectedToken) {
+      index = protectedToken.end;
+      continue;
+    }
+
+    if (canCloseAnnotationInlineDelimiter(text, index, delimiter)) {
+      const inner = text.slice(startIndex + delimiter.length, index);
+      return {
+        end: index + delimiter.length,
+        html: `<${tagName}>${renderAnnotationPlainInlineHtml(inner)}</${tagName}>`,
+      };
+    }
+
+    index += 1;
+  }
+
+  return null;
+}
+
+function renderAnnotationCodeSpanHtml(rawToken) {
+  const raw = String(rawToken || "");
+  if (!raw || raw[0] !== "`") return escapeHtml(raw);
+
+  let fenceLength = 1;
+  while (raw[fenceLength] === "`") fenceLength += 1;
+  const fence = "`".repeat(fenceLength);
+  if (raw.length < fenceLength * 2 || raw.slice(raw.length - fenceLength) !== fence) {
+    return escapeHtml(raw);
+  }
+
+  return `<code>${escapeHtml(raw.slice(fenceLength, raw.length - fenceLength))}</code>`;
+}
+
+function renderAnnotationPlainInlineHtml(text) {
+  const source = String(text || "");
+  let out = "";
+  let index = 0;
+
+  while (index < source.length) {
+    const strikeMatch = readAnnotationInlineSpanAt(source, index, "~~", "s");
+    if (strikeMatch) {
+      out += strikeMatch.html;
+      index = strikeMatch.end;
+      continue;
+    }
+
+    const strongMatch = readAnnotationInlineSpanAt(source, index, "**", "strong")
+      || readAnnotationInlineSpanAt(source, index, "__", "strong");
+    if (strongMatch) {
+      out += strongMatch.html;
+      index = strongMatch.end;
+      continue;
+    }
+
+    const emphasisMatch = readAnnotationInlineSpanAt(source, index, "*", "em")
+      || readAnnotationInlineSpanAt(source, index, "_", "em");
+    if (emphasisMatch) {
+      out += emphasisMatch.html;
+      index = emphasisMatch.end;
+      continue;
+    }
+
+    out += escapeHtml(source[index]);
+    index += 1;
+  }
+
+  return out;
+}
+
+export function renderStudioAnnotationInlineHtml(text) {
+  const source = normalizeStudioAnnotationText(text);
+  let out = "";
+  let plainStart = 0;
+  let index = 0;
+
+  while (index < source.length) {
+    const token = readStudioAnnotationProtectedTokenAt(source, index);
+    if (!token) {
+      index += 1;
+      continue;
+    }
+
+    if (index > plainStart) {
+      out += renderAnnotationPlainInlineHtml(source.slice(plainStart, index));
+    }
+
+    if (token.type === "code") {
+      out += renderAnnotationCodeSpanHtml(token.raw);
+    } else {
+      out += escapeHtml(token.raw);
+    }
+
+    index = token.end;
+    plainStart = index;
+  }
+
+  if (plainStart < source.length) {
+    out += renderAnnotationPlainInlineHtml(source.slice(plainStart));
+  }
+
+  return out;
+}