co-mono/packages/coding-agent/src/tui/thinking-selector.ts

import type { ThinkingLevel } from "@mariozechner/pi-agent";
import { Container, type SelectItem, SelectList, Text } from "@mariozechner/pi-tui";
import chalk from "chalk";

/**
 * Component that renders a thinking level selector with borders
 */
export class ThinkingSelectorComponent extends Container {
	private selectList: SelectList;

	constructor(currentLevel: ThinkingLevel, onSelect: (level: ThinkingLevel) => void, onCancel: () => void) {
		super();

		const thinkingLevels: SelectItem[] = [
			{ value: "off", label: "off", description: "No reasoning" },
			{ value: "minimal", label: "minimal", description: "Very brief reasoning (~1k tokens)" },
			{ value: "low", label: "low", description: "Light reasoning (~2k tokens)" },
			{ value: "medium", label: "medium", description: "Moderate reasoning (~8k tokens)" },
			{ value: "high", label: "high", description: "Deep reasoning (~16k tokens)" },
		];

		// Add top border
		this.addChild(new Text(chalk.blue("─".repeat(50)), 0, 0));

		// Create selector
		this.selectList = new SelectList(thinkingLevels, 5);

		// Preselect current level
		const currentIndex = thinkingLevels.findIndex((item) => item.value === currentLevel);
		if (currentIndex !== -1) {
			this.selectList.setSelectedIndex(currentIndex);
		}

		this.selectList.onSelect = (item) => {
			onSelect(item.value as ThinkingLevel);
		};

		this.selectList.onCancel = () => {
			onCancel();
		};

		this.addChild(this.selectList);

		// Add bottom border
		this.addChild(new Text(chalk.blue("─".repeat(50)), 0, 0));
	}

	getSelectList(): SelectList {
		return this.selectList;
	}
}