@selesai/code 0.9.14 → 0.10.0

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

@@ -0,0 +1,128 @@
+import type { Theme } from "@earendil-works/pi-coding-agent";
+import { 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 { renderPolishedEditorFrame } from "./ui";
+import { 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.";
+
+function boundedRows(rows: string[], width: number): string[] {
+	const safeWidth = Math.max(0, Math.min(SETTINGS_PREVIEW_MAX_WIDTH, width));
+	if (safeWidth <= 0) return [];
+	const bounded = rows
+		.slice(0, SETTINGS_PREVIEW_MAX_ROWS)
+		.map((line) => truncateToWidth(line, safeWidth, ""));
+	while (bounded.length > 0 && visibleWidth(bounded.at(-1) ?? "") === 0) bounded.pop();
+	return bounded;
+}
+
+function previewConfig(config: PolishedTuiConfig): PolishedTuiConfig {
+	const derived = structuredClone(config);
+	derived.icons = Object.fromEntries(
+		Object.entries(derived.icons).map(([key, value]) => [
+			key,
+			typeof value === "string" ? sanitizeEditorMetadataText(value) : value,
+		]),
+	) as typeof derived.icons;
+	return derived;
+}
+
+function adaptiveBorder(theme: Theme): (text: string) => string {
+	return (text) => safeThemeFg(theme, "thinkingHigh", text);
+}
+
+export function renderEditorSettingsPreview(
+	config: PolishedTuiConfig,
+	theme: Theme,
+	width: number,
+): string[] {
+	const previewWidth = Math.max(0, Math.min(SETTINGS_PREVIEW_MAX_WIDTH, width));
+	if (previewWidth <= 0) return [];
+	const safeConfig = previewConfig(config);
+	const editor = safeConfig.components.editor;
+	const borderColor = adaptiveBorder(theme);
+	const modelLabel = editor.modelLabel === "name" ? "Sonnet 4" : "sonnet-4";
+	const editorLines = [EDITOR_PREVIEW_INPUT];
+	const autocompleteLines = [
+		safeThemeFg(theme, "accent", "→ settings     Open settings"),
+		"  files        Search files",
+		safeThemeFg(theme, "muted", "  (1/47)"),
+	];
+	const viewport = editor.viewportIndicators ? { above: "2", below: "3" } : undefined;
+	let frame: string[];
+	if (editor.style === "accent-rail") {
+		frame = renderAccentRailEditorFrame({
+			width: previewWidth,
+			editorLines,
+			autocompleteLines,
+			viewport,
+			uiTheme: theme,
+			config: safeConfig,
+		});
+	} else if (editor.style === "minimalist") {
+		frame = renderMinimalistFrame({
+			width: previewWidth,
+			editorLines,
+			viewport,
+			inputText: EDITOR_PREVIEW_INPUT,
+			metadata: {
+				cwd: "/workspace/zentui/src",
+				projectRoot: "/workspace/zentui",
+				branch: "feat/settings-previews",
+				dirty: true,
+				ahead: 2,
+				behind: 1,
+				costLabel: "$.12",
+				modelLabel,
+				thinkingLevel: "high",
+				contextPercent: 75,
+				contextWindow: 372_000,
+				sessionName: "Preview",
+				agentDurationMs: 12_000,
+				agentActive: true,
+			},
+			uiTheme: theme,
+			config: safeConfig,
+			borderColor,
+		});
+	} else {
+		frame = renderPolishedEditorFrame({
+			width: previewWidth,
+			editorLines,
+			autocompleteLines,
+			viewport,
+			uiTheme: theme,
+			config: safeConfig,
+			modelMeta: {
+				modelLabel,
+				modelId: "sonnet-4",
+				modelName: "Sonnet 4",
+				providerLabel: "Anthropic",
+				sessionName: "Preview",
+			},
+			thinkingLevel: "high",
+			borderColor,
+		});
+	}
+	return boundedRows(frame, previewWidth);
+}
+
+export function renderUserMessageSettingsPreview(
+	config: PolishedTuiConfig,
+	theme: Theme,
+	width: number,
+	text = USER_MESSAGE_PREVIEW_MARKDOWN,
+): string[] {
+	const previewWidth = Math.max(0, Math.min(SETTINGS_PREVIEW_MAX_WIDTH, width));
+	if (previewWidth <= 0) return [];
+	const safeConfig = previewConfig(config);
+	const frame = renderUserMessageStyle({ text, width: previewWidth, theme, config: safeConfig });
+	return boundedRows(frame, previewWidth);
+}

package/dist/extensions/pi-zentui/extensions/zentui/state.ts

@@ -0,0 +1,94 @@
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
+import type { ModelLabelSource } from "./config";
+import {
+	buildCacheReadLabel,
+	buildCacheWriteLabel,
+	buildContextLabel,
+	buildCostLabel,
+	buildTokenLabel,
+	formatProviderLabel,
+	getUsageTotals,
+	type UsageTotals,
+} from "./format";
+import type { GitStatusSummary } from "./git";
+import type { PackageVersionResult } from "./package-version";
+import type { RuntimeInfo } from "./runtime";
+import type { FooterTelemetry } from "./telemetry";
+
+export type FooterState = GitStatusSummary & {
+	modelLabel: string;
+	modelId: string;
+	modelName: string;
+	providerLabel: string;
+	contextLabel: string;
+	tokenLabel: string;
+	cacheReadLabel: string;
+	cacheWriteLabel: string;
+	costLabel: string;
+	usageTotals: UsageTotals;
+	subscription: boolean;
+	autoCompaction: boolean;
+	runtime?: RuntimeInfo;
+	packageVersion?: PackageVersionResult;
+	sessionStartEpoch?: number;
+};
+
+export function createInitialState(gitDefaults: GitStatusSummary): FooterState {
+	return {
+		modelLabel: "no-model",
+		modelId: "",
+		modelName: "",
+		providerLabel: "Unknown",
+		contextLabel: "--",
+		tokenLabel: "↑0 ↓0",
+		cacheReadLabel: "",
+		cacheWriteLabel: "",
+		costLabel: "$0.000",
+		usageTotals: {
+			input: 0,
+			output: 0,
+			cacheRead: 0,
+			cacheWrite: 0,
+			latestCacheHitRate: undefined,
+			cost: 0,
+		},
+		subscription: false,
+		autoCompaction: false,
+		runtime: undefined,
+		packageVersion: undefined,
+		sessionStartEpoch: Date.now(),
+		...gitDefaults,
+	};
+}
+
+export function modelLabelFor(
+	state: Pick<FooterState, "modelId" | "modelName">,
+	source: ModelLabelSource,
+): string {
+	return source === "name"
+		? state.modelName || state.modelId || "no-model"
+		: state.modelId || "no-model";
+}
+
+export function syncState(
+	state: FooterState,
+	ctx: ExtensionContext,
+	cacheHitIcon: string,
+	telemetry: FooterTelemetry = {},
+): void {
+	const totals = getUsageTotals(ctx);
+	const m = ctx.model;
+	state.modelId = m?.id ?? "";
+	state.modelName = m?.name ?? "";
+	// Retained as a compatibility snapshot only; production surfaces format from raw fields.
+	state.modelLabel = modelLabelFor(state, "id");
+	state.providerLabel = formatProviderLabel(ctx.model?.provider);
+	state.contextLabel = buildContextLabel(ctx);
+	state.tokenLabel = buildTokenLabel(totals, cacheHitIcon);
+	state.cacheReadLabel = buildCacheReadLabel(totals.cacheRead);
+	state.cacheWriteLabel = buildCacheWriteLabel(totals.cacheWrite);
+	state.costLabel = buildCostLabel(totals);
+	state.usageTotals = totals;
+	state.subscription = telemetry.subscription === true;
+	state.autoCompaction = telemetry.autoCompaction === true;
+}

package/dist/extensions/pi-zentui/extensions/zentui/style.ts

@@ -0,0 +1,424 @@
+import type { ThemeColor } from "@earendil-works/pi-coding-agent";
+import type { ColorSource, ColorSpec } from "./config";
+
+type ThemeLike = {
+	fg(color: string, text: string): string;
+	bold?: (text: string) => string;
+	italic?: (text: string) => string;
+	underline?: (text: string) => string;
+};
+
+export type { ThemeLike };
+
+export const EDITOR_ACCENT_STYLE = "blue";
+export const EDITOR_BORDER_STYLE = "bright-black";
+export const MAX_SAFE_SGR_PREFIX_CODE_UNITS = 96;
+export const MAX_SAFE_SGR_PREFIX_SEQUENCES = 4;
+
+export type SourceStyleFallback = {
+	theme: ColorSpec;
+	terminal: ColorSpec;
+};
+
+export const EDITOR_ACCENT_FALLBACK: SourceStyleFallback = {
+	theme: "accent",
+	terminal: EDITOR_ACCENT_STYLE,
+};
+
+export const EDITOR_BORDER_FALLBACK: SourceStyleFallback = {
+	theme: "borderMuted",
+	terminal: EDITOR_BORDER_STYLE,
+};
+
+function isHexColor(value: string): boolean {
+	return /^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(value);
+}
+
+function expandHexColor(hex: string): string {
+	const body = hex.slice(1);
+	if (body.length === 3) {
+		return body
+			.split("")
+			.map((ch) => ch + ch)
+			.join("");
+	}
+	return body;
+}
+
+function hexToAnsi(hex: string, isBackground = false): string {
+	const normalized = expandHexColor(hex);
+	const r = Number.parseInt(normalized.slice(0, 2), 16);
+	const g = Number.parseInt(normalized.slice(2, 4), 16);
+	const b = Number.parseInt(normalized.slice(4, 6), 16);
+	return `\x1b[${isBackground ? 48 : 38};2;${r};${g};${b}m`;
+}
+
+const terminalColorCodes = new Map([
+	["black", 30],
+	["red", 31],
+	["green", 32],
+	["yellow", 33],
+	["blue", 34],
+	["purple", 35],
+	["cyan", 36],
+	["white", 37],
+	["bright-black", 90],
+	["bright-red", 91],
+	["bright-green", 92],
+	["bright-yellow", 93],
+	["bright-blue", 94],
+	["bright-purple", 95],
+	["bright-cyan", 96],
+	["bright-white", 97],
+]);
+
+const terminalStyleModifiers = new Map([
+	["bold", 1],
+	["dim", 2],
+	["dimmed", 2],
+	["italic", 3],
+	["underline", 4],
+]);
+
+const themeColorNameMap = new Map([
+	["red", "error"],
+	["bright-red", "error"],
+	["green", "success"],
+	["bright-green", "success"],
+	["yellow", "warning"],
+	["bright-yellow", "warning"],
+	["blue", "syntaxFunction"],
+	["bright-blue", "syntaxFunction"],
+	["cyan", "syntaxFunction"],
+	["bright-cyan", "syntaxFunction"],
+	["purple", "syntaxKeyword"],
+	["bright-purple", "syntaxKeyword"],
+	["black", "muted"],
+	["bright-black", "muted"],
+	["white", "text"],
+	["bright-white", "text"],
+]);
+
+const themeStyleModifiers = new Set(["bold", "italic", "underline"]);
+
+const themeColorTokens = new Set<ThemeColor>([
+	"accent",
+	"border",
+	"borderAccent",
+	"borderMuted",
+	"success",
+	"error",
+	"warning",
+	"muted",
+	"dim",
+	"text",
+	"thinkingText",
+	"userMessageText",
+	"customMessageText",
+	"customMessageLabel",
+	"toolTitle",
+	"toolOutput",
+	"mdHeading",
+	"mdLink",
+	"mdLinkUrl",
+	"mdCode",
+	"mdCodeBlock",
+	"mdCodeBlockBorder",
+	"mdQuote",
+	"mdQuoteBorder",
+	"mdHr",
+	"mdListBullet",
+	"toolDiffAdded",
+	"toolDiffRemoved",
+	"toolDiffContext",
+	"syntaxComment",
+	"syntaxKeyword",
+	"syntaxFunction",
+	"syntaxVariable",
+	"syntaxString",
+	"syntaxNumber",
+	"syntaxType",
+	"syntaxOperator",
+	"syntaxPunctuation",
+	"thinkingOff",
+	"thinkingMinimal",
+	"thinkingLow",
+	"thinkingMedium",
+	"thinkingHigh",
+	"thinkingXhigh",
+	"thinkingMax",
+	"bashMode",
+]);
+
+function terminalColorToAnsi(color: string, isBackground = false): string | undefined {
+	const normalized = color.toLowerCase();
+	const colorCode = terminalColorCodes.get(normalized);
+	if (colorCode !== undefined) return `${isBackground ? colorCode + 10 : colorCode}`;
+
+	if (/^(?:[0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/.test(normalized)) {
+		return `${isBackground ? 48 : 38};5;${normalized}`;
+	}
+
+	if (isHexColor(normalized)) return hexToAnsi(normalized, isBackground).slice(2, -1);
+	return undefined;
+}
+
+function isExplicitTerminalColorToken(token: string): boolean {
+	const normalized = token.toLowerCase();
+	if (normalized.startsWith("fg:") || normalized.startsWith("bg:")) return true;
+	if (isHexColor(normalized)) return true;
+	return /^(?:[0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/.test(normalized);
+}
+
+function isSupportedStyleToken(token: string): boolean {
+	const normalized = token.toLowerCase();
+	if (terminalStyleModifiers.has(normalized)) return true;
+	if (terminalColorToAnsi(normalized) !== undefined) return true;
+
+	const isForeground = normalized.startsWith("fg:");
+	const isBackground = normalized.startsWith("bg:");
+	if (isForeground || isBackground) {
+		return terminalColorToAnsi(normalized.slice(3), isBackground) !== undefined;
+	}
+
+	return themeColorTokens.has(token as ThemeColor);
+}
+
+export function isSupportedColorSpec(style: ColorSpec): boolean {
+	const trimmed = style.trim();
+	if (trimmed === "") return true;
+	return trimmed.split(/\s+/).every(isSupportedStyleToken);
+}
+
+function applyThemeModifiers(theme: ThemeLike, styleTokens: string[], text: string): string {
+	let rendered = text;
+	for (const token of styleTokens) {
+		const normalized = token.toLowerCase();
+		if (normalized === "bold") rendered = theme.bold?.(rendered) ?? rendered;
+		if (normalized === "italic") rendered = theme.italic?.(rendered) ?? rendered;
+		if (normalized === "underline") rendered = theme.underline?.(rendered) ?? rendered;
+	}
+	return rendered;
+}
+
+export function safeThemeFg(theme: ThemeLike, color: string, text: string): string {
+	try {
+		return theme.fg(color, text);
+	} catch {
+		return text;
+	}
+}
+
+function mapThemeColor(styleTokens: string[]): string | undefined {
+	let fallback: string | undefined;
+	for (const token of styleTokens) {
+		const normalized = token.toLowerCase();
+		if (themeStyleModifiers.has(normalized)) continue;
+		if (normalized === "dim" || normalized === "dimmed") {
+			fallback = "muted";
+			continue;
+		}
+
+		const mapped = themeColorNameMap.get(normalized);
+		if (mapped) return mapped;
+		return token;
+	}
+	return fallback;
+}
+
+/**
+ * Colorize text using a theme color token or hex color.
+ * Non-hex values are passed directly to `theme.fg()`; invalid tokens fall back
+ * to unstyled text so a config typo does not break rendering.
+ */
+export function colorize(theme: ThemeLike, color: ColorSpec, text: string): string {
+	if (isHexColor(color)) {
+		return `${hexToAnsi(color)}${text}\x1b[39m`;
+	}
+	return safeThemeFg(theme, color, text);
+}
+
+/**
+ * Render text with Starship-style terminal styling strings (e.g. "bold red", "fg:202",
+ * "bg:blue", "underline bg:#bf5700").
+ */
+function isSafeSgrParameters(parameters: string): boolean {
+	const tokens = parameters.split(";");
+	if (tokens.some((token) => !/^\d+$/.test(token))) return false;
+	const values = tokens.map(Number);
+	for (let index = 0; index < values.length; index += 1) {
+		const value = values[index];
+		if (
+			value === 1 ||
+			value === 2 ||
+			value === 3 ||
+			value === 4 ||
+			(value !== undefined && value >= 30 && value <= 37) ||
+			(value !== undefined && value >= 40 && value <= 47) ||
+			(value !== undefined && value >= 90 && value <= 97) ||
+			(value !== undefined && value >= 100 && value <= 107)
+		) {
+			continue;
+		}
+		if (value !== 38 && value !== 48) return false;
+		const mode = values[index + 1];
+		if (mode === 5) {
+			const color = values[index + 2];
+			if (color === undefined || color < 0 || color > 255) return false;
+			index += 2;
+			continue;
+		}
+		if (mode === 2) {
+			const channels = values.slice(index + 2, index + 5);
+			if (channels.length !== 3 || channels.some((channel) => channel < 0 || channel > 255)) {
+				return false;
+			}
+			index += 4;
+			continue;
+		}
+		return false;
+	}
+	return true;
+}
+
+/** Accept only the bounded SGR subset emitted by Zentui's supported style tokens. */
+export function isSafeSgrStylePrefix(value: unknown): value is string {
+	if (
+		typeof value !== "string" ||
+		value.length === 0 ||
+		value.length > MAX_SAFE_SGR_PREFIX_CODE_UNITS
+	) {
+		return false;
+	}
+	const sequence = /\x1b\[([0-9]+(?:;[0-9]+)*)m/g;
+	let offset = 0;
+	let count = 0;
+	for (const match of value.matchAll(sequence)) {
+		if (match.index !== offset || !isSafeSgrParameters(match[1] ?? "")) return false;
+		offset = match.index + match[0].length;
+		count += 1;
+		if (count > MAX_SAFE_SGR_PREFIX_SEQUENCES) return false;
+	}
+	return count > 0 && offset === value.length;
+}
+
+export function renderTerminalStyle(style: string, text: string): string {
+	const codes: string[] = [];
+	for (const token of style.trim().split(/\s+/)) {
+		if (!token) continue;
+
+		const normalized = token.toLowerCase();
+		const modifier = terminalStyleModifiers.get(normalized);
+		if (modifier !== undefined) {
+			codes.push(`${modifier}`);
+			continue;
+		}
+
+		const isForeground = normalized.startsWith("fg:");
+		const isBackground = normalized.startsWith("bg:");
+		const colorName = isForeground || isBackground ? normalized.slice(3) : normalized;
+		const color = terminalColorToAnsi(colorName, isBackground);
+		if (color) codes.push(color);
+	}
+
+	return codes.length ? `\x1b[${codes.join(";")}m${text}\x1b[0m` : text;
+}
+
+/**
+ * Apply Starship-style terminal styling first, falling back to Pi theme tokens for
+ * legacy config values such as "accent" or "syntaxKeyword".
+ */
+export function renderStyle(theme: ThemeLike, style: ColorSpec, text: string): string {
+	if (style.trim() === "") return text;
+	const styled = renderTerminalStyle(style, text);
+	return styled === text ? colorize(theme, style, text) : styled;
+}
+
+export function renderThemeStyle(theme: ThemeLike, style: ColorSpec, text: string): string {
+	const trimmed = style.trim();
+	if (trimmed === "") return text;
+
+	const tokens = trimmed.split(/\s+/).filter(Boolean);
+	if (tokens.some(isExplicitTerminalColorToken)) return renderTerminalStyle(style, text);
+
+	const color = mapThemeColor(tokens) ?? "text";
+	return safeThemeFg(theme, color, applyThemeModifiers(theme, tokens, text));
+}
+
+function renderStyleStrict(theme: ThemeLike, style: ColorSpec, text: string): string {
+	if (style.trim() === "") return text;
+	const styled = renderTerminalStyle(style, text);
+	return styled === text ? theme.fg(style, text) : styled;
+}
+
+function renderThemeStyleStrict(theme: ThemeLike, style: ColorSpec, text: string): string {
+	const trimmed = style.trim();
+	if (trimmed === "") return text;
+	const tokens = trimmed.split(/\s+/).filter(Boolean);
+	if (tokens.some(isExplicitTerminalColorToken)) return renderTerminalStyle(style, text);
+	const color = mapThemeColor(tokens) ?? "text";
+	return theme.fg(color, applyThemeModifiers(theme, tokens, text));
+}
+
+export function renderStyleForSource(
+	theme: ThemeLike,
+	source: ColorSource,
+	style: ColorSpec,
+	text: string,
+): string {
+	return source === "terminal"
+		? renderStyle(theme, style, text)
+		: renderThemeStyle(theme, style, text);
+}
+
+export function renderStyleForSourceOrFallback(
+	theme: ThemeLike,
+	source: ColorSource,
+	style: ColorSpec | undefined,
+	fallback: ColorSpec | SourceStyleFallback,
+	text: string,
+): string {
+	const fallbackStyle = typeof fallback === "string" ? fallback : fallback[source];
+	return renderStyleForSource(theme, source, style ?? fallbackStyle, text);
+}
+
+export function renderStyleForSourceOrFallbackStrict(
+	theme: ThemeLike,
+	source: ColorSource,
+	style: ColorSpec | undefined,
+	fallback: ColorSpec | SourceStyleFallback,
+	text: string,
+): string {
+	const fallbackStyle = typeof fallback === "string" ? fallback : fallback[source];
+	const resolvedStyle = style ?? fallbackStyle;
+	return source === "terminal"
+		? renderStyleStrict(theme, resolvedStyle, text)
+		: renderThemeStyleStrict(theme, resolvedStyle, text);
+}
+
+export function renderEditorAccent(text: string): string {
+	return renderTerminalStyle(EDITOR_ACCENT_STYLE, text);
+}
+
+export function renderEditorBorder(text: string): string {
+	return renderTerminalStyle(EDITOR_BORDER_STYLE, text);
+}
+
+export function renderAccentLine(theme: ThemeLike, source: ColorSource, text: string): string {
+	return renderStyleForSourceOrFallback(theme, source, undefined, EDITOR_ACCENT_FALLBACK, text);
+}
+
+export function renderChromeBorder(
+	theme: ThemeLike,
+	source: ColorSource,
+	terminalFallbackStyle: ColorSpec,
+	text: string,
+): string {
+	return renderStyleForSourceOrFallback(
+		theme,
+		source,
+		undefined,
+		{ theme: "borderMuted", terminal: terminalFallbackStyle },
+		text,
+	);
+}