osdy-pi 1.2.0 → 1.3.0

package/extensions/osdy-pi/types.ts

@@ -1,5 +1,12 @@
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
 import type { TUI } from "@earendil-works/pi-tui";
 
+type EditorFactory = Exclude<
+	ReturnType<ExtensionContext["ui"]["getEditorComponent"]>,
+	undefined
+>;
+import type { CodexUsageSnapshot } from "./codex-usage.js";
+
 export type AnimationMode = "off" | "intro" | "continuous";
 
 export const EDITOR_MODES = {
@@ -14,8 +21,11 @@ export const DEFAULT_EDITOR_MODE = EDITOR_MODES.AUTO;
 
 export interface GlobalEditorSettings {
 	version: number;
+	enabled: boolean;
 	editorMode: EditorMode;
 	workingTreeEnabled: boolean;
+	headerVariant: HeaderVariant;
+	mascot: MascotChoice;
 }
 
 export function resolveEffectiveEditorMode(
@@ -30,15 +40,30 @@ export function shouldShowFooterMetadata(editorEffective: boolean): boolean {
 	return !editorEffective;
 }
 
-export type HeaderVariant = "osdy-theme" | "classic";
+export const HEADER_VARIANT_CHOICES = ["osdy-theme", "neon"] as const;
+
+export type HeaderVariant = (typeof HEADER_VARIANT_CHOICES)[number];
+
+export const MASCOT_CHOICES = ["current", "bts"] as const;
+
+export type MascotChoice = (typeof MASCOT_CHOICES)[number];
 
 export type WorkingTreePlacement = "aboveEditor" | "belowEditor";
 
+export type CodexUsageState =
+	| { kind: "idle" }
+	| { kind: "loading"; snapshot: CodexUsageSnapshot | undefined }
+	| { kind: "ready"; snapshot: CodexUsageSnapshot }
+	| { kind: "error"; message: string; snapshot: CodexUsageSnapshot | undefined };
+
 export type OsdyState = {
+	codexUsage: CodexUsageState;
 	enabled: boolean;
 	editorEffective: boolean;
 	editorMode: EditorMode;
+	fallbackEditorFactory: EditorFactory | undefined;
 	headerVariant: HeaderVariant;
+	mascot: MascotChoice;
 	smallMode: boolean;
 	tui: TUI | undefined;
 	workingTreeEnabled: boolean;

package/extensions/osdy-pi/ui.test.ts

@@ -4,6 +4,8 @@ import test from "node:test";
 // @ts-expect-error Node's native TypeScript runner resolves test-only TypeScript source imports.
 import * as profileLabel from "./profile-label.ts";
 // @ts-expect-error Node's native TypeScript runner resolves test-only TypeScript source imports.
+import { HEADER_VARIANTS, MASCOTS, mascotForChoice, scaleHeader } from "./constants.ts";
+// @ts-expect-error Node's native TypeScript runner resolves test-only TypeScript source imports.
 import { shouldShowFooterMetadata } from "./types.ts";
 
 void test("footer metadata is shown only when the native editor is effective", () => {
@@ -11,16 +13,135 @@ void test("footer metadata is shown only when the native editor is effective", (
 	assert.equal(shouldShowFooterMetadata(true), false);
 });
 
+void test("neon header keeps the parsed 129 by 13 transparent tone structure", () => {
+	assert.deepEqual(Object.keys(HEADER_VARIANTS), ["osdy-theme", "neon"]);
+	const neon = scaleHeader("neon", 1_000, 100);
+	assert.equal(neon.header.length, 13);
+	const toneMap = neon.toneMap;
+	assert.ok(toneMap);
+	assert.equal(toneMap.length, 13);
+	assert.equal(Array.from(neon.header[0] ?? "").length, 129);
+	assert.equal(
+		neon.header.reduce(
+			(count, row) =>
+				count + Array.from(row).filter((character) => character !== " ").length,
+			0,
+		),
+		1121,
+	);
+	for (let row = 0; row < neon.header.length; row += 1) {
+		const glyphs = Array.from(neon.header[row] ?? "");
+		const tones: string[] = Array.from(toneMap[row] ?? "");
+		assert.equal(glyphs.length, tones.length);
+		for (let column = 0; column < glyphs.length; column += 1)
+			if (glyphs[column] === " ") assert.equal(tones[column], " ");
+	}
+});
+
+void test("neon header keeps white and black fixed while pink follows accent", () => {
+	assert.deepEqual(HEADER_VARIANTS.neon.headerTonePalette, {
+		b: "#FFFFFF",
+		h: { kind: "theme", token: "accent" },
+		l: { kind: "theme", token: "accent", dimmed: true },
+		m: { kind: "theme", token: "accent", dimmed: true },
+		d: "#12011B",
+		p: { kind: "theme", token: "accent", dimmed: true },
+		c: "#FFFFFF",
+		v: "#FFFFFF",
+	});
+});
+
+void test("selected headers render through foreground-only tone-map animation", () => {
+	const ui = readFileSync(new URL("./ui.ts", import.meta.url), "utf8");
+	const animation = readFileSync(new URL("./animation.ts", import.meta.url), "utf8");
+	assert.match(ui, /const variant = HEADER_VARIANTS\[state\.headerVariant\];/);
+	assert.match(ui, /variant\.headerMap,/);
+	assert.match(ui, /variant\.headerTonePalette/);
+	assert.match(animation, /return `\\u001B\[38;2;/);
+	assert.doesNotMatch(animation, /\[48;/);
+});
+
+void test("mascot selection wires Bts art through the responsive renderer", () => {
+	const ui = readFileSync(new URL("./ui.ts", import.meta.url), "utf8");
+
+	assert.deepEqual(Object.keys(MASCOTS), ["current", "bts"]);
+	assert.ok(mascotForChoice("bts"));
+	assert.match(ui, /const mascot = mascotForChoice\(state\.mascot\);/);
+	assert.match(ui, /scaleMascot\(\s*mascot\.art,/);
+});
+
+void test("Bts retains the 60 by 26 raccoon glyph structure and transparent tone cells", () => {
+	const art = MASCOTS.bts.art;
+	assert.equal(art.mascot.length, 26);
+	assert.equal(Array.from(art.mascot[0] ?? "").length, 60);
+	assert.equal(
+		art.mascot.reduce(
+			(count, row) =>
+				count + Array.from(row).filter((character) => character !== " ").length,
+			0,
+		),
+		682,
+	);
+	for (let row = 0; row < art.mascot.length; row += 1)
+		for (
+			let column = 0;
+			column < Array.from(art.mascot[row] ?? "").length;
+			column += 1
+		)
+			if (Array.from(art.mascot[row] ?? "")[column] === " ")
+				assert.equal(Array.from(art.toneMap[row] ?? "")[column], " ");
+});
+
+void test("Bts receives the original right-edge glow", () => {
+	const art = MASCOTS.bts.art;
+	for (let row = 0; row < art.mascot.length; row += 1) {
+		const glyphs = Array.from(art.mascot[row] ?? "");
+		const tones = Array.from(art.toneMap[row] ?? "");
+		const rightmost = glyphs
+			.map((glyph, column) => ({ glyph, column }))
+			.filter(({ glyph }) => glyph !== " ")
+			.slice(-3)
+			.reverse();
+		assert.deepEqual(
+			rightmost.map(({ column }) => tones[column]),
+			["p", "c", "v"].slice(0, rightmost.length),
+		);
+	}
+});
+
+void test("mascot tone rendering never emits terminal background sequences", () => {
+	const animation = readFileSync(
+		new URL("./animation.ts", import.meta.url),
+		"utf8",
+	);
+
+	assert.match(animation, /return `\\u001B\[38;2;/);
+	assert.doesNotMatch(animation, /\[48;/);
+});
+
 void test("maximum thinking uses the existing extra-high theme color", () => {
 	const source = readFileSync(new URL("./ui.ts", import.meta.url), "utf8");
 	assert.match(source, /max:\s*"thinkingXhigh"/);
 });
 
+void test("renders the extended editor thinking level in bold", () => {
+	const source = readFileSync(new URL("./ui.ts", import.meta.url), "utf8");
+	assert.match(source, /theme\.bold\(thinkingLevel\)/);
+});
+
 void test("places a managed profile beside the model in simple mode and preserves its fallback", () => {
 	assert.equal(
 		profileLabel.resolveActiveProfileLabel({ OSDY_PI_PROFILE_NAME: "work" }),
 		"work",
 	);
+	assert.equal(
+		profileLabel.resolveActiveProfileLabel({ OSDY_PI_PROFILE_NAME: "WORK" }),
+		"WORK",
+	);
+	assert.equal(
+		profileLabel.resolveActiveProfileLabel({ OSDY_PI_PROFILE_NAME: "DEFAULT" }),
+		undefined,
+	);
 	assert.equal(profileLabel.resolveActiveProfileLabel({}), undefined);
 	assert.equal(
 		profileLabel.formatModelMetadata("gpt-5", "high", "work"),
@@ -38,6 +159,13 @@ void test("places a managed profile beside the model in simple mode and preserve
 	);
 });
 
+void test("wires themed Codex quota bars below both native footer and extended editor", () => {
+	const source = readFileSync(new URL("./ui.ts", import.meta.url), "utf8");
+	assert.match(source, /renderCompactCodexQuotaBars/);
+	assert.equal((source.match(/renderCompactCodexQuotaBars\(/g) ?? []).length, 2);
+	assert.doesNotMatch(source, /formatCodexUsageMetadata/);
+});
+
 void test("replaces the extended editor Osdy-Pi title with a managed profile or preserves its fallback", () => {
 	assert.equal(profileLabel.resolveEditorTitleLabel("work"), "work");
 	assert.equal(

package/extensions/osdy-pi/ui.ts

@@ -18,6 +18,11 @@ import {
 	asciiAnimationMode,
 } from "./animation.js";
 import { fitBorder } from "./border.js";
+import { formatContextUsage } from "./context-usage-ui.js";
+import {
+	renderCompactCodexQuotaBars,
+	resolveCodexUsageLayout,
+} from "./codex-usage-ui.js";
 import {
 	ANIMATION_INTERVAL_MS,
 	COMPACT_HEADER_HIDDEN_COLUMNS,
@@ -25,17 +30,19 @@ import {
 	HEADER_VARIANTS,
 	INTRO_ANIMATION_FRAMES,
 	MASCOT_GAP,
+	mascotForChoice,
 	mascotWidthForRows,
 	scaleHeader,
 	scaleMascot,
 	STACKED_CONTENT_MAX_ROWS,
 	STACKED_HEADER_MAX_ROWS,
 	STACKED_HEADER_MIN_ROWS,
+	type MascotConfig,
 	type ScaledHeaderArt,
 	WORKING_SPINNER_FRAMES,
 } from "./constants.js";
 import { formatPath } from "./format.js";
-import { modelLabel, usageLabel } from "./metrics.js";
+import { contextUsageData, modelLabel } from "./metrics.js";
 import {
 	formatModelMetadata,
 	resolveActiveProfileLabel,
@@ -88,16 +95,14 @@ type HeaderConfig = (typeof HEADER_VARIANTS)[HeaderVariant];
 function calculateHeaderLayout(
 	variantName: HeaderVariant,
 	variant: HeaderConfig,
+	mascot: MascotConfig,
 	width: number,
 	terminalColumns: number,
 	terminalRows: number,
 ): HeaderLayout {
 	const renderWidth = Math.max(1, width);
 	const fullHeaderWidth = headerWidth(variantName);
-	const mascotArt = {
-		mascot: variant.mascot ?? [],
-		toneMap: variant.mascotMap ?? [],
-	};
+	const mascotArt = mascot.art;
 	const hasMascot = mascotArt.mascot.length > 0 && mascotArt.toneMap.length > 0;
 	const heightLimitedMascotWidth = hasMascot
 		? mascotWidthForRows(mascotArt, terminalRows)
@@ -132,7 +137,7 @@ function calculateHeaderLayout(
 }
 
 function renderMascotLines(
-	variant: HeaderConfig,
+	mascot: MascotConfig,
 	mascotArt: ReturnType<typeof scaleMascot>,
 	frame: number,
 	theme: SimpleTheme,
@@ -140,14 +145,14 @@ function renderMascotLines(
 ): string[] {
 	return mascotArt.mascot.map((line, index) => {
 		const toneLine = mascotArt.toneMap[index];
-		if (toneLine && variant.mascotTonePalette) {
+		if (toneLine) {
 			return animateAsciiLineWithToneMap(
 				line,
 				toneLine,
 				index,
 				frame,
 				theme,
-				variant.mascotTonePalette,
+				mascot.tonePalette,
 				animationStyle,
 			);
 		}
@@ -156,9 +161,9 @@ function renderMascotLines(
 			index,
 			frame,
 			theme,
-			variant.mascotPalette.baseColor,
-			variant.mascotPalette.highlightColor,
-			variant.mascotPalette.trailColor,
+			"accent",
+			"mdHeading",
+			"mdLink",
 			animationStyle,
 		);
 	});
@@ -211,22 +216,20 @@ function renderResponsiveHeader(
 	animationStyle: "animated" | "static",
 ): string[] {
 	const variant = HEADER_VARIANTS[state.headerVariant];
+	const mascot = mascotForChoice(state.mascot);
 	const layout = calculateHeaderLayout(
 		state.headerVariant,
 		variant,
+		mascot,
 		width,
 		terminalColumns,
 		terminalRows,
 	);
 	const mascotArt = layout.hasMascot
-		? scaleMascot(
-				{ mascot: variant.mascot ?? [], toneMap: variant.mascotMap ?? [] },
-				layout.mascotWidthBudget,
-				layout.mascotRowBudget,
-			)
+		? scaleMascot(mascot.art, layout.mascotWidthBudget, layout.mascotRowBudget)
 		: { mascot: [], toneMap: [] };
 	const mascotLines = renderMascotLines(
-		variant,
+		mascot,
 		mascotArt,
 		frame,
 		theme,
@@ -318,31 +321,33 @@ class OsdyFooter implements Component {
 				: [locationLine];
 		}
 		const thinkingLevel = this.pi.getThinkingLevel();
-		const thinkingLine = truncateToWidth(
-			formatModelMetadata(
-				modelLabel(this.ctx),
-				this.theme.fg(
-					THINKING_THEME_TOKENS[thinkingLevel],
-					`\u001B[1m${thinkingLevel}\u001B[22m`,
-				),
-				resolveActiveProfileLabel(),
+		const baseMetadata = formatModelMetadata(
+			modelLabel(this.ctx),
+			this.theme.fg(
+				THINKING_THEME_TOKENS[thinkingLevel],
+				`\u001B[1m${thinkingLevel}\u001B[22m`,
 			),
-			width,
-			ellipsis,
+			resolveActiveProfileLabel(),
 		);
+		const cachedCodexUsage =
+			this.state.codexUsage.kind === "idle"
+				? undefined
+				: this.state.codexUsage.snapshot;
+		const codexSnapshot =
+			this.ctx.model?.provider === "openai-codex" ? cachedCodexUsage : undefined;
+		const thinkingLine = truncateToWidth(baseMetadata, width, ellipsis);
+		const quotaLines = codexSnapshot
+			? renderCompactCodexQuotaBars(this.theme, codexSnapshot, width)
+			: [];
 		const usageLine = truncateToWidth(
-			usageLabel(this.ctx).trim(),
+			formatContextUsage(this.theme, contextUsageData(this.ctx), width),
 			width,
 			ellipsis,
 		);
+		const lines = [thinkingLine, ...quotaLines, usageLine, locationLine];
 		return statusLine
-			? [
-					thinkingLine,
-					usageLine,
-					locationLine,
-					truncateToWidth(statusLine, width, ellipsis),
-				]
-			: [thinkingLine, usageLine, locationLine];
+			? [...lines, truncateToWidth(statusLine, width, ellipsis)]
+			: lines;
 	}
 
 	invalidate(): void {}
@@ -433,6 +438,7 @@ export function createWorkingWidgetFactory(workingState: WorkingWidgetState) {
 export function createEditorComponent(
 	pi: ExtensionAPI,
 	ctx: ExtensionContext,
+	state: OsdyState,
 ): (
 	tui: TUI,
 	theme: EditorTheme,
@@ -476,15 +482,26 @@ export function createEditorComponent(
 				"mdLink",
 				` ${resolveEditorTitleLabel(resolveActiveProfileLabel())} `,
 			);
-			const topRight = ctx.ui.theme.fg(
-				"muted",
-				` ${modelLabel(ctx)} · think ${pi.getThinkingLevel()} `,
+			const cachedCodexUsage =
+				state.codexUsage.kind === "idle" ? undefined : state.codexUsage.snapshot;
+			const codexSnapshot =
+				ctx.model?.provider === "openai-codex" ? cachedCodexUsage : undefined;
+			const thinkingLevel = pi.getThinkingLevel();
+			const modelAndThinking = `${modelLabel(ctx)} · think ${ctx.ui.theme.bold(thinkingLevel)}`;
+			const layout = resolveCodexUsageLayout(topLeft, ` ${modelAndThinking} `);
+			const topRight = ctx.ui.theme.fg("muted", layout.topRight);
+			const bottomLeft = formatContextUsage(
+				ctx.ui.theme,
+				contextUsageData(ctx),
+				innerWidth,
 			);
-			const bottomLeft = ctx.ui.theme.fg("muted", usageLabel(ctx));
 			lines[0] = `${borderColor("╭")}${fitBorder(topLeft, topRight, editorWidth - 2, borderColor)}${borderColor("╮")}`;
 			lines[bottomIndex] =
 				`${borderColor("╰")}${fitBorder(bottomLeft, "", editorWidth - 2, borderColor)}${borderColor("╯")}`;
-			return lines;
+			const quotaLines = codexSnapshot
+				? renderCompactCodexQuotaBars(ctx.ui.theme, codexSnapshot, editorWidth)
+				: [];
+			return [...lines, ...quotaLines];
 		}
 	}
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "osdy-pi",
-	"version": "1.2.0",
+	"version": "1.3.0",
 	"description": "Osdy Pi package: themes, header, and custom editor for Pi.",
 	"license": "MIT",
 	"type": "module",
@@ -11,7 +11,8 @@
 		"extension"
 	],
 	"bin": {
-		"osdy-pi": "bin/osdy-pi.mjs"
+		"osdy-pi": "bin/osdy-pi.mjs",
+		"osdy": "bin/osdy.mjs"
 	},
 	"scripts": {
 		"typecheck": "tsc --noEmit",
@@ -24,6 +25,8 @@
 		"LICENSE",
 		"bin",
 		"scripts/osdy-pi-account-profiles.mjs",
+		"scripts/osdy-pi-gentle-coexistence.mjs",
+		"scripts/osdy-pi-profile-setup.mjs",
 		"themes",
 		"extensions",
 		"mapche1.png"