@oh-my-pi/pi-coding-agent 16.4.4 → 16.4.6

package/src/modes/components/custom-editor.test.ts

@@ -1,8 +1,9 @@
 import { afterEach, beforeAll, beforeEach, describe, expect, it, vi } from "bun:test";
+import { CURSOR_MARKER } from "@oh-my-pi/pi-tui";
 import { setKittyProtocolActive } from "@oh-my-pi/pi-tui/keys";
 import { $ } from "bun";
 import { getDefaultPasteImageKeys } from "../../config/keybindings";
-import { getEditorTheme, initTheme } from "../theme/theme";
+import { getEditorTheme, initTheme, theme } from "../theme/theme";
 import {
 	CustomEditor,
 	extractBracketedImagePastePaths,
@@ -78,6 +79,62 @@ describe("CustomEditor placeholder decoration", () => {
 	});
 });
 
+describe("CustomEditor queue shorthand decoration", () => {
+	beforeAll(async () => {
+		await initTheme();
+	});
+
+	it("reserves the first line as soon as either queue prefix is completed", () => {
+		for (const prefix of ["->", "=>"]) {
+			const editor = new CustomEditor(getEditorTheme());
+			editor.handleInput(prefix[0] ?? "");
+			expect(editor.getText()).toBe(prefix[0]);
+
+			editor.handleInput(prefix[1] ?? "");
+			expect(editor.getText()).toBe(`${prefix}\n`);
+			expect(editor.getCursor()).toEqual({ line: 1, col: 0 });
+
+			editor.handleInput("\x7f");
+			expect(editor.getText()).toBe(`${prefix}\n`);
+			expect(editor.getCursor()).toEqual({ line: 1, col: 0 });
+		}
+	});
+
+	it("renders the reserved line as a dim Queueing header", () => {
+		for (const prefix of ["->", "=>"]) {
+			const editor = new CustomEditor(getEditorTheme());
+			editor.setText(`${prefix}\nqueue this`);
+
+			expect(editor.decorateText(prefix)).toBe(theme.fg("dim", `Queueing ${theme.nav.selected}`));
+			editor.focused = true;
+			const rendered = editor.render(40).map(line => Bun.stripANSI(line.replace(CURSOR_MARKER, "")));
+			expect(rendered.some(line => line.includes(`Queueing ${theme.nav.selected}`))).toBe(true);
+			expect(rendered.every(line => Bun.stringWidth(line) === 40)).toBe(true);
+			expect(rendered.some(line => line.includes("queue this"))).toBe(true);
+		}
+	});
+
+	it("highlights dot and parenthesis markers only for detected queue lists", () => {
+		for (const [input, marker] of [
+			["=>\n1. first\n2. second", "1."],
+			["=>\n1) first\n2) second", "1)"],
+		]) {
+			const editor = new CustomEditor(getEditorTheme());
+			editor.setText(input);
+			expect(editor.decorateText(`${marker} first`).startsWith(theme.fg("accent", marker))).toBe(true);
+		}
+
+		const unfinished = new CustomEditor(getEditorTheme());
+		unfinished.setText("=>\n1. first\n2. second\n3. third\n4.");
+		expect(unfinished.decorateText("1. first").startsWith(theme.fg("accent", "1."))).toBe(true);
+		expect(unfinished.decorateText("4.").startsWith(theme.fg("accent", "4."))).toBe(true);
+
+		const editor = new CustomEditor(getEditorTheme());
+		editor.setText("=>\n1. first\n3. third");
+		expect(editor.decorateText("1. first")).toBe("1. first");
+	});
+});
+
 describe("CustomEditor bracketed path paste", () => {
 	it("leaves a pasted bare .png filename on the normal text path", () => {
 		expect(extractBracketedImagePastePaths(bracketedPaste("icon-photo-default.png"))).toBeUndefined();

package/src/modes/components/custom-editor.ts

@@ -6,7 +6,8 @@ import type { AppKeybinding } from "../../config/keybindings";
 import { isSettingsInitialized, settings } from "../../config/settings";
 import { imageReferenceHyperlink, PLACEHOLDER_REGEX, renderPlaceholders } from "../image-references";
 import { hasMagicKeyword, highlightMagicKeywords } from "../magic-keywords";
-import { fgOrPlain } from "../theme/theme";
+import { isQueuedMessageList, parseQueueShorthand, QUEUE_LIST_MARKER_RE } from "../queue-input";
+import { fgOrPlain, theme } from "../theme/theme";
 
 type ConfigurableEditorAction = Extract<
 	AppKeybinding,
@@ -326,21 +327,41 @@ export class CustomEditor extends Editor {
 	 *  timer to request the next animation frame. Undefined when nobody is
 	 *  listening (tests, headless callers); the timer chain still self-cleans. */
 	#requestShimmerRepaint: (() => void) | undefined;
+	#queueDecorationText: string | undefined;
+	#queueShorthandActive = false;
+	#queueListActive = false;
 
-	/** Gradient-highlight the "ultrathink" / "orchestrate" / "workflowz" keywords as the user types
-	 *  them, skipping any occurrence inside code spans, fenced blocks, or XML sections. Also make
-	 *  pasted image placeholders visually distinct and hyperlink them once their blob file exists.
-	 *  When the editor is focused, the buffer contains a magic keyword, and `magicKeywords.enabled`
-	 *  is on, the gradient shifts every frame to produce a Claude-Code-style shimmer; each render
-	 *  schedules the next frame, so losing focus, deleting the keyword, or flipping the setting
-	 *  stops the animation on its own. The static glow itself runs even when shimmering is gated
-	 *  off, matching existing behavior for the editor and sent bubbles. */
+	/** Decorate magic keywords, attachments, and the queue-composer header/list markers.
+	 *  Queue shorthand reserves its first logical line as a dim `Queueing` label; sequential
+	 *  item markers use the accent color so separate follow-ups remain visible while composing. */
 	decorateText = (text: string): string => {
-		const animated = this.focused && this.#shimmerEnabled() && hasMagicKeyword(this.getText());
+		const editorText = this.getText();
+		const animated = this.focused && this.#shimmerEnabled() && hasMagicKeyword(editorText);
 		const phase = animated ? (Date.now() % CustomEditor.SHIMMER_PERIOD_MS) / CustomEditor.SHIMMER_PERIOD_MS : 0;
 		if (animated) this.#scheduleShimmerFrame();
+		if (this.#queueDecorationText !== editorText) {
+			this.#queueDecorationText = editorText;
+			const queueBody = parseQueueShorthand(editorText);
+			this.#queueShorthandActive = queueBody !== undefined;
+			this.#queueListActive = queueBody !== undefined && isQueuedMessageList(queueBody);
+		}
 		return renderPlaceholders(text, {
-			renderText: value => highlightMagicKeywords(value, undefined, phase),
+			renderText: value => {
+				const highlighted = highlightMagicKeywords(value, undefined, phase);
+				if (this.#queueShorthandActive && (value.startsWith("->") || value.startsWith("=>"))) {
+					const icon = typeof theme === "undefined" ? "➤" : theme.nav.selected;
+					return `${fgOrPlain("dim", `Queueing ${icon}`)}${highlighted.slice(2)}`;
+				}
+				if (this.#queueListActive) {
+					const markerMatch = QUEUE_LIST_MARKER_RE.exec(value);
+					if (markerMatch) {
+						const indent = markerMatch[1] ?? "";
+						const markerEnd = markerMatch[0].length;
+						return `${indent}${fgOrPlain("accent", value.slice(indent.length, markerEnd))}${highlighted.slice(markerEnd)}`;
+					}
+				}
+				return highlighted;
+			},
 			renderReference: (value, kind, index) =>
 				kind === "image"
 					? imageReferenceHyperlink(value, index, this.imageLinks, label =>
@@ -628,6 +649,7 @@ export class CustomEditor extends Editor {
 			this.#pendingInput.push(data);
 			return;
 		}
+		const hadBareQueuePrefix = this.getText() === "->" || this.getText() === "=>";
 		const kittyParsed = parseKittySequence(data);
 		if (kittyParsed && (kittyParsed.modifier & 64) !== 0 && this.onCapsLock) {
 			// Caps Lock is modifier bit 64
@@ -831,5 +853,14 @@ export class CustomEditor extends Editor {
 
 		// Pass to parent for normal handling
 		super.handleInput(data);
+		const cursor = this.getCursor();
+		if (
+			!hadBareQueuePrefix &&
+			(this.getText() === "->" || this.getText() === "=>") &&
+			cursor.line === 0 &&
+			cursor.col === 2
+		) {
+			this.insertText("\n");
+		}
 	}
 }

package/src/modes/components/index.ts

@@ -18,7 +18,8 @@ export * from "./hook-selector";
 export * from "./keybinding-hints";
 export * from "./login-dialog";
 export * from "./logout-account-selector";
-export * from "./model-selector";
+export * from "./model-browser";
+export * from "./model-hub";
 export * from "./oauth-selector";
 export * from "./queue-mode-selector";
 export * from "./read-tool-group";