pi-cc-extensions 0.8.9 → 0.8.11

package/extensions/ask-user-question/view/components/preview/preview-layout-decider.ts

@@ -1,7 +1,10 @@
 import { visibleWidth } from "@earendil-works/pi-tui";
 import type { QuestionData } from "../../../tool/types.js";
 import type { WrappingSelectItem } from "../wrapping-select.js";
-import { BORDER_HORIZONTAL_OVERHEAD, BORDER_INNER_PADDING_HORIZONTAL } from "./preview-box-renderer.js";
+import {
+	BORDER_HORIZONTAL_OVERHEAD,
+	BORDER_INNER_PADDING_HORIZONTAL,
+} from "./preview-box-renderer.js";
 
 /** Min terminal/pane width for the side-by-side layout to engage. */
 export const PREVIEW_MIN_WIDTH = 100;
@@ -34,7 +37,9 @@ export type PreviewLayoutMode = "side-by-side" | "stacked";
  * capping height too short.
  */
 export function decideLayout(terminalWidth: number, paneWidth: number): PreviewLayoutMode {
-	return terminalWidth >= PREVIEW_MIN_WIDTH && paneWidth >= PREVIEW_MIN_WIDTH ? "side-by-side" : "stacked";
+	return terminalWidth >= PREVIEW_MIN_WIDTH && paneWidth >= PREVIEW_MIN_WIDTH
+		? "side-by-side"
+		: "stacked";
 }
 
 /**
@@ -120,12 +125,19 @@ export function previewSourceWidth(question: QuestionData): number {
  *
  * Pure function — same cross-tab max pattern as `crossTabMaxLeftWidth`.
  */
