@aigne/afs-cli 1.11.0-beta.1 → 1.11.0-beta.10

package/dist/explorer/components/dialog.cjs

@@ -0,0 +1,508 @@
+const require_keybindings = require('../keybindings.cjs');
+const require_theme = require('../theme.cjs');
+
+//#region src/explorer/components/dialog.ts
+/**
+* Create dialog manager
+*/
+function createDialogManager(blessed, options) {
+	const { parent } = options;
+	let currentDialog = null;
+	let currentOverlay = null;
+	let currentCloseHandler = null;
+	/**
+	* Create a modal overlay to capture mouse events behind the dialog
+	*/
+	function createOverlay() {
+		const overlay = blessed.box({
+			parent,
+			top: 0,
+			left: 0,
+			width: "100%",
+			height: "100%",
+			mouse: true,
+			style: { transparent: true }
+		});
+		overlay.on("wheeldown", () => {});
+		overlay.on("wheelup", () => {});
+		overlay.on("click", () => {});
+		return overlay;
+	}
+	/**
+	* Create a basic dialog box
+	*/
+	function createDialog(title, width, height, options$1) {
+		currentOverlay = createOverlay();
+		const dialog = blessed.box({
+			parent,
+			top: "center",
+			left: "center",
+			width,
+			height,
+			tags: true,
+			keys: true,
+			vi: true,
+			mouse: true,
+			scrollable: true,
+			alwaysScroll: true,
+			scrollbar: {
+				ch: " ",
+				track: { bg: require_theme.Colors.bg.main },
+				style: { inverse: true }
+			},
+			style: {
+				fg: require_theme.Colors.fg.normal,
+				bg: require_theme.Colors.bg.main,
+				border: { fg: require_theme.Colors.fg.border }
+			},
+			border: { type: "line" },
+			label: ` ${title} `,
+			shadow: true
+		});
+		dialog.on("wheeldown", () => {
+			dialog.scroll(1);
+			parent.render();
+		});
+		dialog.on("wheelup", () => {
+			dialog.scroll(-1);
+			parent.render();
+		});
+		if (!options$1?.skipDefaultKeys) dialog.key([
+			"escape",
+			"q",
+			"enter"
+		], () => {
+			close();
+		});
+		return dialog;
+	}
+	/**
+	* Close current dialog
+	*/
+	function close() {
+		if (currentCloseHandler) {
+			parent.unkey("escape", currentCloseHandler);
+			parent.unkey("q", currentCloseHandler);
+			parent.unkey("enter", currentCloseHandler);
+			currentCloseHandler = null;
+		}
+		if (currentOverlay) {
+			currentOverlay.destroy();
+			currentOverlay = null;
+		}
+		if (currentDialog) {
+			currentDialog.destroy();
+			currentDialog = null;
+			parent.render();
+		}
+	}
+	return {
+		showHelp(registry) {
+			close();
+			const dialog = createDialog("Help - AFS Explorer", "60%", "70%");
+			currentDialog = dialog;
+			const lines = [
+				" AFS Explorer - Navigate your Agentic File System",
+				"",
+				" {bold}Commands:{/bold}",
+				""
+			];
+			const bindings = registry.getFunctionBarBindings();
+			for (const binding of bindings) {
+				const key = require_keybindings.formatKeyName(binding.key).padEnd(6);
+				lines.push(`   ${key} ${binding.description}`);
+			}
+			lines.push("");
+			lines.push(" {bold}Navigation:{/bold}");
+			lines.push("");
+			lines.push("   ↑/k     Move up");
+			lines.push("   ↓/j     Move down");
+			lines.push("   Enter/l Enter directory or view file");
+			lines.push("   Bksp/h  Go to parent directory");
+			lines.push("   g/Home  Go to first item");
+			lines.push("   G/End   Go to last item");
+			lines.push("   ^U/PgUp Page up");
+			lines.push("   ^D/PgDn Page down");
+			lines.push("");
+			lines.push(" {bold}Other:{/bold}");
+			lines.push("");
+			lines.push("   /       Filter entries");
+			lines.push("   ?       Show this help");
+			lines.push("");
+			lines.push(" {gray-fg}Press Esc, Enter, or Q to close{/gray-fg}");
+			dialog.setContent(lines.join("\n"));
+			dialog.focus();
+			parent.render();
+		},
+		showExplain(path, content) {
+			close();
+			const dialog = createDialog(`Explain: ${path}`, "80%", "80%");
+			currentDialog = dialog;
+			dialog.setContent(` ${content.split("\n").join("\n ")}`);
+			dialog.focus();
+			parent.render();
+		},
+		showFileView(path, content) {
+			close();
+			const dialog = createDialog(`View: ${path}`, "90%", "90%");
+			currentDialog = dialog;
+			const numbered = content.split("\n").map((line, i) => {
+				return `{gray-fg}${(i + 1).toString().padStart(4)}{/gray-fg} │ ${line.replace(/\{/g, "\\{").replace(/\}/g, "\\}")}`;
+			});
+			dialog.setContent(numbered.join("\n"));
+			dialog.focus();
+			parent.render();
+		},
+		showActionResult(action, success, message, data) {
+			close();
+			const dialog = createDialog(`Action: ${action}`, "60%", "50%", { skipDefaultKeys: true });
+			currentDialog = dialog;
+			const lines = [];
+			if (success) lines.push(" {green-fg}✓ Action completed successfully{/green-fg}");
+			else lines.push(" {red-fg}✗ Action failed{/red-fg}");
+			if (message) {
+				lines.push("");
+				lines.push(` ${message}`);
+			}
+			if (data !== void 0) {
+				lines.push("");
+				lines.push(" {bold}Result:{/bold}");
+				lines.push("");
+				const formatted = JSON.stringify(data, null, 2);
+				for (const line of formatted.split("\n")) lines.push(`   ${line}`);
+			}
+			lines.push("");
+			lines.push(" {gray-fg}Press Esc, Enter, or Q to close{/gray-fg}");
+			dialog.setContent(lines.join("\n"));
+			currentCloseHandler = () => {
+				close();
+			};
+			parent.key([
+				"escape",
+				"q",
+				"enter"
+			], currentCloseHandler);
+			dialog.focus();
+			parent.render();
+		},
+		showError(title, error) {
+			close();
+			const dialog = createDialog(title, "50%", "30%");
+			currentDialog = dialog;
+			const lines = [
+				" {red-fg}Error:{/red-fg}",
+				"",
+				` ${error}`,
+				"",
+				" {gray-fg}Press Esc to close{/gray-fg}"
+			];
+			dialog.setContent(lines.join("\n"));
+			dialog.focus();
+			parent.render();
+		},
+		showLoading(message) {
+			close();
+			const dialog = createDialog("Loading", "40%", "20%");
+			currentDialog = dialog;
+			dialog.setContent(`\n   ${message}...`);
+			parent.render();
+		},
+		showConfirm(message, onConfirm) {
+			close();
+			const dialog = createDialog("Confirm", "50%", "25%", { skipDefaultKeys: true });
+			currentDialog = dialog;
+			let selectedYes = false;
+			const renderContent = () => {
+				const yesStyle = selectedYes ? "{inverse} Yes {/inverse}" : " Yes ";
+				const noStyle = selectedYes ? " No " : "{inverse} No {/inverse}";
+				const lines = [
+					"",
+					` ${message}`,
+					"",
+					`                    [ ${yesStyle} ]    [ ${noStyle} ]`,
+					"",
+					" {gray-fg}←/→: switch | Enter: confirm | Y/N: quick select | Esc: cancel{/gray-fg}"
+				];
+				dialog.setContent(lines.join("\n"));
+				parent.render();
+			};
+			renderContent();
+			dialog.key(["left", "right"], () => {
+				selectedYes = !selectedYes;
+				renderContent();
+			});
+			dialog.key(["enter"], async () => {
+				close();
+				if (selectedYes) await onConfirm();
+			});
+			dialog.key(["y", "Y"], async () => {
+				close();
+				await onConfirm();
+			});
+			dialog.key([
+				"n",
+				"N",
+				"escape"
+			], () => {
+				close();
+			});
+			dialog.focus();
+			parent.render();
+		},
+		showParamsInput(path, inputSchema, onSubmit) {
+			close();
+			const properties = inputSchema?.properties || {};
+			const required = inputSchema?.required || [];
+			const propNames = Object.keys(properties);
+			if (propNames.length === 0) {
+				this.showConfirm(`Execute action on ${path}?`, () => {
+					onSubmit({});
+				});
+				return;
+			}
+			const dialogHeight = Math.min(propNames.length * 3 + 8, 25);
+			const dialog = createDialog(`Exec: ${path}`, "70%", dialogHeight, { skipDefaultKeys: true });
+			currentDialog = dialog;
+			const form = blessed.form({
+				parent: dialog,
+				top: 1,
+				left: 1,
+				right: 1,
+				bottom: 3,
+				keys: true,
+				vi: false
+			});
+			const inputs = [];
+			let yPos = 0;
+			for (const propName of propNames) {
+				const prop = properties[propName];
+				const isRequired = required.includes(propName);
+				const typeStr = prop?.type || "string";
+				const description = prop?.description || "";
+				const labelText = `${propName}${isRequired ? "{red-fg}*{/red-fg}" : ""} {gray-fg}(${typeStr}){/gray-fg}${description ? ` - ${description}` : ""}`;
+				blessed.text({
+					parent: form,
+					top: yPos,
+					left: 0,
+					tags: true,
+					content: labelText,
+					style: { fg: require_theme.Colors.fg.normal }
+				});
+				yPos += 1;
+				const inputBox = blessed.box({
+					parent: form,
+					top: yPos,
+					left: 0,
+					width: "100%-2",
+					height: 1,
+					tags: true,
+					style: {
+						fg: require_theme.Colors.fg.normal,
+						bg: require_theme.Colors.bg.input
+					}
+				});
+				inputs.push({
+					name: propName,
+					value: "",
+					cursor: 0,
+					box: inputBox
+				});
+				yPos += 2;
+			}
+			blessed.text({
+				parent: dialog,
+				bottom: 1,
+				left: 1,
+				tags: true,
+				content: "{gray-fg}Tab: next | ←→: move cursor | Enter: submit | Esc: cancel{/gray-fg}"
+			});
+			let focusIndex = 0;
+			const renderInput = (state, focused) => {
+				if (focused) {
+					const before = state.value.slice(0, state.cursor);
+					const cursorChar = state.value[state.cursor] || "█";
+					const after = state.value.slice(state.cursor + 1);
+					state.box.setContent(`${before}{white-bg}{black-fg}${cursorChar}{/black-fg}{/white-bg}${after}`);
+					state.box.style.bg = require_theme.Colors.bg.inputFocus;
+				} else {
+					state.box.setContent(state.value || "");
+					state.box.style.bg = require_theme.Colors.bg.input;
+				}
+			};
+			const focusInput = (index) => {
+				const prevState = inputs[focusIndex];
+				const nextState = inputs[index];
+				if (nextState) {
+					if (prevState) renderInput(prevState, false);
+					focusIndex = index;
+					renderInput(nextState, true);
+					parent.render();
+				}
+			};
+			const keypressHandler = (ch, key) => {
+				const state = inputs[focusIndex];
+				if (!state) return;
+				const keyName = key?.name || "";
+				if (keyName === "tab") {
+					if (key.shift) focusInput((focusIndex - 1 + inputs.length) % inputs.length);
+					else focusInput((focusIndex + 1) % inputs.length);
+					return;
+				}
+				if (keyName === "enter" || keyName === "return") {
+					submitForm();
+					return;
+				}
+				if (keyName === "escape") return;
+				if (keyName === "left") {
+					state.cursor = Math.max(0, state.cursor - 1);
+					renderInput(state, true);
+					parent.render();
+					return;
+				}
+				if (keyName === "right") {
+					state.cursor = Math.min(state.value.length, state.cursor + 1);
+					renderInput(state, true);
+					parent.render();
+					return;
+				}
+				if (keyName === "home") {
+					state.cursor = 0;
+					renderInput(state, true);
+					parent.render();
+					return;
+				}
+				if (keyName === "end") {
+					state.cursor = state.value.length;
+					renderInput(state, true);
+					parent.render();
+					return;
+				}
+				if (keyName === "backspace") {
+					if (state.cursor > 0) {
+						state.value = state.value.slice(0, state.cursor - 1) + state.value.slice(state.cursor);
+						state.cursor--;
+						renderInput(state, true);
+						parent.render();
+					}
+					return;
+				}
+				if (keyName === "delete") {
+					if (state.cursor < state.value.length) {
+						state.value = state.value.slice(0, state.cursor) + state.value.slice(state.cursor + 1);
+						renderInput(state, true);
+						parent.render();
+					}
+					return;
+				}
+				if (ch && ch.length === 1 && !key.ctrl && !key.meta) {
+					state.value = state.value.slice(0, state.cursor) + ch + state.value.slice(state.cursor);
+					state.cursor++;
+					renderInput(state, true);
+					parent.render();
+				}
+			};
+			const submitForm = () => {
+				parent.removeListener("keypress", keypressHandler);
+				const params = {};
+				for (const { name, value } of inputs) {
+					const trimmed = value.trim();
+					if (trimmed) {
+						const expectedType = properties[name]?.type || "string";
+						if (expectedType === "string") params[name] = trimmed;
+						else if (expectedType === "number" || expectedType === "integer") {
+							const num = Number(trimmed);
+							params[name] = Number.isNaN(num) ? trimmed : num;
+						} else if (expectedType === "boolean") params[name] = trimmed.toLowerCase() === "true";
+						else if (expectedType === "object" || expectedType === "array") try {
+							params[name] = JSON.parse(trimmed);
+						} catch {
+							params[name] = trimmed;
+						}
+						else try {
+							params[name] = JSON.parse(trimmed);
+						} catch {
+							params[name] = trimmed;
+						}
+					}
+				}
+				close();
+				onSubmit(params);
+			};
+			const originalClose = close;
+			const closeWithCleanup = () => {
+				parent.removeListener("keypress", keypressHandler);
+				originalClose();
+			};
+			dialog.key(["escape"], () => {
+				closeWithCleanup();
+			});
+			dialog.focus();
+			parent.render();
+			setTimeout(() => {
+				parent.on("keypress", keypressHandler);
+				focusInput(0);
+			}, 50);
+		},
+		showActionPicker(nodePath, actions, onSelect) {
+			close();
+			const nodeName = nodePath.split("/").pop() || nodePath;
+			const dialogHeight = Math.min(actions.length + 6, 20);
+			const dialog = createDialog(`Actions: ${nodeName}`, "50%", dialogHeight, { skipDefaultKeys: true });
+			currentDialog = dialog;
+			let selectedIndex = 0;
+			const renderContent = () => {
+				const lines = [""];
+				for (let i = 0; i < actions.length; i++) {
+					const action = actions[i];
+					if (!action) continue;
+					const prefix = i === selectedIndex ? " {inverse}" : "  ";
+					const suffix = i === selectedIndex ? "{/inverse}" : "";
+					lines.push(`${prefix}[${i + 1}] ${action.name}${suffix}`);
+					if (action.description) lines.push(`      {gray-fg}${action.description}{/gray-fg}`);
+				}
+				lines.push("");
+				lines.push(" {gray-fg}↑/↓: select | Enter: execute | Esc: cancel{/gray-fg}");
+				dialog.setContent(lines.join("\n"));
+				parent.render();
+			};
+			renderContent();
+			dialog.key(["up", "k"], () => {
+				selectedIndex = (selectedIndex - 1 + actions.length) % actions.length;
+				renderContent();
+			});
+			dialog.key(["down", "j"], () => {
+				selectedIndex = (selectedIndex + 1) % actions.length;
+				renderContent();
+			});
+			for (let i = 1; i <= Math.min(9, actions.length); i++) dialog.key([String(i)], () => {
+				const action = actions[i - 1];
+				if (action) {
+					close();
+					onSelect(action);
+				}
+			});
+			dialog.key(["enter"], () => {
+				const action = actions[selectedIndex];
+				if (action) {
+					close();
+					onSelect(action);
+				}
+			});
+			dialog.key(["escape", "q"], () => {
+				close();
+			});
+			dialog.focus();
+			parent.render();
+		},
+		close,
+		isOpen() {
+			return currentDialog !== null;
+		},
+		destroy() {
+			close();
+		}
+	};
+}
+
+//#endregion
+exports.createDialogManager = createDialogManager;