@zhushanwen/pi-ask-user 0.0.2 → 0.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhushanwen/pi-ask-user",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "Inline adaptive ask_user tool for Pi — single/multi-question structured input with split-pane preview, inline editor, and optional comments.",
   "type": "module",
   "main": "index.ts",

package/src/__tests__/component.test.ts

@@ -362,6 +362,116 @@ describe("AskUserComponent — Other free-text editor", () => {
 	});
 });
 
+// ── 5e2. 多字符粘贴（M2/M7：完整保留，过滤控制字符，emoji 不丢）──
+// 回归 MUST_FIX-M2：handleEditorInput 按 code point 迭代粘贴 chunk，去掉了
+// `c.length === 1` 守卫（它误杀 BMP 之外的代理对，如 emoji）。
+describe("AskUserComponent — multi-char paste in editor", () => {
+	it("C-PASTE-1: multi-char chunk pasted at once is fully captured", () => {
+		// 终端把整段粘贴文本作为一个 data chunk 投递。修复前只取首字符。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER); // 打开 freeform 编辑器
+		c.handleInput("hello world"); // 一次粘贴多字符
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toBeDefined();
+		// 完整文本保留（非仅首字符 "h"）
+		expect(editorLine).toContain("hello world");
+	});
+
+	it("C-PASTE-2: paste with emoji (surrogate pair) preserves emoji (M2)", () => {
+		// 修复前：`c.length === 1` 守卫把代理对（🐛 length===2）过滤掉，emoji 被静默丢弃。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER);
+		c.handleInput("fix the 🐛 bug");
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toBeDefined();
+		// emoji 完整保留，不丢失
+		expect(editorLine).toContain("fix the 🐛 bug");
+		expect(editorLine).toContain("🐛");
+	});
+
+	it("C-PASTE-3: multi-char chunk with control chars filters control, keeps printable", () => {
+		// 粘贴 "ab\tcd"：\t（U+0009）< 空格 → 被过滤；a/b/c/d 保留。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER);
+		c.handleInput("ab\tcd");
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toBeDefined();
+		// 可打印字符保留，控制字符 \t 被过滤
+		expect(editorLine).toContain("abcd");
+		expect(editorLine).not.toContain("\t");
+	});
+
+	it("C-PASTE-4: empty string input is a no-op (no side effects)", () => {
+		const { c, result } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER); // 打开编辑器
+		const before = c.render(60);
+		c.handleInput(""); // 空字符串，无副作用
+		const after = c.render(60);
+		// 未解析、未崩溃、视图不变
+		expect(result.val).toBeUndefined();
+		expect(after).toEqual(before);
+		// 编辑器仍在（光标在），editorText 仍为空
+		expect(after.some((l) => l.includes("█"))).toBe(true);
+	});
+
+	it("C-PASTE-5: single printable char still works (backward-compat)", () => {
+		// 回归：修复去掉守卫后单字符行为不变（与 C-27 等价的逐字符输入）。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER);
+		c.handleInput("x"); // 单字符
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toBeDefined();
+		expect(editorLine).toContain("x");
+	});
+
+	it("C-PASTE-6: bracketed paste 序列被剥离，不残留 [200~/[201~", () => {
+		// 回归：启用 bracketed paste mode 的终端粘贴时会把内容包裹在
+		// \x1b[200~ ... \x1b[201~ 中。ESC 被守卫过滤，但 [200~/[201~ 可见字符
+		// 会残留。修复：handleEditorInput 先 replace 剥离这两个序列。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER); // 打开 freeform
+		c.handleInput("\x1b[200~hello\x1b[201~");
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toBeDefined();
+		expect(editorLine).toContain("hello");
+		expect(editorLine).not.toContain("[200~");
+		expect(editorLine).not.toContain("[201~");
+	});
+
+	it("C-PASTE-7: bracketed paste 跨 chunk 抵达时每个 chunk 独立剥离", () => {
+		// 边界：粘贴内容分多个 data chunk 抵达，每个 chunk 各自带始/末标记。
+		// 简单 replace 在此场景仍有效（每个 chunk 独立剥离自己的标记）。
+		const { c } = make([singleQ]);
+		c.handleInput(DOWN);
+		c.handleInput(DOWN);
+		c.handleInput(ENTER);
+		c.handleInput("\x1b[200~foo ");
+		c.handleInput(" bar\x1b[201~");
+		const lines = c.render(60);
+		const editorLine = lines.find((l) => l.includes("█"));
+		expect(editorLine).toContain("foo  bar");
+		expect(editorLine).not.toContain("[200~");
+		expect(editorLine).not.toContain("[201~");
+	});
+});
+
 // ── 5f. 评论流程（FR-4.6 / FR-11 / AC-6/12/17）─────────
 describe("AskUserComponent — comment flow", () => {
 	it("C-33: single-select + allowComment Enter enters comment mode", () => {

package/src/__tests__/question-view.test.ts

@@ -271,11 +271,12 @@ describe("renderQuestionView — Other editor mode", () => {
 			true,
 			huge,
 		);
-		// 统计含 'y' 的行数 = input 渲染行数（应被截到 5 行）
-		const yLines = lines.filter((l) => l.includes("y"));
-		expect(yLines.length).toBe(5);
+		// 统计含输入内容的行数 = input 渲染行数（应被截到 5 行）
+		// 编号 "3. " 现在是 styled 内容的一部分，首行包裹段 "3." 不含 'y'
+		const inputLines = lines.filter((l) => l.includes("y") || l.includes("3."));
+		expect(inputLines.length).toBe(5);
 		// 最后一行带省略号（表示还有更多，光标已被省略号取代）
-		expect(yLines[yLines.length - 1]).toContain("…");
+		expect(inputLines[inputLines.length - 1]).toContain("…");
 	});
 
 	it("Q-30: 已保存 freeText 预览超屏宽时多行换行展示", () => {
@@ -373,6 +374,99 @@ describe("renderQuestionView — help line", () => {
 	});
 });
 
+// ── Q-32 ~ Q-35: Other 选项对齐（单选/多选 freeform、非 freeform、预览） ──
+describe("renderQuestionView — Other row alignment", () => {
+	it("Q-32: 单选 Other freeform 编辑行编号与普通选项对齐", () => {
+		// 回归：单选 freeform 占位从 \"  \"(2列) 改为 \" \"(1列)，编号列与普通单选对齐
+		const lines = renderQuestionView(
+			singleQ,
+			makeState({ mode: "freeform", cursorIndex: 2 }),
+			stubTheme,
+			60,
+			true,
+			"custom",
+		);
+		const normalLine = lines.find((l) => l.includes("Postgres"))!;
+		const otherLine = lines.find((l) => l.includes("█"))!;
+		// stubTheme 无 ANSI，indexOf 反映可见列位置。普通选项编号 idx === Other 编号 idx
+		expect(normalLine.indexOf("1.")).toBe(otherLine.indexOf("3."));
+	});
+
+	it("Q-33: 多选 Other（无 freeText）编号与普通选项对齐", () => {
+		// 回归：多选 Other 非 freeform 标记从 check(1列) 改为 box(3列)，编号列与普通多选对齐
+		const multiQ: Question = {
+			question: "Which features?",
+			multiSelect: true,
+			options: [{ label: "Auth" }, { label: "Search" }],
+		};
+		const lines = renderQuestionView(
+			multiQ,
+			makeState({ cursorIndex: 2 }),
+			stubTheme,
+			60,
+			true,
+			"",
+		);
+		const normalLine = lines.find((l) => l.includes("Auth"))!;
+		const otherLine = lines.find((l) => l.includes("Other") && l.includes("3."))!;
+		expect(normalLine.indexOf("1.")).toBe(otherLine.indexOf("3."));
+	});
+
+	it("Q-34: 单选 Other freeText 预览缩进对齐到 label 起始列", () => {
+		// 回归：预览 lead 从硬编码 6 列改为动态计算（单选个位 = 7 列）
+		const lines = renderQuestionView(
+			singleQ,
+			makeState({ cursorIndex: 2, freeTextValue: "saved" }),
+			stubTheme,
+			60,
+			true,
+			"",
+		);
+		const labelLine = lines.find((l) => l.includes("Other") && !l.includes('"'))!;
+		const previewLine = lines.find((l) => l.includes('"saved"'))!;
+		expect(labelLine.indexOf("Other")).toBe(previewLine.indexOf('"'));
+	});
+
+	it("Q-35: 多选 Other freeText 预览缩进对齐到 label 起始列", () => {
+		// 回归：多选 marker=3列，预览 lead 应 = 9 列（个位编号），与 label 对齐
+		const multiQ: Question = {
+			question: "Which features?",
+			multiSelect: true,
+			options: [{ label: "Auth" }, { label: "Search" }],
+		};
+		const lines = renderQuestionView(
+			multiQ,
+			makeState({ cursorIndex: 2, freeTextValue: "saved" }),
+			stubTheme,
+			60,
+			true,
+			"",
+		);
+		const labelLine = lines.find((l) => l.includes("Other") && !l.includes('"'))!;
+		const previewLine = lines.find((l) => l.includes('"saved"'))!;
+		expect(labelLine.indexOf("Other")).toBe(previewLine.indexOf('"'));
+	});
+
+	it("Q-35b: 两位数编号时预览缩进随编号宽度自适应", () => {
+		// 10 个选项 + Other = 第 11 项，编号 \"11.\" 占 3 列，预览 lead 应比个位多 1 列
+		const bigQ: Question = {
+			question: "Q",
+			options: Array.from({ length: 10 }, (_, k) => ({ label: `Opt${k + 1}` })),
+		};
+		const lines = renderQuestionView(
+			bigQ,
+			makeState({ cursorIndex: 10, freeTextValue: "x" }),
+			stubTheme,
+			60,
+			true,
+			"",
+		);
+		const labelLine = lines.find((l) => l.includes("Other") && !l.includes('"'))!;
+		const previewLine = lines.find((l) => l.includes('"x"'))!;
+		expect(labelLine.indexOf("Other")).toBe(previewLine.indexOf('"'));
+	});
+});
+
 // ── Q-24 ~ Q-25: 上下文 ─────────────────────────────────
 describe("renderQuestionView — context", () => {
 	it("Q-24: renders context when present", () => {

package/src/component.ts

@@ -382,9 +382,25 @@ export class AskUserComponent implements Component {
 			this.tui.requestRender();
 			return;
 		}
-		// Printable char
-		if (data.length === 1 && data >= " ") {
-			this.editorText += data;
+		// Printable char(s) — handle both single keystrokes and multi-char paste.
+		// Terminals deliver pasted text as a single data chunk; iterating each char
+		// ensures the full paste is captured instead of silently dropping everything
+		// after the first character.
+		// 先剥离 bracketed paste 标记序列：启用该模式的终端会把粘贴内容包裹在
+		// \x1b[200~ ... \x1b[201~ 中。下面的 `c >= " "` 守卫会滤掉 ESC(\x1b)，
+		// 但序列里的可见字符（[200~/[201~）会残留混进编辑器文本，必须显式剥离。
+		const cleaned = data.replace(/\x1b\[200~|\x1b\[201~/g, "");
+		// for...of 按 code point 迭代：代理对（如 😀 U+1F600）作为一个 c（length===2）出现，
+		// 因此不能用 `c.length === 1` 守卫——那会把所有 BMP 之外的字符（emoji、部分 CJK 扩展）全过滤。
+		// 只保留 `c >= " "`（code point 比较），过滤控制字符（< 空格 U+0020）。
+		let changed = false;
+		for (const c of cleaned) {
+			if (c >= " ") {
+				this.editorText += c;
+				changed = true;
+			}
+		}
+		if (changed) {
 			this.invalidate();
 			this.tui.requestRender();
 			return;

package/src/question-view.ts

@@ -106,25 +106,33 @@ function buildOptionLines(
 		const prefix = isSelected ? t.fg("accent", ">") : " ";
 
 		if (isOther) {
+			// 标记位宽度必须与普通选项一致，否则编号列错位：
+			//   单选 check = 1 列，多选 box = 3 列。
+			//   此前单选 freeform 占位用 "  "(2列)、多选非 freeform 用 check(1列)，
+			//   两种情况下 Other 编号都与普通选项错位。
 			if (state.mode === "freeform") {
-				// 原地编辑：与普通选项的 [ ] 框 + 编号视觉对齐（单选无勾选语义则留空）。
-				// lead = "> [ ] N. "，输入文本跟在编号后，与其他选项整体一致。
-				const box = q.multiSelect ? t.fg("dim", "[ ]") : "  ";
+				const marker = q.multiSelect ? t.fg("dim", "[ ]") : " ";
 				const num = i + 1;
-				const lead = `${prefix} ${box} ${t.fg("muted", `${num}. `)}`;
+				const lead = `${prefix} ${marker} `;
 				const avail = Math.max(1, width - visibleWidth(lead));
-				// 文本 + 末尾光标 █ 整体软换行（空 input 时仅光标，wrapTextWithAnsi("█") 单行）
-				const styled = `${t.fg("text", editorText)}${t.fg("accent", "█")}`;
+				// 编号 + 文本 + 末尾光标 █ 整体软换行（空 input 时仅编号 + 光标，wrapTextWithAnsi 单行）
+				const styled = `${t.fg("muted", `${num}. `)}${t.fg("text", editorText)}${t.fg("accent", "█")}`;
 				addWrappedInput(add, lead, styled, avail, MAX_EDITOR_LINES);
 			} else {
 				const hasFreeText = state.freeTextValue !== null;
-				const check = hasFreeText ? t.fg("success", "✓") : " ";
+				const marker = q.multiSelect
+					? (hasFreeText ? t.fg("success", "[✓]") : t.fg("dim", "[ ]"))
+					: (hasFreeText ? t.fg("success", "✓") : " ");
 				const labelColor = isSelected ? "accent" : "muted";
 				const num = i + 1;
-				add(`${prefix} ${check} ${t.fg(labelColor, `${num}. ${opt.label}`)}`);
+				add(`${prefix} ${marker} ${t.fg(labelColor, `${num}. ${opt.label}`)}`);
 				if (hasFreeText) {
-					// 已保存 freeText 预览：软换行展示，最多 MAX_EDITOR_LINES 行（不再单行截断）
-					const lead = "     "; // 5 列缩进，与上方 label 行对齐
+					// 预览缩进对齐到 label 起始列：prefix + sp + marker + sp + "N." + sp。
+					// 随 num 位数与单/多选 marker 宽度动态变化，硬编码会错位。
+					const numStr = `${num}.`;
+					const lead = " ".repeat(
+						visibleWidth(prefix) + 1 + visibleWidth(marker) + 1 + numStr.length + 1,
+					);
 					const avail = Math.max(1, width - visibleWidth(lead));
 					const styled = t.fg("dim", `"${state.freeTextValue ?? ""}"`);
 					addWrappedInput(add, lead, styled, avail, MAX_EDITOR_LINES);
@@ -137,8 +145,8 @@ function buildOptionLines(
 			const num = i + 1;
 			add(`${prefix} ${box} ${t.fg(labelColor, `${num}. ${opt.label}`)}`);
 			if (opt.description && !hideDescriptions) {
-				const wrapped = wrapTextWithAnsi(t.fg("muted", opt.description), width - 7);
-				for (const line of wrapped) add(`       ${line}`);
+				const wrapped = wrapTextWithAnsi(t.fg("muted", opt.description), width - 10);
+				for (const line of wrapped) add(`          ${line}`);
 			}
 		} else {
 			const isConfirmed = state.selectedIndex === i;
@@ -147,8 +155,8 @@ function buildOptionLines(
 			const num = i + 1;
 			add(`${prefix} ${check} ${t.fg(labelColor, `${num}. ${opt.label}`)}`);
 			if (opt.description && !hideDescriptions) {
-				const wrapped = wrapTextWithAnsi(t.fg("muted", opt.description), width - 5);
-				for (const line of wrapped) add(`     ${line}`);
+				const wrapped = wrapTextWithAnsi(t.fg("muted", opt.description), width - 8);
+				for (const line of wrapped) add(`        ${line}`);
 			}
 		}
 	}