pi-crew 0.1.30 → 0.1.32

package/src/ui/layout-primitives.ts

@@ -1,106 +1,106 @@
-import { pad, wrapHard } from "../utils/visual.ts";
-
-export interface RenderableComponent {
-	invalidate(): void;
-	render(width: number): string[];
-}
-
-export class Container implements RenderableComponent {
-	private children: RenderableComponent[] = [];
-
-	addChild(child: RenderableComponent): void {
-		this.children.push(child);
-	}
-
-	clear(): void {
-		this.children = [];
-	}
-
-	invalidate(): void {
-		for (const child of this.children) {
-			child.invalidate();
-		}
-	}
-
-	render(width: number): string[] {
-		const lines: string[] = [];
-		for (const child of this.children) {
-			lines.push(...child.render(width));
-		}
-		return lines;
-	}
-}
-
-export class Box extends Container {
-	private readonly paddingX: number;
-	private readonly paddingY: number;
-
-	constructor(paddingX = 0, paddingY = 0) {
-		super();
-		this.paddingX = paddingX;
-		this.paddingY = paddingY;
-	}
-
-	render(width: number): string[] {
-		const innerWidth = Math.max(1, width - this.paddingX * 2);
-		const rows = super.render(innerWidth);
-		const paddedRows: string[] = [];
-		const left = " ".repeat(this.paddingX);
-		const right = " ".repeat(this.paddingX);
-		for (const row of rows) {
-			paddedRows.push(pad(`${left}${row}${right}`, width));
-		}
-		const emptyRow = pad("", width);
-		if (this.paddingY <= 0) return paddedRows;
-		if (this.paddingY > 0) {
-			const topAndBottom = Array.from({ length: this.paddingY }, () => emptyRow);
-			return [...topAndBottom, ...paddedRows, ...topAndBottom];
-		}
-		return paddedRows;
-	}
-}
-
-export class Text implements RenderableComponent {
-	private text: string;
-	private cachedWidth = 0;
-	private cachedResult: string[] = [];
-
-	constructor(text = "") {
-		this.text = text;
-	}
-
-	setText(text: string): void {
-		if (text === this.text) return;
-		this.text = text;
-		this.invalidate();
-	}
-
-	invalidate(): void {
-		this.cachedWidth = 0;
-		this.cachedResult = [];
-	}
-
-	render(width: number): string[] {
-		if (this.cachedWidth === width) return this.cachedResult;
-		const wrapped = wrapHard(this.text, Math.max(1, width));
-		const lines = wrapped.length ? wrapped : [""];
-		this.cachedWidth = width;
-		this.cachedResult = lines.map((line) => pad(line, width));
-		return this.cachedResult;
-	}
-}
-
-export class Spacer implements RenderableComponent {
-	private readonly rows: number;
-
-	constructor(rows = 0) {
-		this.rows = rows;
-	}
-
-	render(width: number): string[] {
-		if (this.rows <= 0) return [];
-		return Array.from({ length: Math.max(0, this.rows) }, () => pad("", width));
-	}
-
-	invalidate(): void {}
-}
+import { pad, wrapHard } from "../utils/visual.ts";
+
+export interface RenderableComponent {
+	invalidate(): void;
+	render(width: number): string[];
+}
+
+export class Container implements RenderableComponent {
+	private children: RenderableComponent[] = [];
+
+	addChild(child: RenderableComponent): void {
+		this.children.push(child);
+	}
+
+	clear(): void {
+		this.children = [];
+	}
+
+	invalidate(): void {
+		for (const child of this.children) {
+			child.invalidate();
+		}
+	}
+
+	render(width: number): string[] {
+		const lines: string[] = [];
+		for (const child of this.children) {
+			lines.push(...child.render(width));
+		}
+		return lines;
+	}
+}
+
+export class Box extends Container {
+	private readonly paddingX: number;
+	private readonly paddingY: number;
+
+	constructor(paddingX = 0, paddingY = 0) {
+		super();
+		this.paddingX = paddingX;
+		this.paddingY = paddingY;
+	}
+
+	render(width: number): string[] {
+		const innerWidth = Math.max(1, width - this.paddingX * 2);
+		const rows = super.render(innerWidth);
+		const paddedRows: string[] = [];
+		const left = " ".repeat(this.paddingX);
+		const right = " ".repeat(this.paddingX);
+		for (const row of rows) {
+			paddedRows.push(pad(`${left}${row}${right}`, width));
+		}
+		const emptyRow = pad("", width);
+		if (this.paddingY <= 0) return paddedRows;
+		if (this.paddingY > 0) {
+			const topAndBottom = Array.from({ length: this.paddingY }, () => emptyRow);
+			return [...topAndBottom, ...paddedRows, ...topAndBottom];
+		}
+		return paddedRows;
+	}
+}
+
+export class Text implements RenderableComponent {
+	private text: string;
+	private cachedWidth = 0;
+	private cachedResult: string[] = [];
+
+	constructor(text = "") {
+		this.text = text;
+	}
+
+	setText(text: string): void {
+		if (text === this.text) return;
+		this.text = text;
+		this.invalidate();
+	}
+
+	invalidate(): void {
+		this.cachedWidth = 0;
+		this.cachedResult = [];
+	}
+
+	render(width: number): string[] {
+		if (this.cachedWidth === width) return this.cachedResult;
+		const wrapped = wrapHard(this.text, Math.max(1, width));
+		const lines = wrapped.length ? wrapped : [""];
+		this.cachedWidth = width;
+		this.cachedResult = lines.map((line) => pad(line, width));
+		return this.cachedResult;
+	}
+}
+
+export class Spacer implements RenderableComponent {
+	private readonly rows: number;
+
+	constructor(rows = 0) {
+		this.rows = rows;
+	}
+
+	render(width: number): string[] {
+		if (this.rows <= 0) return [];
+		return Array.from({ length: Math.max(0, this.rows) }, () => pad("", width));
+	}
+
+	invalidate(): void {}
+}

