@selesai/code 0.13.12 → 0.13.14

package/dist/extensions/pi-zentui/extensions/zentui/settings-previews.ts

@@ -1,17 +1,62 @@
 import type { Theme } from "@earendil-works/pi-coding-agent";
-import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { Markdown, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
 import { renderAccentRailEditorFrame } from "./accent-rail-editor";
 import type { PolishedTuiConfig } from "./config";
 import { sanitizeEditorMetadataText } from "./editor-metadata-format";
 import { renderMinimalistFrame } from "./minimalist-editor";
 import { safeThemeFg } from "./style";
+import { createThinkingStepsRows } from "./thinking-experimental";
+import { formatThinkingStatus, thinkingStatusLabels } from "./thinking-status";
+import { parseThinkingSteps } from "./thinking-steps";
 import { renderPolishedEditorFrame } from "./ui";
-import { renderUserMessageStyle } from "./user-message-styles";
+import { makeMarkdownTheme, renderUserMessageStyle } from "./user-message-styles";
 
 export const SETTINGS_PREVIEW_MAX_WIDTH = 72;
 export const SETTINGS_PREVIEW_MAX_ROWS = 10;
 export const EDITOR_PREVIEW_INPUT = "Explain this change safely.";
 export const USER_MESSAGE_PREVIEW_MARKDOWN = "Please review **this change** safely.";
+export const THINKING_STEPS_PREVIEW_MARKDOWN = [
+	"# Inspect the change",
+	"# Map the affected surface",
+	"# Parse structural labels",
+	"# Check narrow widths",
+	"# Preserve [literal] labels",
+	"# Validate rendered output",
+	"# Verify compatibility",
+].join("\n");
+type ThinkingPreviewState = Readonly<{
+	available: boolean;
+	rendererAvailable?: boolean;
+	streamingAvailable?: boolean;
+	streamingPoisoned?: boolean;
+	active: boolean;
+	activeMode?: "rail" | "tree" | "streaming";
+	startup: Readonly<{ enabled: boolean; mode: "rail" | "tree" | "streaming" }>;
+	restartRequired: boolean;
+	reason?: string;
+}>;
+
+type ThinkingPreviewCapability =
+	| boolean
+	| Readonly<{ available: boolean }>
+	| Readonly<{ readonly state: ThinkingPreviewState }>;
+
+function wrapPreviewText(text: string, width: number): string[] {
+	if (width <= 0) return [];
+	const rows: string[] = [];
+	for (const fact of text.split(" · ")) {
+		const candidate = rows.length > 0 ? `${rows.at(-1)} · ${fact}` : fact;
+		if (visibleWidth(candidate) <= width) {
+			if (rows.length > 0) rows[rows.length - 1] = candidate;
+			else rows.push(candidate);
+			continue;
+		}
+		if (rows.length === 0 || rows.at(-1) !== fact) rows.push(fact);
+	}
+	return rows.flatMap((row) =>
+		visibleWidth(row) <= width ? [row] : [truncateToWidth(row, width, "")],
+	);
+}
 
 function boundedRows(rows: string[], width: number): string[] {
 	const safeWidth = Math.max(0, Math.min(SETTINGS_PREVIEW_MAX_WIDTH, width));
@@ -126,3 +171,75 @@ export function renderUserMessageSettingsPreview(
 	const frame = renderUserMessageStyle({ text, width: previewWidth, theme, config: safeConfig });
 	return boundedRows(frame, previewWidth);
 }
+
+export function renderThinkingStepsSettingsPreview(
+	config: PolishedTuiConfig,
+	theme: Theme,
+	width: number,
+	capability: ThinkingPreviewCapability = true,
+): string[] {
+	const previewWidth = Math.max(0, Math.min(SETTINGS_PREVIEW_MAX_WIDTH, width));
+	if (previewWidth <= 0) return [];
+	const thinkingSteps = config.components.thinkingSteps;
+	const state: ThinkingPreviewState =
+		typeof capability === "boolean"
+			? {
+					available: capability,
+					active: false,
+					startup: { enabled: false, mode: "tree" },
+					restartRequired: capability,
+				}
+			: "state" in capability
+				? capability.state
+				: {
+						available: capability.available,
+						active: false,
+						startup: { enabled: false, mode: "tree" },
+						restartRequired: false,
+					};
+	const status = formatThinkingStatus(thinkingStatusLabels(thinkingSteps, state));
+	const statusRows = wrapPreviewText(status, previewWidth).map((row) =>
+		safeThemeFg(theme, "muted", row),
+	);
+	if (thinkingSteps.mode === "streaming") {
+		return boundedRows(
+			[
+				...statusRows,
+				safeThemeFg(theme, "thinkingText", "Thinking 7.1s  (configured thinking toggle to expand)"),
+				safeThemeFg(theme, "thinkingText", "Inspect the host-rendered reasoning tail."),
+				safeThemeFg(theme, "thinkingText", "Preserve native Markdown and wrapping."),
+			],
+			previewWidth,
+		);
+	}
+	const markdownTheme = makeMarkdownTheme(theme);
+	const defaultTextStyle = {
+		color: (text: string) => theme.fg("thinkingText", text),
+		italic: true,
+	};
+	const native = new Markdown(
+		THINKING_STEPS_PREVIEW_MARKDOWN,
+		0,
+		0,
+		markdownTheme,
+		defaultTextStyle,
+	);
+	const steps = parseThinkingSteps(THINKING_STEPS_PREVIEW_MARKDOWN);
+	const rows = steps
+		? createThinkingStepsRows(
+				native,
+				{
+					text: THINKING_STEPS_PREVIEW_MARKDOWN,
+					paddingX: 0,
+					paddingY: 0,
+					theme: markdownTheme,
+					defaultTextStyle,
+				},
+				steps,
+				thinkingSteps.mode,
+				true,
+				() => theme,
+			).render(previewWidth)
+		: native.render(previewWidth);
+	return boundedRows([...statusRows, ...rows], previewWidth);
+}