-export function crossTabPreviewBudget(questions: readonly QuestionData[], paneWidth: number): number {
+export function crossTabPreviewBudget(
+	questions: readonly QuestionData[],
+	paneWidth: number,
+): number {
 	let max = MIN_PREVIEW_WIDTH;
 	for (const question of questions) {
 		const rawWidth = previewSourceWidth(question);
 		const capped = Math.min(rawWidth, paneWidth - PREVIEW_COLUMN_GAP - MIN_LEFT);
-		const budget = capped + BORDER_HORIZONTAL_OVERHEAD + 2 * BORDER_INNER_PADDING_HORIZONTAL + PREVIEW_PADDING_LEFT;
+		const budget =
+			capped +
+			BORDER_HORIZONTAL_OVERHEAD +
+			2 * BORDER_INNER_PADDING_HORIZONTAL +
+			PREVIEW_PADDING_LEFT;
 		if (budget > max) max = budget;
 	}
 	return max;

package/extensions/ask-user-question/view/components/preview/preview-pane.ts

@@ -168,7 +168,11 @@ export class PreviewPane implements StatefulView<PreviewPaneProps>, Component {
 		const adaptiveLeft = this.getAdaptiveLeft(width);
 		const { optionsWidth, previewWidth } = bodyWidths(width, mode, adaptiveLeft);
 		const optionsHeight = this.optionListView.render(optionsWidth).length;
-		const previewBlockHeight = this.previewBlock.blockHeight(previewWidth, this.props.selectedIndex, mode);
+		const previewBlockHeight = this.previewBlock.blockHeight(
+			previewWidth,
+			this.props.selectedIndex,
+			mode,
+		);
 		if (mode === "side-by-side") return Math.max(optionsHeight, previewBlockHeight);
 		return optionsHeight + STACKED_GAP_ROWS + previewBlockHeight;
 	}

package/extensions/ask-user-question/view/components/submit-picker.ts

@@ -56,7 +56,9 @@ export class SubmitPicker implements StatefulView<SubmitPickerProps> {
 			const active = this.props.rows[i]?.active ?? false;
 			const pointer = active ? ACTIVE_POINTER : INACTIVE_POINTER;
 			const number = `${i + 1}${NUMBER_SEPARATOR}`;
-			const label = active ? this.theme.fg("accent", this.theme.bold(text)) : this.theme.fg("text", text);
+			const label = active
+				? this.theme.fg("accent", this.theme.bold(text))
+				: this.theme.fg("text", text);
 			lines.push(truncateToWidth(`${pointer}${number}${label}`, width, ""));
 		}
 		return lines;

package/extensions/ask-user-question/view/components/wrapping-select.ts

@@ -192,7 +192,10 @@ export class WrappingSelect implements Component {
 
 	private computeVisibleWindow(): { startIndex: number; endIndex: number } {
 		const half = Math.floor(this.maxVisible / 2);
-		const startIndex = Math.max(0, Math.min(this.selectedIndex - half, this.items.length - this.maxVisible));
+		const startIndex = Math.max(
+			0,
+			Math.min(this.selectedIndex - half, this.items.length - this.maxVisible),
+		);
 		const endIndex = Math.min(startIndex + this.maxVisible, this.items.length);
 		return { startIndex, endIndex };
 	}
@@ -210,7 +213,10 @@ export class WrappingSelect implements Component {
 	): string[] {
 		const rowPrefix = this.buildRowPrefix(index, isActive, numberWidth);
 		const continuationPrefix = " ".repeat(visibleWidth(rowPrefix));
-		const contentWidth = Math.max(WrappingSelect.MIN_CONTENT_WIDTH, width - visibleWidth(rowPrefix));
+		const contentWidth = Math.max(
+			WrappingSelect.MIN_CONTENT_WIDTH,
+			width - visibleWidth(rowPrefix),
+		);
 
 		if (this.shouldRenderAsInlineInput(item, isActive)) {
 			return this.renderInlineInputRow(rowPrefix, continuationPrefix, contentWidth);
@@ -229,7 +235,13 @@ export class WrappingSelect implements Component {
 		const applySelectedStyle = isActive || isConfirmed;
 
 		return [
-			...this.renderLabelBlock(label, rowPrefix, continuationPrefix, contentWidth, applySelectedStyle),
+			...this.renderLabelBlock(
+				label,
+				rowPrefix,
+				continuationPrefix,
+				contentWidth,
+				applySelectedStyle,
+			),
 			...this.renderDescriptionBlock(item.description, continuationPrefix, contentWidth),
 		];
 	}
@@ -252,7 +264,11 @@ export class WrappingSelect implements Component {
 	 * building core. The `multiline: true` path is byte-identical to the pre-extraction
 	 * output (cursor rationale lives in `inline-input.ts`).
 	 */
-	private renderInlineInputRow(rowPrefix: string, continuationPrefix: string, contentWidth: number): string[] {
+	private renderInlineInputRow(
+		rowPrefix: string,
+		continuationPrefix: string,
+		contentWidth: number,
+	): string[] {
 		return renderInlineInputRow({
 			buffer: this.inputBuffer,
 			cursorOffset: this.inputCursorOffset,

package/extensions/ask-user-question/view/dialog-builder.ts

@@ -6,7 +6,11 @@ import type { PreviewPaneProps } from "./components/preview/preview-pane.js";
 import type { TabBar } from "./components/tab-bar.js";
 import type { StatefulView } from "./stateful-view.js";
 import type { TabComponents } from "./tab-components.js";
-import { QuestionTabStrategy, SubmitTabStrategy, type TabContentStrategy } from "./tab-content-strategy.js";
+import {
+	QuestionTabStrategy,
+	SubmitTabStrategy,
+	type TabContentStrategy,
+} from "./tab-content-strategy.js";
 
 export const HINT_PART_ENTER = "Enter to select";
 export const HINT_PART_NAV = "↑/↓ to navigate";
@@ -27,10 +31,16 @@ export const HINT_PART_EXPAND = "Ctrl+] to expand";
  * prefix substring of the rendered line. On narrow terminals the collapse tail
  * clips with `…` (`OneLineClippedText`); the core is preserved.
  */
-export const HINT_SINGLE = [HINT_PART_ENTER, HINT_PART_NAV, HINT_PART_NOTES, HINT_PART_CANCEL].join(" · ");
-export const HINT_MULTI = [HINT_PART_ENTER, HINT_PART_NAV, HINT_PART_NOTES, HINT_PART_TAB, HINT_PART_CANCEL].join(
+export const HINT_SINGLE = [HINT_PART_ENTER, HINT_PART_NAV, HINT_PART_NOTES, HINT_PART_CANCEL].join(
 	" · ",
 );
+export const HINT_MULTI = [
+	HINT_PART_ENTER,
+	HINT_PART_NAV,
+	HINT_PART_NOTES,
+	HINT_PART_TAB,
+	HINT_PART_CANCEL,
+].join(" · ");
 /** Single-line footer shown by `QuestionnaireSession` when `state.collapsed === true`. Bypasses `buildHintText`. */
 export const COLLAPSED_HINT = [HINT_PART_EXPAND, HINT_PART_CANCEL].join(" · ");
 export const REVIEW_HEADING = "Review your answers";
@@ -137,7 +147,10 @@ export class DialogView implements StatefulView<DialogProps> {
 		const availableMiddle = Math.max(0, termRows - topFixed - bottomFixed);
 		if (availableMiddle === 0) {
 			// Terminal too small for any middle content — show just chrome.
-			const chromeOnly = [...natural.slice(0, topFixed), ...natural.slice(natural.length - bottomFixed)];
+			const chromeOnly = [
+				...natural.slice(0, topFixed),
+				...natural.slice(natural.length - bottomFixed),
+			];
 			return chromeOnly.length > termRows ? chromeOnly.slice(0, termRows) : chromeOnly;
 		}
 
@@ -149,14 +162,18 @@ export class DialogView implements StatefulView<DialogProps> {
 			const focusedRowInMiddle = headingCount + bodyRange[0];
 			const focusedHeight = bodyRange[1] - bodyRange[0];
 			// Center the focused item vertically in the available middle space.
-			const idealStart = focusedRowInMiddle - Math.floor(Math.max(0, availableMiddle - focusedHeight) / 2);
+			const idealStart =
+				focusedRowInMiddle - Math.floor(Math.max(0, availableMiddle - focusedHeight) / 2);
 			scrollStart = Math.max(0, Math.min(idealStart, middleRows - availableMiddle));
 		} else {
 			// No interactive focus (submit tab) — top-anchor the middle.
 			scrollStart = 0;
 		}
 
-		const scrollableMiddle = natural.slice(topFixed + scrollStart, topFixed + scrollStart + availableMiddle);
+		const scrollableMiddle = natural.slice(
+			topFixed + scrollStart,
+			topFixed + scrollStart + availableMiddle,
+		);
 
 		const hasUp = scrollStart > 0;
 		const hasDown = scrollStart + availableMiddle < middleRows;
@@ -182,7 +199,10 @@ export class DialogView implements StatefulView<DialogProps> {
 		return result.length > termRows ? result.slice(0, termRows) : result;
 	}
 
-	private buildContainerFromStrategy(strategy: TabContentStrategy, headingRowCache: Component[]): Container {
+	private buildContainerFromStrategy(
+		strategy: TabContentStrategy,
+		headingRowCache: Component[],
+	): Container {
 		const { theme, isMulti, tabBar } = this.config;
 		const state = this.liveProps.state;
 		const container = new Container();

package/extensions/ask-user-question/view/tab-content-strategy.ts

@@ -1,5 +1,12 @@
 import type { Theme } from "@earendil-works/pi-coding-agent";
-import { type Component, Container, type Input, Spacer, Text, truncateToWidth } from "@earendil-works/pi-tui";
+import {
+	type Component,
+	Container,
+	type Input,
+	Spacer,
+	Text,
+	truncateToWidth,
+} from "@earendil-works/pi-tui";
 import { formatAnswerScalar } from "../tool/format-answer.js";
 import type { QuestionData } from "../tool/types.js";
 import type { PreviewPane, PreviewPaneProps } from "./components/preview/preview-pane.js";
@@ -134,7 +141,10 @@ export class QuestionTabStrategy implements TabContentStrategy {
 		// drops the trailing parts (collapse hint first, then cancel) with `…`.
 		return [
 			new Spacer(1),
-			new OneLineClippedText(this.config.theme.fg("dim", buildHintText(question, this.config.isMulti, state)), 1),
+			new OneLineClippedText(
+				this.config.theme.fg("dim", buildHintText(question, this.config.isMulti, state)),
+				1,
+			),
 		];
 	}
 
@@ -175,7 +185,11 @@ export class SubmitTabStrategy implements TabContentStrategy {
 			const answerText = formatAnswerScalar(a, "summary");
 			c.addChild(new Text(this.config.theme.fg("muted", ` ● ${label}`), 1, 0));
 			c.addChild(
-				new Text(`   ${this.config.theme.fg("muted", "→")} ${this.config.theme.fg("text", answerText)}`, 1, 0),
+				new Text(
+					`   ${this.config.theme.fg("muted", "→")} ${this.config.theme.fg("text", answerText)}`,
+					1,
+					0,
+				),
 			);
 			if (a.notes && a.notes.length > 0) {
 				c.addChild(new Text(this.config.theme.fg("dim", `     notes: ${a.notes}`), 1, 0));
@@ -203,10 +217,7 @@ export class SubmitTabStrategy implements TabContentStrategy {
 		const promptText =
 			missing.length === 0
 				? this.config.theme.fg("muted", READY_PROMPT)
-				: this.config.theme.fg(
-						"warning",
-						`${INCOMPLETE_WARNING_PREFIX} ${missing.join(", ")}`,
-					);
+				: this.config.theme.fg("warning", `${INCOMPLETE_WARNING_PREFIX} ${missing.join(", ")}`);
 		const out: Component[] = [new Spacer(1), new Text(promptText, 1, 0), new Spacer(1)];
 		if (this.config.submitPicker) {
 			out.push(this.config.submitPicker);
@@ -236,7 +247,11 @@ export class SubmitTabStrategy implements TabContentStrategy {
  * is the trade we picked over wrapping (which would inflate `footerRowCount` and
  * desync the height math in `DialogView.render`).
  */
-export function buildHintText(question: QuestionData | undefined, isMulti: boolean, state: DialogState): string {
+export function buildHintText(
+	question: QuestionData | undefined,
+	isMulti: boolean,
+	state: DialogState,
+): string {
 	const parts: string[] = [HINT_PART_ENTER, HINT_PART_NAV];
 	if (question?.multiSelect === true) parts.push(HINT_PART_TOGGLE);
 	if (question && !state.notesVisible && !state.inputMode) {