@oh-my-pi/pi-coding-agent 15.10.0 → 15.10.2

package/src/modes/components/assistant-message.ts

@@ -4,7 +4,7 @@ import { formatNumber } from "@oh-my-pi/pi-utils";
 import { settings } from "../../config/settings";
 import type { AssistantThinkingRenderer } from "../../extensibility/extensions/types";
 import { getMarkdownTheme, theme } from "../../modes/theme/theme";
-import { isSilentAbort } from "../../session/messages";
+import { isSilentAbort, resolveAbortLabel } from "../../session/messages";
 import { resolveImageOptions } from "../../tools/render-utils";
 
 /**
@@ -208,10 +208,6 @@ export class AssistantMessageComponent extends Container {
 			c => (c.type === "text" && c.text.trim()) || (c.type === "thinking" && c.thinking.trim()),
 		);
 
-		if (hasVisibleContent) {
-			this.#contentContainer.addChild(new Spacer(1));
-		}
-
 		// Render content in order
 		let thinkingIndex = 0;
 		for (let i = 0; i < message.content.length; i++) {
@@ -257,10 +253,7 @@ export class AssistantMessageComponent extends Container {
 		const hasToolCalls = message.content.some(c => c.type === "toolCall");
 		if (!hasToolCalls) {
 			if (message.stopReason === "aborted" && !isSilentAbort(message.errorMessage)) {
-				const abortMessage =
-					message.errorMessage && message.errorMessage !== "Request was aborted"
-						? message.errorMessage
-						: "Operation aborted";
+				const abortMessage = resolveAbortLabel(message.errorMessage);
 				if (hasVisibleContent) {
 					this.#contentContainer.addChild(new Spacer(1));
 				} else {

package/src/modes/components/chat-block.ts

@@ -0,0 +1,111 @@
+import { Container } from "@oh-my-pi/pi-tui";
+
+/**
+ * Capabilities a mounted {@link ChatBlock} may use against its host transcript.
+ * Kept minimal so blocks never reach into the full TUI/InteractiveMode surface.
+ */
+export interface ChatBlockHost {
+	/** Schedule a repaint of the transcript. */
+	requestRender(): void;
+}
+
+/**
+ * Lifecycle-aware transcript block — the "return a block, let the host mount it"
+ * primitive, modelled on React/Svelte component lifecycles.
+ *
+ * Producers build and return a `ChatBlock` instead of poking `chatContainer` and
+ * `ui.requestRender()` directly. The host (`ctx.present`) appends it and calls
+ * {@link mount}, which runs {@link onMount}; effects started there register
+ * teardown via {@link onCleanup}. The block repaints through {@link requestRender}
+ * — never touching the TUI — and tears down exactly once on {@link finish}
+ * (self-complete: stop the animation, keep the final frame in the transcript) or
+ * {@link dispose} (host discards it, e.g. a transcript reset).
+ *
+ * While mounted and unfinished a block reports `isTranscriptBlockFinalized() ===
+ * false` so {@link "../components/transcript-container".TranscriptContainer}
+ * keeps it in the live, repaintable region on ED3-risk terminals; after
+ * `finish()`/`dispose()` it reports `true` and freezes at its final content.
+ */
+export abstract class ChatBlock extends Container {
+	#host: ChatBlockHost | undefined;
+	#cleanups: Array<() => void> = [];
+	#active = false;
+	#disposed = false;
+
+	/**
+	 * Run setup after the block is in the transcript: start timers/subscriptions
+	 * and register their teardown with {@link onCleanup}. Default: no-op (a block
+	 * whose content is fixed at construction needs no mount work).
+	 */
+	protected onMount(): void {}
+
+	/**
+	 * Register a teardown to run on {@link finish}/{@link dispose}, à la a
+	 * `useEffect` cleanup. If the block is already disposed the cleanup runs
+	 * immediately so callers never leak.
+	 */
+	protected onCleanup(cleanup: () => void): void {
+		if (this.#disposed) {
+			cleanup();
+			return;
+		}
+		this.#cleanups.push(cleanup);
+	}
+
+	/** Ask the host to repaint. No-op before mount or after dispose. */
+	protected requestRender(): void {
+		this.#host?.requestRender();
+	}
+
+	/** True between {@link mount} and {@link finish}/{@link dispose}. */
+	protected get active(): boolean {
+		return this.#active;
+	}
+
+	/**
+	 * Host-only: attach the host and run {@link onMount}. Idempotent — a second
+	 * call (e.g. a transcript rebuild that re-presents the same instance) is a
+	 * no-op.
+	 */
+	mount(host: ChatBlockHost): void {
+		if (this.#host || this.#disposed) return;
+		this.#host = host;
+		this.#active = true;
+		this.onMount();
+	}
+
+	/**
+	 * Self-complete: stop ongoing effects and freeze the block at its current
+	 * content, leaving it rendered in the transcript. Use when the operation the
+	 * block represents finishes (connection resolved, download done).
+	 */
+	finish(): void {
+		if (!this.#active) return;
+		this.#active = false;
+		this.#runCleanups();
+		this.requestRender();
+	}
+
+	/**
+	 * Host-only teardown: release everything and propagate to children. Called
+	 * when the host permanently discards the block (transcript reset). Idempotent.
+	 */
+	override dispose(): void {
+		if (this.#disposed) return;
+		this.#disposed = true;
+		this.#active = false;
+		this.#runCleanups();
+		super.dispose();
+		this.#host = undefined;
+	}
+
+	/** Live blocks stay repaintable; finished/disposed ones may freeze. */
+	isTranscriptBlockFinalized(): boolean {
+		return !this.#active;
+	}
+
+	#runCleanups(): void {
+		const cleanups = this.#cleanups.splice(0);
+		for (const cleanup of cleanups) cleanup();
+	}
+}

package/src/modes/components/copy-selector.ts

@@ -10,6 +10,7 @@ import {
 	matchesSelectUp,
 } from "../utils/keybinding-matchers";
 import { keyHint, rawKeyHint } from "./keybinding-hints";
+import { bottomBorder, divider, row, topBorder } from "./overlay-box";
 
 /** Minimum rows reserved for the tree even on short terminals. */
 const MIN_TREE_ROWS = 3;
@@ -32,50 +33,6 @@ interface FlatNode {
 	ancestorHasNext: boolean[];
 }
 
-/** Pad or truncate a (possibly ANSI-styled) string to exactly `width` columns. */
-function fit(text: string, width: number): string {
-	if (width <= 0) return "";
-	const w = visibleWidth(text);
-	if (w === width) return text;
-	if (w < width) return text + padding(width - w);
-	const cut = truncateToWidth(text, width);
-	const cw = visibleWidth(cut);
-	return cw < width ? cut + padding(width - cw) : cut;
-}
-
-function paint(s: string): string {
-	return theme.fg("border", s);
-}
-
-function topBorder(width: number, title: string): string {
-	const box = theme.boxSharp;
-	const inner = Math.max(0, width - 2);
-	if (!title) return paint(box.topLeft + box.horizontal.repeat(inner) + box.topRight);
-	const shown = truncateToWidth(` ${title} `, Math.max(0, inner - 2));
-	const fillWidth = Math.max(0, inner - 1 - visibleWidth(shown));
-	return (
-		paint(box.topLeft + box.horizontal) +
-		theme.bold(theme.fg("accent", shown)) +
-		paint(box.horizontal.repeat(fillWidth) + box.topRight)
-	);
-}
-
-function divider(width: number): string {
-	const box = theme.boxSharp;
-	return paint(box.teeRight + box.horizontal.repeat(Math.max(0, width - 2)) + box.teeLeft);
-}
-
-function bottomBorder(width: number): string {
-	const box = theme.boxSharp;
-	return paint(box.bottomLeft + box.horizontal.repeat(Math.max(0, width - 2)) + box.bottomRight);
-}
-
-/** Wrap pre-styled content in vertical borders with single-column insets. */
-function row(content: string, width: number): string {
-	const box = theme.boxSharp;
-	return `${paint(box.vertical)} ${fit(content, Math.max(0, width - 4))} ${paint(box.vertical)}`;
-}
-
 /** Render one tree connector as exactly three cells (e.g. "├─ ", "└─ ", "|--"). */
 function connectorCells(symbol: string): string {
 	const chars = Array.from(symbol);

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

@@ -1,4 +1,4 @@
-import { Editor, type KeyId, matchesKey, parseKittySequence } from "@oh-my-pi/pi-tui";
+import { addKeyAliases, canonicalKeyId, Editor, type KeyId, parseKey, parseKittySequence } from "@oh-my-pi/pi-tui";
 import type { AppKeybinding } from "../../config/keybindings";
 import { imageReferenceHyperlink, renderImageReferences } from "../image-references";
 import { highlightMagicKeywords } from "../magic-keywords";
@@ -47,13 +47,36 @@ const DEFAULT_ACTION_KEYS: Record<ConfigurableEditorAction, KeyId[]> = {
 	"app.clipboard.copyPrompt": ["alt+shift+c"],
 };
 
+function buildMatchKeys(keys: readonly KeyId[]): Set<string> {
+	const matchKeys = new Set<string>();
+	for (const key of keys) {
+		addKeyAliases(matchKeys, key);
+	}
+	return matchKeys;
+}
+
+const BRACKETED_PASTE_START = "\x1b[200~";
+const BRACKETED_PASTE_END = "\x1b[201~";
+const BRACKETED_IMAGE_PATH_REGEX = /\.(?:png|jpe?g|gif|webp)$/i;
+
+export function extractBracketedImagePastePath(data: string): string | undefined {
+	if (!data.startsWith(BRACKETED_PASTE_START)) return undefined;
+	const endIndex = data.indexOf(BRACKETED_PASTE_END, BRACKETED_PASTE_START.length);
+	if (endIndex === -1 || endIndex + BRACKETED_PASTE_END.length !== data.length) return undefined;
+
+	const pasted = data.slice(BRACKETED_PASTE_START.length, endIndex).trim();
+	if (!pasted || /[\r\n]/.test(pasted)) return undefined;
+	if (!BRACKETED_IMAGE_PATH_REGEX.test(pasted)) return undefined;
+	return pasted;
+}
+
 /**
  * Custom editor that handles configurable app-level shortcuts for coding-agent.
  */
 export class CustomEditor extends Editor {
 	imageLinks?: readonly (string | undefined)[];
 
-	/** Gradient-highlight the "ultrathink" / "orchestrate" / "workflow" keywords as the user types
+	/** 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. */
 	decorateText = (text: string): string =>
@@ -82,6 +105,8 @@ export class CustomEditor extends Editor {
 	onCopyPrompt?: () => void;
 	/** Called when the configured image-paste shortcut is pressed. */
 	onPasteImage?: () => Promise<boolean>;
+	/** Called when a bracketed paste contains exactly one image-file path. */
+	onPasteImagePath?: (path: string) => void;
 	/** Called when the configured raw text-paste shortcut is pressed. */
 	onPasteTextRaw?: () => void;
 	/** Called when the configured dequeue shortcut is pressed. */
@@ -91,21 +116,38 @@ export class CustomEditor extends Editor {
 
 	/** Custom key handlers from extensions and non-built-in app actions. */
 	#customKeyHandlers = new Map<KeyId, () => void>();
+	#customMatchKeys = new Map<string, () => void>();
 	#actionKeys = new Map<ConfigurableEditorAction, KeyId[]>(
 		Object.entries(DEFAULT_ACTION_KEYS).map(([action, keys]) => [action as ConfigurableEditorAction, [...keys]]),
 	);
+	#actionMatchKeys = new Map<ConfigurableEditorAction, Set<string>>(
+		Object.entries(DEFAULT_ACTION_KEYS).map(([action, keys]) => [
+			action as ConfigurableEditorAction,
+			buildMatchKeys(keys),
+		]),
+	);
 
 	setActionKeys(action: ConfigurableEditorAction, keys: KeyId[]): void {
 		this.#actionKeys.set(action, [...keys]);
+		this.#rebuildActionMatchKeys(action);
 	}
 
-	#matchesAction(data: string, action: ConfigurableEditorAction): boolean {
-		const keys = this.#actionKeys.get(action);
-		if (!keys) return false;
-		for (const key of keys) {
-			if (matchesKey(data, key)) return true;
+	#rebuildActionMatchKeys(action: ConfigurableEditorAction): void {
+		this.#actionMatchKeys.set(action, buildMatchKeys(this.#actionKeys.get(action) ?? []));
+	}
+
+	#rebuildCustomMatchKeys(): void {
+		this.#customMatchKeys.clear();
+		for (const [keyId, handler] of this.#customKeyHandlers) {
+			for (const alias of buildMatchKeys([keyId])) {
+				// Preserve current iteration behavior: the first registered handler for colliding aliases wins.
+				if (!this.#customMatchKeys.has(alias)) this.#customMatchKeys.set(alias, handler);
+			}
 		}
-		return false;
+	}
+
+	#matchesAction(canonical: string | undefined, action: ConfigurableEditorAction): boolean {
+		return canonical !== undefined && (this.#actionMatchKeys.get(action)?.has(canonical) ?? false);
 	}
 
 	/**
@@ -113,6 +155,7 @@ export class CustomEditor extends Editor {
 	 */
 	setCustomKeyHandler(key: KeyId, handler: () => void): void {
 		this.#customKeyHandlers.set(key, handler);
+		this.#rebuildCustomMatchKeys();
 	}
 
 	/**
@@ -120,6 +163,7 @@ export class CustomEditor extends Editor {
 	 */
 	removeCustomKeyHandler(key: KeyId): void {
 		this.#customKeyHandlers.delete(key);
+		this.#rebuildCustomMatchKeys();
 	}
 
 	/**
@@ -127,135 +171,146 @@ export class CustomEditor extends Editor {
 	 */
 	clearCustomKeyHandlers(): void {
 		this.#customKeyHandlers.clear();
+		this.#rebuildCustomMatchKeys();
 	}
 
 	handleInput(data: string): void {
-		const parsed = parseKittySequence(data);
-		if (parsed && (parsed.modifier & 64) !== 0 && this.onCapsLock) {
+		const kittyParsed = parseKittySequence(data);
+		if (kittyParsed && (kittyParsed.modifier & 64) !== 0 && this.onCapsLock) {
 			// Caps Lock is modifier bit 64
 			this.onCapsLock();
 			return;
 		}
 
-		// Intercept configured image paste (async - fires and handles result)
-		if (this.#matchesAction(data, "app.clipboard.pasteImage") && this.onPasteImage) {
-			void this.onPasteImage();
+		const pastedImagePath = extractBracketedImagePastePath(data);
+		if (pastedImagePath && this.onPasteImagePath) {
+			this.onPasteImagePath(pastedImagePath);
 			return;
 		}
 
-		// Intercept configured raw text paste (fires and handles result)
-		if (this.#matchesAction(data, "app.clipboard.pasteTextRaw") && this.onPasteTextRaw) {
-			this.onPasteTextRaw();
-			return;
-		}
+		const parsedKey = parseKey(data);
+		const canonical = parsedKey !== undefined ? canonicalKeyId(parsedKey) : undefined;
 
-		// Intercept configured external editor shortcut
-		if (this.#matchesAction(data, "app.editor.external") && this.onExternalEditor) {
-			this.onExternalEditor();
-			return;
-		}
+		if (canonical !== undefined) {
+			// Intercept configured image paste (async - fires and handles result)
+			if (this.#matchesAction(canonical, "app.clipboard.pasteImage") && this.onPasteImage) {
+				void this.onPasteImage();
+				return;
+			}
 
-		// Intercept configured temporary model selector shortcut
-		if (this.#matchesAction(data, "app.model.selectTemporary") && this.onSelectModelTemporary) {
-			this.onSelectModelTemporary();
-			return;
-		}
+			// Intercept configured raw text paste (fires and handles result)
+			if (this.#matchesAction(canonical, "app.clipboard.pasteTextRaw") && this.onPasteTextRaw) {
+				this.onPasteTextRaw();
+				return;
+			}
 
-		// Intercept configured display reset shortcut
-		if (this.#matchesAction(data, "app.display.reset") && this.onDisplayReset) {
-			this.onDisplayReset();
-			return;
-		}
+			// Intercept configured external editor shortcut
+			if (this.#matchesAction(canonical, "app.editor.external") && this.onExternalEditor) {
+				this.onExternalEditor();
+				return;
+			}
 
-		// Intercept configured suspend shortcut
-		if (this.#matchesAction(data, "app.suspend") && this.onSuspend) {
-			this.onSuspend();
-			return;
-		}
+			// Intercept configured temporary model selector shortcut
+			if (this.#matchesAction(canonical, "app.model.selectTemporary") && this.onSelectModelTemporary) {
+				this.onSelectModelTemporary();
+				return;
+			}
 
-		// Intercept configured thinking block visibility toggle
-		if (this.#matchesAction(data, "app.thinking.toggle") && this.onToggleThinking) {
-			this.onToggleThinking();
-			return;
-		}
+			// Intercept configured display reset shortcut
+			if (this.#matchesAction(canonical, "app.display.reset") && this.onDisplayReset) {
+				this.onDisplayReset();
+				return;
+			}
 
-		// Intercept configured model selector shortcut
-		if (this.#matchesAction(data, "app.model.select") && this.onSelectModel) {
-			this.onSelectModel();
-			return;
-		}
+			// Intercept configured suspend shortcut
+			if (this.#matchesAction(canonical, "app.suspend") && this.onSuspend) {
+				this.onSuspend();
+				return;
+			}
 
-		// Intercept configured history search shortcut
-		if (this.#matchesAction(data, "app.history.search") && this.onHistorySearch) {
-			this.onHistorySearch();
-			return;
-		}
+			// Intercept configured thinking block visibility toggle
+			if (this.#matchesAction(canonical, "app.thinking.toggle") && this.onToggleThinking) {
+				this.onToggleThinking();
+				return;
+			}
 
-		// Intercept configured tool output expansion shortcut
-		if (this.#matchesAction(data, "app.tools.expand") && this.onExpandTools) {
-			this.onExpandTools();
-			return;
-		}
+			// Intercept configured model selector shortcut
+			if (this.#matchesAction(canonical, "app.model.select") && this.onSelectModel) {
+				this.onSelectModel();
+				return;
+			}
 
-		// Intercept configured backward model cycling (check before forward cycling)
-		if (this.#matchesAction(data, "app.model.cycleBackward") && this.onCycleModelBackward) {
-			this.onCycleModelBackward();
-			return;
-		}
+			// Intercept configured history search shortcut
+			if (this.#matchesAction(canonical, "app.history.search") && this.onHistorySearch) {
+				this.onHistorySearch();
+				return;
+			}
 
-		// Intercept configured forward model cycling
-		if (this.#matchesAction(data, "app.model.cycleForward") && this.onCycleModelForward) {
-			this.onCycleModelForward();
-			return;
-		}
+			// Intercept configured tool output expansion shortcut
+			if (this.#matchesAction(canonical, "app.tools.expand") && this.onExpandTools) {
+				this.onExpandTools();
+				return;
+			}
 
-		// Intercept configured thinking level cycling
-		if (this.#matchesAction(data, "app.thinking.cycle") && this.onCycleThinkingLevel) {
-			this.onCycleThinkingLevel();
-			return;
-		}
+			// Intercept configured backward model cycling (check before forward cycling)
+			if (this.#matchesAction(canonical, "app.model.cycleBackward") && this.onCycleModelBackward) {
+				this.onCycleModelBackward();
+				return;
+			}
 
-		// Intercept configured interrupt shortcut.
-		// When the autocomplete popup is visible, ESC's first job is to dismiss
-		// the popup — let super.handleInput() route it to #cancelAutocomplete().
-		// The user can press ESC again afterward to fire the global interrupt
-		// handler. This matches the standard TUI/IDE pattern and prevents a
-		// single ESC from both closing an @ completion and aborting an active
-		// agent run (#1655).
-		if (this.#matchesAction(data, "app.interrupt") && this.onEscape && !this.isShowingAutocomplete()) {
-			this.onEscape();
-			return;
-		}
+			// Intercept configured forward model cycling
+			if (this.#matchesAction(canonical, "app.model.cycleForward") && this.onCycleModelForward) {
+				this.onCycleModelForward();
+				return;
+			}
 
-		// Intercept configured clear shortcut
-		if (this.#matchesAction(data, "app.clear") && this.onClear) {
-			this.onClear();
-			return;
-		}
+			// Intercept configured thinking level cycling
+			if (this.#matchesAction(canonical, "app.thinking.cycle") && this.onCycleThinkingLevel) {
+				this.onCycleThinkingLevel();
+				return;
+			}
 
-		// Intercept configured exit shortcut. Always consume the shortcut so it
-		// never reaches the parent handler; firing onExit is the controller's
-		// chance to snapshot the current text as a draft before shutting down.
-		if (this.#matchesAction(data, "app.exit")) {
-			this.onExit?.();
-			return;
-		}
+			// Intercept configured interrupt shortcut.
+			// When the autocomplete popup is visible, ESC's first job is to dismiss
+			// the popup — let super.handleInput() route it to #cancelAutocomplete().
+			// The user can press ESC again afterward to fire the global interrupt
+			// handler. This matches the standard TUI/IDE pattern and prevents a
+			// single ESC from both closing an @ completion and aborting an active
+			// agent run (#1655).
+			if (this.#matchesAction(canonical, "app.interrupt") && this.onEscape && !this.isShowingAutocomplete()) {
+				this.onEscape();
+				return;
+			}
 
-		// Intercept configured dequeue shortcut (restore queued message to editor)
-		if (this.#matchesAction(data, "app.message.dequeue") && this.onDequeue) {
-			this.onDequeue();
-			return;
-		}
+			// Intercept configured clear shortcut
+			if (this.#matchesAction(canonical, "app.clear") && this.onClear) {
+				this.onClear();
+				return;
+			}
 
-		// Intercept configured copy-prompt shortcut
-		if (this.#matchesAction(data, "app.clipboard.copyPrompt") && this.onCopyPrompt) {
-			this.onCopyPrompt();
-			return;
-		}
+			// Intercept configured exit shortcut. Always consume the shortcut so it
+			// never reaches the parent handler; firing onExit is the controller's
+			// chance to snapshot the current text as a draft before shutting down.
+			if (this.#matchesAction(canonical, "app.exit")) {
+				this.onExit?.();
+				return;
+			}
 
-		// Check custom key handlers (extensions)
-		for (const [keyId, handler] of this.#customKeyHandlers) {
-			if (matchesKey(data, keyId)) {
+			// Intercept configured dequeue shortcut (restore queued message to editor)
+			if (this.#matchesAction(canonical, "app.message.dequeue") && this.onDequeue) {
+				this.onDequeue();
+				return;
+			}
+
+			// Intercept configured copy-prompt shortcut
+			if (this.#matchesAction(canonical, "app.clipboard.copyPrompt") && this.onCopyPrompt) {
+				this.onCopyPrompt();
+				return;
+			}
+
+			// Check custom key handlers (extensions)
+			const handler = this.#customMatchKeys.get(canonical);
+			if (handler) {
 				handler();
 				return;
 			}

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

@@ -1,5 +1,5 @@
 import type { Component } from "@oh-my-pi/pi-tui";
-import { Box, Container, Spacer } from "@oh-my-pi/pi-tui";
+import { Box, Container } from "@oh-my-pi/pi-tui";
 import type { MessageRenderer } from "../../extensibility/extensions/types";
 import { theme } from "../../modes/theme/theme";
 import type { CustomMessage } from "../../session/messages";
@@ -20,8 +20,6 @@ export class CustomMessageComponent extends Container {
 	) {
 		super();
 
-		this.addChild(new Spacer(1));
-
 		// Create box with custom background (used for default rendering)
 		this.#box = new Box(1, 1, t => theme.bg("customMessageBg", t));
 

package/src/modes/components/execution-shared.ts

@@ -7,7 +7,7 @@
  * stay in their respective files.
  */
 
-import { type Component, Container, Loader, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
+import { type Component, Container, Loader, Text, type TUI } from "@oh-my-pi/pi-tui";
 import { getSymbolTheme, theme } from "../../modes/theme/theme";
 import { formatTruncationMetaNotice, type TruncationMeta } from "../../tools/output-meta";
 import { DynamicBorder } from "./dynamic-border";
@@ -31,7 +31,6 @@ export function buildExecutionFrame(
 ): { contentContainer: Container; loader: Loader } {
 	const borderColor = (str: string) => theme.fg(colorKey, str);
 
-	parent.addChild(new Spacer(1));
 	parent.addChild(new DynamicBorder(borderColor));
 
 	const contentContainer = new Container();

package/src/modes/components/hook-message.ts

@@ -1,5 +1,5 @@
 import type { Component } from "@oh-my-pi/pi-tui";
-import { Box, Container, Spacer } from "@oh-my-pi/pi-tui";
+import { Box, Container } from "@oh-my-pi/pi-tui";
 import type { HookMessageRenderer } from "../../extensibility/hooks/types";
 import { theme } from "../../modes/theme/theme";
 import type { HookMessage } from "../../session/messages";
@@ -23,8 +23,6 @@ export class HookMessageComponent extends Container {
 	) {
 		super();
 
-		this.addChild(new Spacer(1));
-
 		// Create box with purple background (used for default rendering)
 		this.#box = new Box(1, 1, t => theme.bg("customMessageBg", t));