pi-one-ui 0.1.1

package/extensions/shell/user-message-osc.ts

@@ -0,0 +1,279 @@
+const ESC = "\x1b";
+const BEL = "\x07";
+const C1_DCS = "\x90";
+const C1_SOS = "\x98";
+const C1_CSI = "\x9b";
+const C1_ST = "\x9c";
+const C1_OSC = "\x9d";
+const C1_PM = "\x9e";
+const C1_APC = "\x9f";
+const CAN = 0x18;
+const SUB = 0x1a;
+
+type ControlBoundary =
+  | {
+      kind: "terminator";
+      index: number;
+      length: number;
+      safeOsc8Terminator: boolean;
+    }
+  | { kind: "start"; index: number };
+
+type FilterOptions = {
+  preserveValidOsc8: boolean;
+  preserveSourceWhitespace: boolean;
+  preserveSgr: boolean;
+};
+
+type FilterResult = {
+  text: string;
+  balancedOsc8: boolean;
+};
+
+function anyOscStartLength(text: string, index: number): number {
+  if (text[index] === C1_OSC) return 1;
+  return text[index] === ESC && text[index + 1] === "]" ? 2 : 0;
+}
+
+function findOscBoundary(
+  text: string,
+  payloadStart: number,
+): ControlBoundary | undefined {
+  for (let index = payloadStart; index < text.length; index += 1) {
+    if (anyOscStartLength(text, index) > 0) return { kind: "start", index };
+    if (text[index] === BEL) {
+      return { kind: "terminator", index, length: 1, safeOsc8Terminator: true };
+    }
+    if (text[index] === C1_ST) {
+      return {
+        kind: "terminator",
+        index,
+        length: 1,
+        safeOsc8Terminator: false,
+      };
+    }
+    if (text[index] === ESC && text[index + 1] === "\\") {
+      return { kind: "terminator", index, length: 2, safeOsc8Terminator: true };
+    }
+  }
+  return undefined;
+}
+
+const terminalControlPattern = /[\u0000-\u001f\u007f-\u009f]/;
+const safeParameterKeyPattern = /^[A-Za-z0-9_.-]+$/;
+
+export function isValidUserMessageOsc8Payload(payload: string): boolean {
+  if (!payload.startsWith("8;")) return false;
+  const uriSeparator = payload.indexOf(";", 2);
+  if (uriSeparator < 0) return false;
+
+  const params = payload.slice(2, uriSeparator);
+  const uri = payload.slice(uriSeparator + 1);
+  if (params === "" && uri === "") return true;
+  if (uri === "" || /\s/.test(uri) || terminalControlPattern.test(uri))
+    return false;
+  if (params === "") return true;
+
+  return params.split(":").every((entry) => {
+    const equals = entry.indexOf("=");
+    if (equals <= 0) return false;
+    const key = entry.slice(0, equals);
+    const value = entry.slice(equals + 1);
+    return (
+      safeParameterKeyPattern.test(key) &&
+      !terminalControlPattern.test(key) &&
+      !terminalControlPattern.test(value)
+    );
+  });
+}
+
+function incompleteOsc133PrefixLength(payload: string): number {
+  if (payload.length > 0 && "133".startsWith(payload)) return payload.length;
+  if (!payload.startsWith("133;")) return 0;
+
+  let length = 4;
+  if (/^[A-D]$/.test(payload[length] ?? "")) length += 1;
+  if (payload[length] === ";") length += 1;
+  return length;
+}
+
+function consumeCsi(value: string, start: number): number {
+  for (let index = start; index < value.length; index += 1) {
+    const code = value.charCodeAt(index);
+    if (code === CAN || code === SUB) return index + 1;
+    if (code >= 0x40 && code <= 0x7e) return index + 1;
+  }
+  return value.length;
+}
+
+function consumeControlString(
+  value: string,
+  start: number,
+  allowBel: boolean,
+): number {
+  for (let index = start; index < value.length; index += 1) {
+    const code = value.charCodeAt(index);
+    if (code === CAN || code === SUB) return index + 1;
+    if (allowBel && code === BEL.charCodeAt(0)) return index + 1;
+    if (code === C1_ST.charCodeAt(0)) return index + 1;
+    if (code === ESC.charCodeAt(0) && value[index + 1] === "\\")
+      return index + 2;
+  }
+  return value.length;
+}
+
+function consumeEscape(value: string, start: number): number {
+  if (start + 1 >= value.length) return value.length;
+  const next = value[start + 1];
+  if (next === "[") return consumeCsi(value, start + 2);
+  if (next === "P" || next === "X" || next === "^" || next === "_") {
+    return consumeControlString(value, start + 2, false);
+  }
+
+  let index = start + 1;
+  while (index < value.length) {
+    const code = value.charCodeAt(index);
+    if (code >= 0x20 && code <= 0x2f) {
+      index += 1;
+      continue;
+    }
+    return code >= 0x30 && code <= 0x7e ? index + 1 : index;
+  }
+  return value.length;
+}
+
+function isSafeSgr(sequence: string): boolean {
+  return /^\x1b\[[0-9:;]*m$/.test(sequence);
+}
+
+function isOsc8Close(payload: string): boolean {
+  return payload === "8;;";
+}
+
+function updateOsc8Balance(
+  payload: string,
+  state: { open: boolean; invalid: boolean },
+): void {
+  if (isOsc8Close(payload)) {
+    if (!state.open) state.invalid = true;
+    state.open = false;
+    return;
+  }
+  if (state.open) state.invalid = true;
+  state.open = true;
+}
+
+function filterUserMessageTerminalText(
+  text: string,
+  options: FilterOptions,
+): FilterResult {
+  let output = "";
+  let index = 0;
+  const osc8 = { open: false, invalid: false };
+  while (index < text.length) {
+    const oscStartLength = anyOscStartLength(text, index);
+    if (oscStartLength > 0) {
+      const payloadStart = index + oscStartLength;
+      const boundary = findOscBoundary(text, payloadStart);
+      if (boundary?.kind === "terminator") {
+        const end = boundary.index + boundary.length;
+        const payload = text.slice(payloadStart, boundary.index);
+        if (
+          options.preserveValidOsc8 &&
+          oscStartLength === 2 &&
+          boundary.safeOsc8Terminator &&
+          isValidUserMessageOsc8Payload(payload)
+        ) {
+          updateOsc8Balance(payload, osc8);
+          output += text.slice(index, end);
+        }
+        index = end;
+        continue;
+      }
+
+      // Removing an unterminated introducer prevents it from consuming
+      // Zentui's prompt markers. Preserve visible trailing payload, except
+      // for a recognized partial OSC 133 command prefix.
+      const payloadEnd = boundary?.index ?? text.length;
+      const payload = text.slice(payloadStart, payloadEnd);
+      index = payloadStart + incompleteOsc133PrefixLength(payload);
+      continue;
+    }
+
+    const code = text.charCodeAt(index);
+    if (code === ESC.charCodeAt(0)) {
+      if (text[index + 1] === "[") {
+        const end = consumeCsi(text, index + 2);
+        const sequence = text.slice(index, end);
+        if (options.preserveSgr && isSafeSgr(sequence)) output += sequence;
+        index = end;
+        continue;
+      }
+      index = consumeEscape(text, index);
+      continue;
+    }
+    if (text[index] === C1_CSI) {
+      index = consumeCsi(text, index + 1);
+      continue;
+    }
+    if (
+      text[index] === C1_DCS ||
+      text[index] === C1_SOS ||
+      text[index] === C1_PM ||
+      text[index] === C1_APC
+    ) {
+      index = consumeControlString(text, index + 1, false);
+      continue;
+    }
+    if (code === 0x09 || code === 0x0a) {
+      if (options.preserveSourceWhitespace) output += text[index];
+      index += 1;
+      continue;
+    }
+    if (code < 0x20 || (code >= 0x7f && code <= 0x9f)) {
+      index += 1;
+      continue;
+    }
+    output += text[index];
+    index += 1;
+  }
+  return { text: output, balancedOsc8: !osc8.open && !osc8.invalid };
+}
+
+function filterBalancedUserMessageTerminalText(
+  text: string,
+  options: FilterOptions,
+): string {
+  const filtered = filterUserMessageTerminalText(text, options);
+  if (!options.preserveValidOsc8 || filtered.balancedOsc8) return filtered.text;
+  return filterUserMessageTerminalText(text, {
+    ...options,
+    preserveValidOsc8: false,
+  }).text;
+}
+
+/** Strip every terminal control from untrusted source text before Markdown rendering. */
+export function sanitizeUserMessageSourceText(text: string): string {
+  return filterBalancedUserMessageTerminalText(text, {
+    preserveValidOsc8: false,
+    preserveSourceWhitespace: true,
+    preserveSgr: false,
+  });
+}
+
+/**
+ * Sanitize a predecessor-rendered row. Pi formatting needs only SGR and
+ * structurally valid 7-bit OSC 8; every other terminal control is removed.
+ */
+export function sanitizeRenderedUserMessageText(text: string): string {
+  return filterBalancedUserMessageTerminalText(text, {
+    preserveValidOsc8: true,
+    preserveSourceWhitespace: true,
+    preserveSgr: true,
+  });
+}
+
+/** Sanitize one predecessor output stream while retaining its row boundaries. */
+export function sanitizeRenderedUserMessageLines(lines: string[]): string[] {
+  return sanitizeRenderedUserMessageText(lines.join("\n")).split("\n");
+}

package/extensions/shell/user-message-styles.ts

@@ -0,0 +1,266 @@
+import type { Theme, ThemeColor } from "@earendil-works/pi-coding-agent";
+import {
+  Markdown,
+  type MarkdownTheme,
+  truncateToWidth,
+  visibleWidth,
+} from "@earendil-works/pi-tui";
+import type { ZentuiConfig } from "../app/config/shell.ts";
+import {
+  EDITOR_ACCENT_FALLBACK,
+  EDITOR_BORDER_FALLBACK,
+  renderStyleForSourceOrFallbackStrict,
+} from "./style.ts";
+import { sanitizeUserMessageSourceText } from "./user-message-osc.ts";
+
+export type UserMessageStyleRenderInput = {
+  text: string;
+  width: number;
+  theme?: Theme;
+  config: ZentuiConfig;
+};
+
+function themeFg(
+  theme: Theme | undefined,
+  color: ThemeColor,
+  text: string,
+): string {
+  return theme ? theme.fg(color, text) : text;
+}
+
+function makeMarkdownTheme(theme: Theme | undefined): MarkdownTheme {
+  return {
+    heading: (text) => themeFg(theme, "mdHeading", text),
+    link: (text) => themeFg(theme, "mdLink", text),
+    linkUrl: (text) => themeFg(theme, "mdLinkUrl", text),
+    code: (text) => themeFg(theme, "mdCode", text),
+    codeBlock: (text) => themeFg(theme, "mdCodeBlock", text),
+    codeBlockBorder: (text) => themeFg(theme, "mdCodeBlockBorder", text),
+    quote: (text) => themeFg(theme, "mdQuote", text),
+    quoteBorder: (text) => themeFg(theme, "mdQuoteBorder", text),
+    hr: (text) => themeFg(theme, "mdHr", text),
+    listBullet: (text) => themeFg(theme, "mdListBullet", text),
+    bold: (text) => (theme ? theme.bold(text) : text),
+    italic: (text) => (theme ? theme.italic(text) : text),
+    underline: (text) => (theme ? theme.underline(text) : text),
+    strikethrough: (text) => (theme ? theme.strikethrough(text) : text),
+  };
+}
+
+function renderMarkdown(
+  text: string,
+  width: number,
+  theme: Theme | undefined,
+): string[] {
+  const renderer = new Markdown(text, 0, 0, makeMarkdownTheme(theme), {
+    color: (content) => themeFg(theme, "userMessageText", content),
+  });
+  const lines = renderer.render(Math.max(1, width));
+  return lines.length > 0 ? lines : [""];
+}
+
+function trimMarkdownPadding(line: string): string {
+  return line.replace(/ +((?:\x1b\[[0-?]*[ -/]*[@-~])*)$/, "$1");
+}
+
+function fillLine(content: string, width: number): string {
+  const truncated = truncateToWidth(content, Math.max(0, width), "");
+  return `${truncated}${" ".repeat(Math.max(0, width - visibleWidth(truncated)))}`;
+}
+
+function accent(
+  theme: Theme | undefined,
+  config: ZentuiConfig,
+  text: string,
+): string {
+  return theme
+    ? renderStyleForSourceOrFallbackStrict(
+        theme,
+        config.components.userMessages.colorSource,
+        config.colors.editorAccent,
+        EDITOR_ACCENT_FALLBACK,
+        text,
+      )
+    : text;
+}
+
+function border(
+  theme: Theme | undefined,
+  config: ZentuiConfig,
+  text: string,
+): string {
+  return theme
+    ? renderStyleForSourceOrFallbackStrict(
+        theme,
+        config.components.userMessages.colorSource,
+        config.colors.editorBorder,
+        EDITOR_BORDER_FALLBACK,
+        text,
+      )
+    : text;
+}
+
+function renderRail(theme: Theme | undefined, config: ZentuiConfig): string {
+  return `${accent(theme, config, config.icons.rail)} `;
+}
+
+function renderFramed({
+  text,
+  width,
+  theme,
+  config,
+}: UserMessageStyleRenderInput): string[] {
+  if (width <= 0) return [""];
+  const rail = renderRail(theme, config);
+  const contentWidth = Math.max(1, width - visibleWidth(rail));
+  const body = renderMarkdown(text, contentWidth, theme);
+  const row = (line: string) => {
+    const available = Math.max(0, width - visibleWidth(rail));
+    return truncateToWidth(`${rail}${fillLine(line, available)}`, width, "");
+  };
+  const rule = truncateToWidth(
+    border(theme, config, "─".repeat(width)),
+    width,
+    "",
+  );
+  return [rule, row(""), ...body.map(row), row(""), rule];
+}
+
+function renderFramedCopyFriendly({
+  text,
+  width,
+  theme,
+  config,
+}: UserMessageStyleRenderInput): string[] {
+  if (width <= 0) return [""];
+  const prefix = width > 1 ? " " : "";
+  const body = renderMarkdown(text, width - prefix.length, theme).map((line) =>
+    fillLine(`${prefix}${line}`, width),
+  );
+  const rule = truncateToWidth(
+    border(theme, config, "─".repeat(width)),
+    width,
+    "",
+  );
+  return [rule, "", ...body, "", rule];
+}
+
+function renderCompact({
+  text,
+  width,
+  theme,
+  config,
+}: UserMessageStyleRenderInput): string[] {
+  if (width <= 0) return [""];
+  const rail = renderRail(theme, config);
+  const railWidth = visibleWidth(rail);
+  if (width <= railWidth) {
+    return renderMarkdown(text, width, theme).map((line) =>
+      truncateToWidth(trimMarkdownPadding(line), width, ""),
+    );
+  }
+  const contentWidth = width - railWidth;
+  return renderMarkdown(text, contentWidth, theme).map((line) =>
+    truncateToWidth(`${rail}${trimMarkdownPadding(line)}`, width, ""),
+  );
+}
+
+function renderLabeled({
+  text,
+  width,
+  theme,
+  config,
+}: UserMessageStyleRenderInput): string[] {
+  if (width <= 0) return [""];
+  if (width <= 2) {
+    return renderMarkdown(text, width, theme).map((line) =>
+      truncateToWidth(line, width, ""),
+    );
+  }
+
+  const horizontalPadding = width >= 5 ? 1 : 0;
+  const contentWidth = Math.max(1, width - 2 - horizontalPadding * 2);
+  const body = renderMarkdown(text, contentWidth, theme);
+  const top =
+    width >= 9
+      ? `${border(theme, config, "╭─")}${accent(theme, config, " User ")}${border(
+          theme,
+          config,
+          `${"─".repeat(Math.max(0, width - 9))}╮`,
+        )}`
+      : border(theme, config, `╭${"─".repeat(Math.max(0, width - 2))}╮`);
+  const padding = " ".repeat(horizontalPadding);
+  const side = (line: string) =>
+    `${border(theme, config, "│")}${padding}${fillLine(line, contentWidth)}${padding}${border(
+      theme,
+      config,
+      "│",
+    )}`;
+  const bottom = border(
+    theme,
+    config,
+    `╰${"─".repeat(Math.max(0, width - 2))}╯`,
+  );
+  return [top, ...body.map(side), bottom];
+}
+
+export function userMessageStyleCacheKey(config: ZentuiConfig): string {
+  const messages = config.components.userMessages;
+  switch (messages.style) {
+    case "framed":
+      return [
+        "framed",
+        messages.colorSource,
+        config.colors.editorAccent ?? "",
+        config.colors.editorBorder ?? "",
+        config.icons.rail,
+      ].join("\0");
+    case "framed-copy-friendly":
+      return [
+        "framed-copy-friendly",
+        messages.colorSource,
+        config.colors.editorBorder ?? "",
+      ].join("\0");
+    case "compact":
+      return [
+        "compact",
+        messages.colorSource,
+        config.colors.editorAccent ?? "",
+        config.icons.rail,
+      ].join("\0");
+    case "labeled":
+      return [
+        "labeled",
+        messages.colorSource,
+        config.colors.editorAccent ?? "",
+        config.colors.editorBorder ?? "",
+        "User:v1",
+      ].join("\0");
+  }
+}
+
+function renderSelectedUserMessageStyle(
+  input: UserMessageStyleRenderInput,
+): string[] {
+  switch (input.config.components.userMessages.style) {
+    case "framed":
+      return renderFramed(input);
+    case "framed-copy-friendly":
+      return renderFramedCopyFriendly(input);
+    case "compact":
+      return renderCompact(input);
+    case "labeled":
+      return renderLabeled(input);
+  }
+}
+
+export function renderUserMessageStyle(
+  input: UserMessageStyleRenderInput,
+): string[] {
+  // Raw user input is a terminal trust boundary. Strip every source control,
+  // including OSC 8; Markdown may add its own validated links afterward.
+  return renderSelectedUserMessageStyle({
+    ...input,
+    text: sanitizeUserMessageSourceText(input.text),
+  });
+}