package/src/ui/loaders.ts

@@ -1,158 +1,158 @@
-import { pad, truncate } from "../utils/visual.ts";
-import type { CrewTheme } from "./theme-adapter.ts";
-import { asCrewTheme } from "./theme-adapter.ts";
-import { DynamicCrewBorder } from "./dynamic-border.ts";
-
-export interface BorderedLoaderOptions {
-	message: string;
-	cancellable?: boolean;
-	frames?: string[];
-	intervalMs?: number;
-	minWidth?: number;
-	onAbort?: () => void;
-}
-
-const DEFAULT_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
-
-export class CrewBorderedLoader {
-	private readonly abortController = new AbortController();
-	private readonly frameOptions: string[];
-	private readonly intervalMs: number;
-	private readonly minWidth: number;
-	private readonly onAbort?: () => void;
-	private theme: CrewTheme;
-	private message: string;
-	private lineCache = "";
-	private width = 0;
-	private startedAt = Date.now();
-
-	constructor(_ui: unknown, themeLike: unknown, options: BorderedLoaderOptions) {
-		const theme = asCrewTheme(themeLike);
-		this.theme = theme;
-		this.message = options.message;
-		this.minWidth = Math.max(12, options.minWidth ?? 24);
-		this.onAbort = options.onAbort;
-		this.frameOptions = options.frames ?? DEFAULT_FRAMES;
-		this.intervalMs = Math.max(40, options.intervalMs ?? 120);
-	}
-
-	private spinnerFrame(): string {
-		if (this.frameOptions.length === 0) return "•";
-		const elapsed = Date.now() - this.startedAt;
-		const index = Math.floor(elapsed / this.intervalMs) % this.frameOptions.length;
-		return this.frameOptions[Math.max(0, index)];
-	}
-
-	setMessage(message: string): void {
-		this.message = message;
-	}
-
-	get signal(): AbortSignal {
-		return this.abortController.signal;
-	}
-
-	handleInput(data: string): void {
-		if (!this.onAbort || this.abortController.signal.aborted) return;
-		if (data === "c" || data === "q" || data === "\u001b" || data === "\u0003") {
-			this.abortController.abort();
-			this.onAbort();
-		}
-	}
-
-	render(width: number): string[] {
-		if (width === this.width && this.lineCache) {
-			return this.lineCache.split("\n");
-		}
-		const innerWidth = Math.max(this.minWidth - 4, 1);
-		const contentWidth = Math.max(1, Math.min(width - 4, innerWidth));
-		const frame = this.spinnerFrame();
-		const loaderLine = ` ${frame} ${truncate(this.message, Math.max(1, contentWidth - 4))} `;
-		const body = ` ${truncate(loaderLine, contentWidth - 2)} `;
-		const inner = ` ${pad(body, contentWidth - 1)} `;
-		const padWidth = Math.max(0, width - (contentWidth + 4));
-		const leftRightPad = " ".repeat(Math.floor(padWidth / 2));
-		const widthAwareInner = contentWidth + padWidth;
-		const border = new DynamicCrewBorder(this.theme).render(widthAwareInner + 2)[0];
-		const top = `${leftRightPad}${this.theme.fg("border", "┌")}${border}${this.theme.fg("border", "┐")}`;
-		const line = `${leftRightPad}${this.theme.fg("border", "│")} ${truncate(inner, widthAwareInner)} ${this.theme.fg("border", "│")}`;
-		const hint = `${leftRightPad}${this.theme.fg("border", "│")}${" ".repeat(widthAwareInner + 2)}${this.theme.fg("border", "│")}`;
-		const bottom = `${leftRightPad}${this.theme.fg("border", "└")}${border}${this.theme.fg("border", "┘")}`;
-		const lineWithHint = optionsHint(this.theme, this.message, widthAwareInner);
-		this.width = width;
-		const lines = [
-			top,
-			line,
-			`${leftRightPad}│ ${pad(lineWithHint, widthAwareInner)} │`,
-			hint,
-			bottom,
-		];
-		this.lineCache = lines.join("\n");
-		return lines;
-	}
-
-	invalidate(): void {
-		this.lineCache = "";
-		this.width = 0;
-	}
-
-	dispose(): void {
-		this.abortController.abort();
-	}
-}
-
-export interface CountdownTimerOptions {
-	timeoutMs: number;
-	onTick: (seconds: number) => void;
-	onExpire: () => void;
-}
-
-export class CountdownTimer {
-	private readonly onExpire: () => void;
-	private readonly onTick: (seconds: number) => void;
-	private readonly startedAt: number;
-	private readonly timeoutMs: number;
-	private timer: ReturnType<typeof setTimeout> | undefined;
-	private expired = false;
-
-	constructor(options: CountdownTimerOptions) {
-		this.timeoutMs = Math.max(0, options.timeoutMs);
-		this.onTick = options.onTick;
-		this.onExpire = options.onExpire;
-		this.startedAt = Date.now();
-		this.onTick(this.secondsLeft());
-		if (this.timeoutMs === 0) {
-			this.emitExpire();
-			return;
-		}
-		this.timer = setInterval(() => {
-			const seconds = this.secondsLeft();
-			this.onTick(seconds);
-			if (seconds <= 0) {
-				this.emitExpire();
-			}
-		}, 1000);
-	}
-
-	private emitExpire(): void {
-		if (this.expired) return;
-		this.expired = true;
-		this.dispose();
-		this.onExpire();
-	}
-
-	private secondsLeft(): number {
-		const remainingMs = this.startedAt + this.timeoutMs - Date.now();
-		return Math.max(0, Math.ceil(remainingMs / 1000));
-	}
-
-	dispose(): void {
-		if (this.timer === undefined) return;
-		clearInterval(this.timer);
-		this.timer = undefined;
-	}
-}
-
-function optionsHint(theme: CrewTheme, message: string, width: number): string {
-	if (!message) return "";
-	return truncate(theme.fg("muted", message), width);
-}
+import { pad, truncate } from "../utils/visual.ts";
+import type { CrewTheme } from "./theme-adapter.ts";
+import { asCrewTheme } from "./theme-adapter.ts";
+import { DynamicCrewBorder } from "./dynamic-border.ts";
+
+export interface BorderedLoaderOptions {
+	message: string;
+	cancellable?: boolean;
+	frames?: string[];
+	intervalMs?: number;
+	minWidth?: number;
+	onAbort?: () => void;
+}
+
+const DEFAULT_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+
+export class CrewBorderedLoader {
+	private readonly abortController = new AbortController();
+	private readonly frameOptions: string[];
+	private readonly intervalMs: number;
+	private readonly minWidth: number;
+	private readonly onAbort?: () => void;
+	private theme: CrewTheme;
+	private message: string;
+	private lineCache = "";
+	private width = 0;
+	private startedAt = Date.now();
+
+	constructor(_ui: unknown, themeLike: unknown, options: BorderedLoaderOptions) {
+		const theme = asCrewTheme(themeLike);
+		this.theme = theme;
+		this.message = options.message;
+		this.minWidth = Math.max(12, options.minWidth ?? 24);
+		this.onAbort = options.onAbort;
+		this.frameOptions = options.frames ?? DEFAULT_FRAMES;
+		this.intervalMs = Math.max(40, options.intervalMs ?? 120);
+	}
+
+	private spinnerFrame(): string {
+		if (this.frameOptions.length === 0) return "•";
+		const elapsed = Date.now() - this.startedAt;
+		const index = Math.floor(elapsed / this.intervalMs) % this.frameOptions.length;
+		return this.frameOptions[Math.max(0, index)];
+	}
+
+	setMessage(message: string): void {
+		this.message = message;
+	}
+
+	get signal(): AbortSignal {
+		return this.abortController.signal;
+	}
+
+	handleInput(data: string): void {
+		if (!this.onAbort || this.abortController.signal.aborted) return;
+		if (data === "c" || data === "q" || data === "\u001b" || data === "\u0003") {
+			this.abortController.abort();
+			this.onAbort();
+		}
+	}
+
+	render(width: number): string[] {
+		if (width === this.width && this.lineCache) {
+			return this.lineCache.split("\n");
+		}
+		const innerWidth = Math.max(this.minWidth - 4, 1);
+		const contentWidth = Math.max(1, Math.min(width - 4, innerWidth));
+		const frame = this.spinnerFrame();
+		const loaderLine = ` ${frame} ${truncate(this.message, Math.max(1, contentWidth - 4))} `;
+		const body = ` ${truncate(loaderLine, contentWidth - 2)} `;
+		const inner = ` ${pad(body, contentWidth - 1)} `;
+		const padWidth = Math.max(0, width - (contentWidth + 4));
+		const leftRightPad = " ".repeat(Math.floor(padWidth / 2));
+		const widthAwareInner = contentWidth + padWidth;
+		const border = new DynamicCrewBorder(this.theme).render(widthAwareInner + 2)[0];
+		const top = `${leftRightPad}${this.theme.fg("border", "┌")}${border}${this.theme.fg("border", "┐")}`;
+		const line = `${leftRightPad}${this.theme.fg("border", "│")} ${truncate(inner, widthAwareInner)} ${this.theme.fg("border", "│")}`;
+		const hint = `${leftRightPad}${this.theme.fg("border", "│")}${" ".repeat(widthAwareInner + 2)}${this.theme.fg("border", "│")}`;
+		const bottom = `${leftRightPad}${this.theme.fg("border", "└")}${border}${this.theme.fg("border", "┘")}`;
+		const lineWithHint = optionsHint(this.theme, this.message, widthAwareInner);
+		this.width = width;
+		const lines = [
+			top,
+			line,
+			`${leftRightPad}│ ${pad(lineWithHint, widthAwareInner)} │`,
+			hint,
+			bottom,
+		];
+		this.lineCache = lines.join("\n");
+		return lines;
+	}
+
+	invalidate(): void {
+		this.lineCache = "";
+		this.width = 0;
+	}
+
+	dispose(): void {
+		this.abortController.abort();
+	}
+}
+
+export interface CountdownTimerOptions {
+	timeoutMs: number;
+	onTick: (seconds: number) => void;
+	onExpire: () => void;
+}
+
+export class CountdownTimer {
+	private readonly onExpire: () => void;
+	private readonly onTick: (seconds: number) => void;
+	private readonly startedAt: number;
+	private readonly timeoutMs: number;
+	private timer: ReturnType<typeof setTimeout> | undefined;
+	private expired = false;
+
+	constructor(options: CountdownTimerOptions) {
+		this.timeoutMs = Math.max(0, options.timeoutMs);
+		this.onTick = options.onTick;
+		this.onExpire = options.onExpire;
+		this.startedAt = Date.now();
+		this.onTick(this.secondsLeft());
+		if (this.timeoutMs === 0) {
+			this.emitExpire();
+			return;
+		}
+		this.timer = setInterval(() => {
+			const seconds = this.secondsLeft();
+			this.onTick(seconds);
+			if (seconds <= 0) {
+				this.emitExpire();
+			}
+		}, 1000);
+	}
+
+	private emitExpire(): void {
+		if (this.expired) return;
+		this.expired = true;
+		this.dispose();
+		this.onExpire();
+	}
+
+	private secondsLeft(): number {
+		const remainingMs = this.startedAt + this.timeoutMs - Date.now();
+		return Math.max(0, Math.ceil(remainingMs / 1000));
+	}
+
+	dispose(): void {
+		if (this.timer === undefined) return;
+		clearInterval(this.timer);
+		this.timer = undefined;
+	}
+}
+
+function optionsHint(theme: CrewTheme, message: string, width: number): string {
+	if (!message) return "";
+	return truncate(theme.fg("muted", message), width);
+}