@pi-unipi/footer 2.14.2 → 2.16.0

package/README.md

@@ -26,11 +26,9 @@ An experimental input surface, on by default and toggleable in `/unipi:footer-se
 | Command | Description |
 |---------|-------------|
 | `/unipi:footer` | Toggle footer on/off |
-| `/unipi:footer <preset>` | Switch preset (default, minimal, compact, full, nerd, ascii) |
-| `/unipi:footer sep:<style>` | Change separator style |
-| `/unipi:footer icon:<style>` | Change icon style (nerd, emoji, text) |
 | `/unipi:footer on` / `/unipi:footer off` | Enable/disable explicitly |
-| `/unipi:footer-settings` | Open settings TUI for per-group/per-segment toggles |
+| `/unipi:footer-settings` | Open settings TUI — preset, separator, icon style, glance mode, per-segment toggles |
+| `/unipi:footer-help` | Show footer segment guide |
 
 ## Special Triggers
 
@@ -120,7 +118,7 @@ Settings in `~/.pi/agent/settings.json` under `unipi.footer`:
 |-------|-------------|
 | `nerd` | Nerd Font glyphs (auto-detected) |
 | `emoji` | Unicode symbols (works on most terminals) |
-| `text` | Plain text abbreviations (works everywhere) |
+| `text` | Plain text labels (works everywhere). Glance frame drops the robot glyph: `UNIPI │ branch:main`, `workspace:unipi` |
 
 When `iconStyle` is not set, footer auto-detects Nerd Font support and defaults to `nerd` if available, `emoji` otherwise.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pi-unipi/footer",
-  "version": "2.14.2",
+  "version": "2.16.0",
   "description": "Persistent status bar for Unipi — subscribes to UNIPI_EVENTS and renders key stats from all unipi packages",
   "type": "module",
   "main": "index.ts",
@@ -32,8 +32,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@pi-unipi/core": "2.14.2",
-    "@pi-unipi/background-tasks": "2.14.2"
+    "@pi-unipi/core": "2.16.0",
+    "@pi-unipi/background-tasks": "2.16.0"
   },
   "peerDependencies": {
     "@earendil-works/pi-coding-agent": "^0.84.0",

package/src/glance-editor.ts

@@ -18,7 +18,8 @@ import { CustomEditor } from "@earendil-works/pi-coding-agent";
 import type { EditorOptions, EditorTheme, TUI } from "@earendil-works/pi-tui";
 import type { KeybindingsManager } from "@earendil-works/pi-coding-agent";
 import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
-import { getIcon } from "./rendering/icons.js";
+import { getIcon, getResolvedIconStyle } from "./rendering/icons.js";
+import { lolcatRainbow, paintLolcatGradient } from "./rendering/lolcat.js";
 
 /** Live status injected by the footer extension. */
 export interface GlanceStatus {
@@ -96,25 +97,35 @@ function fmtTokens(n: number): string {
 
 // ─── Lolcat rainbow gradient (classic sine algorithm, animated) ─────────
 //
-// red   = sin(freq·i + phase)       · 127 + 128
-// green = sin(freq·i + 2π/3 + phase) · 127 + 128
-// blue  = sin(freq·i + 4π/3 + phase) · 127 + 128
-// i = character position; phase advances with wall time so the gradient
-// drifts across the word (lolcat -a behavior). Rendered as truecolor SGR.
+// Rendered per glyph as truecolor SGR — see rendering/lolcat.ts (issue #34:
+// painting iterates code points so emoji surrogate pairs survive).
 
-const LOLCAT_FREQ = 0.9; // radians per char — short word → tight sweep
-
-function lolcatRainbow(text: string, phase: number): string {
-	return text
-		.split("")
-		.map((ch, i) => {
-			const t = LOLCAT_FREQ * i + phase;
-			const r = Math.round(Math.sin(t) * 127 + 128);
-			const g = Math.round(Math.sin(t + (2 * Math.PI) / 3) * 127 + 128);
-			const b = Math.round(Math.sin(t + (4 * Math.PI) / 3) * 127 + 128);
-			return `\x1b[38;2;${r};${g};${b}m${ch}`;
-		})
-		.join("") + "\x1b[39m";
+/**
+ * Compose the glance frame titles for the active icon style.
+ *
+ * - emoji/nerd: glyph prefix before brand, branch and workspace.
+ * - text: no robot glyph (brand word only); literal labels —
+ *   `branch:main` on the top title, `workspace:unipi` bottom-left.
+ */
+export function composeGlanceTitles(
+	brand: string,
+	branch: string | null,
+	workspace: string,
+): { titleParts: string[]; leftTitle: string } {
+	const titleParts: string[] = [];
+	if (getResolvedIconStyle() === "text") {
+		titleParts.push(brand);
+		if (branch) titleParts.push(`branch:${branch}`);
+		return { titleParts, leftTitle: ` workspace:${workspace} ` };
+	}
+	const brandIcon = getIcon("model");
+	titleParts.push(`${brandIcon ? brandIcon + " " : ""}${brand}`);
+	if (branch) {
+		const gitIcon = getIcon("git");
+		titleParts.push(`${gitIcon ? gitIcon + " " : ""}${branch}`);
+	}
+	const dirIcon = getIcon("directory");
+	return { titleParts, leftTitle: ` ${dirIcon ? dirIcon + " " : ""}${workspace} ` };
 }
 
 export class GlanceEditor extends CustomEditor {
@@ -133,44 +144,11 @@ export class GlanceEditor extends CustomEditor {
 
 	/**
 	 * Apply a flowing lolcat gradient to an already-composed frame line.
-	 * Printable characters get per-position truecolor from the sine palette;
-	 * existing SGR sequences pass through untouched (they mostly come from
-		 * the brand itself, which already carries its own colors).
+	 * Kept as a protected hook for subclasses; painting itself lives in
+	 * rendering/lolcat.ts (code-point-safe — issue #34).
 	 */
 	protected paintLolcatLine(line: string, phaseBase: number): string {
-		let out = "";
-		let pos = 0;
-		let i = 0;
-		while (i < line.length) {
-			const ch = line[i];
-			if (ch === "\x1b") {
-				const rest = line.slice(i);
-				// Copy the whole escape sequence verbatim.
-				const m = /^\x1b\[[0-?]*[ -/]*[@-~]/.exec(line.slice(i));
-				if (m) {
-					out += m[0];
-					i += m[0].length;
-					continue;
-				}
-				// Zero-width string sequences: OSC 133 zone markers (\x1b]133;A
-				// BEL) and the APC CURSOR_MARKER (\x1b_pi:c BEL). Painting their
-				// bytes is what produced the "_pi:c" garbage in rainbow mode.
-				const strSeq = /^\x1b[\]_][^\x07]*(?:\x07|\x1b\\)/.exec(rest);
-				if (strSeq) {
-					out += strSeq[0];
-					i += strSeq[0].length;
-					continue;
-				}
-			}
-			const t = LOLCAT_FREQ * 0.35 * pos + phaseBase;
-			const r = Math.round(Math.sin(t) * 127 + 128);
-			const g = Math.round(Math.sin(t + (2 * Math.PI) / 3) * 127 + 128);
-			const b = Math.round(Math.sin(t + (4 * Math.PI) / 3) * 127 + 128);
-			out += `\u001b[38;2;${r};${g};${b}m${ch}`;
-			pos++;
-			i++;
-		}
-		return out + "\u001b[39m";
+		return paintLolcatGradient(line, phaseBase);
 	}
 
 	private static isThinkingHot(level: string | null | undefined): boolean {
@@ -211,14 +189,7 @@ export class GlanceEditor extends CustomEditor {
 		// Brand rendered as an animated lolcat gradient (phase from wall time;
 		// the footer's 1s refresh timer re-renders, so it shimmers each tick).
 		const brand = lolcatRainbow("UNIPI", Date.now() / 1000);
-		const brandIcon = getIcon("model");
-		const titleParts = [
-			`${brandIcon ? brandIcon + " " : ""}${brand}`,
-		];
-		if (st.branch) {
-			const gitIcon = getIcon("git");
-			titleParts.push(`${gitIcon ? gitIcon + " " : ""}${st.branch}`);
-		}
+		const { titleParts, leftTitle } = composeGlanceTitles(brand, st.branch, st.workspace);
 		const title = titleParts.join(SEP);
 		const leadRule = `${BORDER.horizontal} `;
 		const titleText = ` ${title}${SEP}`;
@@ -249,9 +220,7 @@ export class GlanceEditor extends CustomEditor {
 		if (st.thinkingLevel && st.thinkingLevel !== "off") {
 			rightParts.push(`thinking:${st.thinkingLevel}`);
 		}
-		// Workspace gets the folder nerd icon.
-		const dirIcon = getIcon("directory");
-		const leftTitle = ` ${dirIcon ? dirIcon + " " : ""}${st.workspace} `;
+		// Workspace label per icon style (glyph prefix, or workspace: in text mode).
 		let cluster = rightParts.join(SEP);
 
 		// Shrink policy for narrow terminals: thinking first, then model tail.

package/src/rendering/icons.ts

@@ -314,6 +314,11 @@ export function resolveIconStyle(configured?: string): "nerd" | "emoji" | "text"
   return detectNerdFontSupport() ? "nerd" : "emoji";
 }
 
+/** Effective icon style in use — the current setting, or auto-detection. */
+export function getResolvedIconStyle(): "nerd" | "emoji" | "text" {
+  return currentIconStyle ?? resolveIconStyle();
+}
+
 /**
  * Get the icon for a segment by ID.
  * Uses the configured icon style, falling back to auto-detection.

package/src/rendering/lolcat.ts

@@ -0,0 +1,84 @@
+/**
+ * @pi-unipi/footer — Lolcat rainbow gradient painting
+ *
+ * Classic sine algorithm (lolcat -a): red/green/blue chase each other by
+ * 2π/3 across character position; phase advances with wall time so the 1s
+ * footer refresh ticks drive visible motion.
+ *
+ * Issue #34: painting must NEVER split a glyph. Emoji (🤖 U+1F916, 🔀
+ * U+1F500) are surrogate pairs — indexing the string per UTF-16 code unit
+ * let the rainbow renderer insert an SGR between the two halves, which
+ * terminals render as replacement characters. Painting therefore advances
+ * per code point (with emoji variation selectors kept attached) and copies
+ * ANSI/OSC/APC escape sequences verbatim.
+ */
+
+/** Radians per char — short words → tight sweep. */
+const LOLCAT_FREQ = 0.9;
+
+const ANSI_CSI_RE = /^\x1b\[[0-?]*[ -/]*[@-~]/;
+const ANSI_STRING_RE = /^\x1b[\]_][^\x07]*(?:\x07|\x1b\\)/;
+const VARIATION_SELECTOR_16 = 0xfe0f;
+
+/** UTF-16 length of the glyph starting at `i`: full code point, plus a
+ * trailing VS16 (⬇️ = U+2B07 U+FE0F) so the SGR emitted after the glyph
+ * can never detach emoji presentation from its base character. */
+function glyphLength(line: string, i: number): number {
+	const cp = line.codePointAt(i)!;
+	let len = cp > 0xffff ? 2 : 1;
+	if (line.codePointAt(i + len) === VARIATION_SELECTOR_16) len += 1;
+	return len;
+}
+
+function sineColor(t: number, offset: number): number {
+	return Math.round(Math.sin(t + offset) * 127 + 128);
+}
+
+/** Per-character rainbow — used for the UNIPI brand word (ASCII only). */
+export function lolcatRainbow(text: string, phase: number): string {
+	return text
+		.split("")
+		.map((ch, i) => {
+			const t = LOLCAT_FREQ * i + phase;
+			return `\x1b[38;2;${sineColor(t, 0)};${sineColor(t, (2 * Math.PI) / 3)};${sineColor(t, (4 * Math.PI) / 3)}m${ch}`;
+		})
+		.join("") + "\x1b[39m";
+}
+
+/**
+ * Apply a flowing lolcat gradient to an already-composed frame line.
+ * Printable glyphs get per-position truecolor from the sine palette;
+ * existing escape sequences pass through untouched (they mostly come from
+ * the brand itself, which already carries its own colors).
+ */
+export function paintLolcatGradient(line: string, phaseBase: number): string {
+	let out = "";
+	let pos = 0;
+	let i = 0;
+	while (i < line.length) {
+		if (line[i] === "\x1b") {
+			// Copy escape sequences verbatim: CSI SGR, OSC 133 zone markers
+			// (\x1b]133;A BEL) and the APC CURSOR_MARKER (\x1b_pi:c BEL).
+			// Painting their bytes produced "_pi:c" garbage in rainbow mode.
+			const csi = ANSI_CSI_RE.exec(line.slice(i));
+			if (csi) {
+				out += csi[0];
+				i += csi[0].length;
+				continue;
+			}
+			const strSeq = ANSI_STRING_RE.exec(line.slice(i));
+			if (strSeq) {
+				out += strSeq[0];
+				i += strSeq[0].length;
+				continue;
+			}
+		}
+		const len = glyphLength(line, i);
+		const glyph = line.slice(i, i + len); // whole code point — never split a surrogate pair
+		const t = LOLCAT_FREQ * 0.35 * pos + phaseBase;
+		out += `\u001b[38;2;${sineColor(t, 0)};${sineColor(t, (2 * Math.PI) / 3)};${sineColor(t, (4 * Math.PI) / 3)}m${glyph}`;
+		pos++;
+		i += len;
+	}
+	return out + "\u001b[39m";
+}

package/src/tui/settings-tui.ts

@@ -244,7 +244,7 @@ class FooterSettingsOverlay {
       {
         id: "iconStyle",
         label: "Icon Style",
-        description: "Icon glyph set (nerd requires Nerd Font)",
+        description: "emoji · nerd (Nerd Font) · text (glance: branch:x, workspace:y)",
         currentValue: this.settings.iconStyle,
         values: ICON_STYLES,
       },