pi-studio 0.5.4 → 0.5.5

package/CHANGELOG.md

@@ -88,6 +88,15 @@ All notable changes to `pi-studio` are documented here.
 
 ## [Unreleased]
 
+## [0.5.5] — 2026-03-09
+
+### Fixed
+- Improved raw-editor caret/overlay alignment in Syntax highlight mode:
+  - width-neutral annotation highlight styling
+  - more textarea-like wrap behavior in the highlight overlay
+  - preserved empty trailing lines in highlighted output so end-of-file blank lines stay aligned
+  - reduced raw overlay metric drift for comment/quote styling
+
 ## [0.5.4] — 2026-03-09
 
 ### Added

package/index.ts

@@ -2165,6 +2165,7 @@ ${cssVarsBlock}
       border-radius: 8px;
       background: var(--editor-bg);
       overflow: hidden;
+      overscroll-behavior: none;
     }
 
     .editor-highlight {
@@ -2177,7 +2178,9 @@ ${cssVarsBlock}
       overflow: auto;
       pointer-events: none;
       white-space: pre-wrap;
-      word-break: break-word;
+      word-break: normal;
+      overflow-wrap: break-word;
+      overscroll-behavior: none;
       font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
       font-size: 13px;
       line-height: 1.45;
@@ -2197,6 +2200,7 @@ ${cssVarsBlock}
       background: transparent;
       resize: none;
       outline: none;
+      overscroll-behavior: none;
     }
 
     #sourceText.highlight-active {
@@ -2240,7 +2244,7 @@ ${cssVarsBlock}
 
     .hl-code-com {
       color: var(--syntax-comment);
-      font-style: italic;
+      font-style: normal;
     }
 
     .hl-code-var,
@@ -2269,7 +2273,7 @@ ${cssVarsBlock}
 
     .hl-quote {
       color: var(--md-quote);
-      font-style: italic;
+      font-style: normal;
     }
 
     .hl-link {
@@ -2284,9 +2288,10 @@ ${cssVarsBlock}
     .hl-annotation {
       color: var(--accent);
       background: var(--accent-soft);
-      border: 1px solid var(--marker-border);
+      border: 0;
       border-radius: 4px;
-      padding: 0 3px;
+      padding: 0;
+      box-shadow: inset 0 0 0 1px var(--marker-border);
     }
 
     .hl-annotation-muted {
@@ -3177,6 +3182,7 @@ ${cssVarsBlock}
       let editorHighlightRenderRaf = null;
       let annotationsEnabled = true;
       const ANNOTATION_MARKER_REGEX = /\\[an:\\s*([^\\]\\n]+?)\\]/gi;
+      const EMPTY_OVERLAY_LINE = "\\u200b";
       const MERMAID_CDN_URL = "https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs";
       const MERMAID_CONFIG = ${JSON.stringify(mermaidConfig)};
       const MERMAID_UNAVAILABLE_MESSAGE = "Mermaid renderer unavailable. Showing mermaid blocks as code.";
@@ -5073,7 +5079,12 @@ ${cssVarsBlock}
           }
 
           if (inFence) {
-            out.push(line.length > 0 ? highlightCodeLine(line, fenceLanguage) : "");
+            out.push(line.length > 0 ? highlightCodeLine(line, fenceLanguage) : EMPTY_OVERLAY_LINE);
+            continue;
+          }
+
+          if (line.length === 0) {
+            out.push(EMPTY_OVERLAY_LINE);
             continue;
           }
 
@@ -5112,7 +5123,7 @@ ${cssVarsBlock}
         const out = [];
         for (const line of lines) {
           if (line.length === 0) {
-            out.push("");
+            out.push(EMPTY_OVERLAY_LINE);
           } else if (lang) {
             out.push(highlightCodeLine(line, lang));
           } else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-studio",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Browser GUI for structured critique workflows in pi",
   "type": "module",
   "license": "MIT",