@hediet/linkrpc-cli 0.0.3-next.20260922.2 → 0.0.3-next.20260924.1

package/dist/chunks/{runUi-CuJr8_tY.js → runUi-Dp2P3aNN.js}

@@ -1,12 +1,292 @@
-import { D as formatPrincipalSource, L as validateValueAgainstSchema, S as fetchSchema, T as walkHubDetailed, b as setupSigning, k as connect, x as fetchDefaults } from "./runComplete-Du5wmOdB.js";
-import { a as observableValue, c as Disposable, i as ObservablePromise, o as autorun, r as ObservableLazyPromise, s as derived } from "./cli-FDKN1ydZ.js";
-import { n as useObservable, t as useScroll } from "./scroll--AVfTs5W.js";
+import { D as formatPrincipalSource, L as validateValueAgainstSchema, S as fetchSchema, T as walkHubDetailed, b as setupSigning, k as connect, r as withStaticHubReflection, x as fetchDefaults } from "./runComplete-F95L0neY.js";
+import { a as formatCommandLegend, c as safeTerminalText, d as interfaceTarget, f as matchesTarget, i as dispatchHostKey, l as resolveViewTarget, n as views, o as hostCommands, p as targetId, r as ViewFrame, s as matchesKey, u as formatCondition } from "./cli-CY5WVWEQ.js";
+import { a as derived, i as autorun, n as ObservablePromise, o as Disposable, r as observableValue, t as ObservableLazyPromise } from "./dist-BOcSU4-O.js";
+import { n as useObservable, t as useScroll } from "./scroll-CY9Rcshb.js";
 import { ChannelConnector, RpcError, SigningSender } from "@hediet/linkrpc";
 import { isHubEndpoint, openHubChannel } from "@hediet/linkrpc/node";
+import { stdin } from "node:process";
+import { emitKeypressEvents } from "node:readline";
 import React from "react";
-import { Box, Text, render, useApp, useInput, useStdout } from "ink";
-import TextInput from "ink-text-input";
+import { Box, Text, measureElement, render, useApp, useInput, useStdout } from "ink";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import TextInput from "ink-text-input";
+//#region src/ui/SchemaSession.tsx
+/** Built-in read-only view; uses the same viewport and command contract as contributions. */
+var SchemaSession = class {
+	schema;
+	element = /* @__PURE__ */ jsx(SchemaPanel, { session: this });
+	viewport = observableValue(this, {
+		rows: 24,
+		columns: 80,
+		top: 0,
+		left: 0,
+		disposed: false
+	});
+	constructor(schema) {
+		this.schema = schema;
+	}
+	lines = derived(this, (reader) => {
+		const value = this.schema.read(reader);
+		return (value.kind === "loaded" ? JSON.stringify(value.schema, null, 2) : value.kind === "error" ? String(value.error) : value.kind === "none" ? "Select an interface to inspect its schema." : "Loading schema…").split("\n").map(safeTerminalText);
+	});
+	commands = derived(this, (reader) => {
+		const viewport = this.viewport.read(reader);
+		if (viewport.disposed) return [];
+		const lines = this.lines.read(reader);
+		const page = Math.max(1, viewport.rows - 2);
+		const maxTop = Math.max(0, lines.length - page);
+		const maxLeft = Math.max(0, lines.reduce((width, line) => Math.max(width, [...line].length), 0) - viewport.columns);
+		const top = Math.min(viewport.top, maxTop), left = Math.min(viewport.left, maxLeft);
+		const move = (vertical, horizontal = 0) => this.viewport.set({
+			...this.viewport.get(),
+			top: Math.max(0, Math.min(maxTop, top + vertical)),
+			left: Math.max(0, Math.min(maxLeft, left + horizontal))
+		}, void 0);
+		const command = (id, title, keys, execute, enabled) => ({
+			id: `schema.${id}`,
+			title,
+			keybindings: keys.map((key) => ({ key })),
+			execute,
+			enabled,
+			context: "Schema"
+		});
+		return [
+			command("up", "Scroll up", ["up", "k"], () => move(-1), top > 0),
+			command("down", "Scroll down", ["down", "j"], () => move(1), top < maxTop),
+			command("pageUp", "Page up", ["pageup"], () => move(-page), top > 0),
+			command("pageDown", "Page down", ["pagedown"], () => move(page), top < maxTop),
+			command("first", "First line", ["home", "g"], () => move(-maxTop), top > 0),
+			command("last", "Last line", ["end", "G"], () => move(maxTop), top < maxTop),
+			command("left", "Scroll left", ["left", "h"], () => move(0, -20), left > 0),
+			command("right", "Scroll right", ["right", "l"], () => move(0, 20), left < maxLeft)
+		];
+	});
+	setViewport(rows, columns = this.viewport.get().columns) {
+		const state = this.viewport.get();
+		if (rows !== state.rows || columns !== state.columns) this.viewport.set({
+			...state,
+			rows,
+			columns
+		}, void 0);
+	}
+	captureState() {
+		const { top, left } = this.viewport.get();
+		return {
+			top,
+			left
+		};
+	}
+	restoreState(value) {
+		const state = value;
+		if (state) this.viewport.set({
+			...this.viewport.get(),
+			top: state.top ?? 0,
+			left: state.left ?? 0
+		}, void 0);
+	}
+	dispose() {
+		this.viewport.set({
+			...this.viewport.get(),
+			disposed: true
+		}, void 0);
+	}
+};
+var SchemaPanel = class extends React.Component {
+	state = { revision: 0 };
+	subscription;
+	componentDidMount() {
+		this.subscription = autorun((reader) => {
+			this.props.session.viewport.read(reader);
+			this.props.session.lines.read(reader);
+			this.setState((previous) => ({ revision: previous.revision + 1 }));
+		});
+	}
+	componentWillUnmount() {
+		this.subscription?.dispose();
+	}
+	render() {
+		const { session } = this.props;
+		const { rows, columns, top } = session.viewport.get();
+		const lines = session.lines.get();
+		const left = Math.min(session.viewport.get().left, Math.max(0, lines.reduce((width, line) => Math.max(width, [...line].length), 0) - columns));
+		const capacity = Math.max(1, rows - 2);
+		const start = Math.min(top, Math.max(0, lines.length - capacity));
+		const schema = session.schema.get();
+		return /* @__PURE__ */ jsxs(Box, {
+			flexDirection: "column",
+			width: columns,
+			height: rows,
+			flexShrink: 0,
+			overflow: "hidden",
+			children: [
+				rows > 1 && /* @__PURE__ */ jsx(Box, {
+					height: 1,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: /* @__PURE__ */ jsx(Text, {
+						bold: true,
+						color: "cyan",
+						wrap: "truncate-end",
+						children: schema.kind === "loaded" ? `SCHEMA ${safeTerminalText(schema.schema.id)}` : "SCHEMA"
+					})
+				}),
+				Array.from({ length: capacity }, (_, offset) => /* @__PURE__ */ jsx(Box, {
+					height: 1,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: /* @__PURE__ */ jsx(Text, {
+						wrap: "truncate-end",
+						children: [...lines[start + offset] ?? ""].slice(left).join("") || " "
+					})
+				}, offset)),
+				rows > 2 && /* @__PURE__ */ jsx(Box, {
+					height: 1,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: /* @__PURE__ */ jsx(Text, {
+						dimColor: true,
+						wrap: "truncate-end",
+						children: `Lines ${start + 1}–${Math.min(lines.length, start + capacity)}/${lines.length} · column ${left + 1}`
+					})
+				})
+			]
+		});
+	}
+};
+//#endregion
+//#region src/ui/ViewController.ts
+var ViewController = class extends Disposable {
+	channel;
+	selection;
+	schema;
+	listings;
+	tab = observableValue(this, "methods");
+	kind = observableValue(this, "interface");
+	session = observableValue(this, void 0);
+	error = observableValue(this, void 0);
+	connectionGeneration = observableValue(this, 0);
+	connected = observableValue(this, true);
+	generation = 0;
+	savedState;
+	sessionKey;
+	pendingCleanup = /* @__PURE__ */ new Set();
+	constructor(channel, selection, schema, listings) {
+		super();
+		this.channel = channel;
+		this.selection = selection;
+		this.schema = schema;
+		this.listings = listings;
+		this._register(autorun((reader) => {
+			const tab = this.tab.read(reader);
+			const target = this.target.read(reader);
+			this.connectionGeneration.read(reader);
+			const connected = this.connected.read(reader);
+			const generation = ++this.generation;
+			const previous = this.session.get();
+			if (previous && this.sessionKey) this.savedState = {
+				key: this.sessionKey,
+				state: previous.captureState?.()
+			};
+			this.stopSession(previous);
+			this.session.set(void 0, void 0);
+			this.error.set(void 0, void 0);
+			if (tab === "schema") {
+				const key = `schema:${target?.id ?? ""}`;
+				const session = new SchemaSession(this.schema);
+				if (this.savedState?.key === key) session.restoreState(this.savedState.state);
+				this.sessionKey = key;
+				this.session.set(session, void 0);
+				return;
+			}
+			const view = views.find((value) => value.id === tab);
+			if (!view || !target || !matchesTarget(target, view) || !connected) return;
+			const key = `${tab}:${target.id}`;
+			resolveViewTarget(channel, view, target.id).then((context) => {
+				if (generation !== this.generation) return;
+				const session = view.createSession(context);
+				if (this.savedState?.key === key) session.restoreState?.(this.savedState.state);
+				this.sessionKey = key;
+				this.session.set(session, void 0);
+			}).catch((error) => {
+				if (generation === this.generation) this.error.set(String(error), void 0);
+			});
+		}));
+	}
+	target = derived(this, (reader) => {
+		const selection = this.selection.read(reader);
+		if (!selection) return void 0;
+		const state = this.schema.read(reader);
+		const all = this.listings();
+		const listing = all.find((value) => value.serviceId === selection.serviceId && value.interfaceId === selection.interfaceId && !!value.isDefault === !!selection.isDefault);
+		const selected = {
+			...selection,
+			discoveredFrom: listing?.discoveredFrom ?? selection.serviceId,
+			hash: listing?.hash,
+			tags: state.kind === "loaded" ? state.schema.tags : listing?.tags
+		};
+		if (this.kind.read(reader) === "interface") return interfaceTarget(selected);
+		const interfaces = [];
+		for (const value of [selected, ...all.filter((value) => value.serviceId === selected.serviceId && value.discoveredFrom === selected.discoveredFrom)]) if (!interfaces.some((item) => item.interfaceId === value.interfaceId)) interfaces.push(value);
+		return {
+			id: targetId("service", selected),
+			kind: "service",
+			serviceId: selected.serviceId,
+			discoveredFrom: selected.discoveredFrom,
+			interfaces
+		};
+	});
+	tabs = derived(this, (reader) => {
+		const target = this.target.read(reader);
+		return [
+			{
+				id: "methods",
+				title: "Methods",
+				condition: "interface:any | service:any"
+			},
+			{
+				id: "schema",
+				title: "Schema",
+				condition: "interface:any | service:any"
+			},
+			...views.filter((view) => target && matchesTarget(target, view)).map((view) => ({
+				id: view.id,
+				title: view.title,
+				condition: view.conditions.map(formatCondition).join(" | ")
+			}))
+		];
+	});
+	cycleTab() {
+		const tabs = this.tabs.get();
+		const index = tabs.findIndex((tab) => tab.id === this.tab.get());
+		this.tab.set(tabs[(index + 1) % tabs.length].id, void 0);
+	}
+	toggleKind() {
+		this.kind.set(this.kind.get() === "interface" ? "service" : "interface", void 0);
+	}
+	disconnect() {
+		this.connected.set(false, void 0);
+	}
+	reconnect() {
+		if (!this.connected.get()) this.connected.set(true, void 0);
+		else this.connectionGeneration.set(this.connectionGeneration.get() + 1, void 0);
+	}
+	stopSession(session) {
+		session?.dispose();
+		const cleanup = session?.disposeAsync?.();
+		if (!cleanup) return;
+		this.pendingCleanup.add(cleanup);
+		cleanup.then(() => this.pendingCleanup.delete(cleanup), () => this.pendingCleanup.delete(cleanup));
+	}
+	async waitForIdle() {
+		await Promise.allSettled([...this.pendingCleanup]);
+	}
+	dispose() {
+		++this.generation;
+		this.stopSession(this.session.get());
+		super.dispose();
+	}
+};
+//#endregion
 //#region src/ui/UiModel.ts
 /**
 * View model for the TUI. Owns the live channel and an in-memory schema cache
@@ -15,6 +295,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 */
 var UiModel = class extends Disposable {
 	_channel;
+	views;
 	/** Initial directory fetch — kicked off in the constructor. */
 	servicesPromise;
 	/** Non-fatal discovery failures for services that could not be inspected. */
@@ -63,6 +344,7 @@ var UiModel = class extends Disposable {
 			return result.services;
 		});
 		this.servicesPromise.promise.catch(() => {});
+		this.views = this._register(new ViewController(_channel, this.selection, this.currentSchemaState, () => this.servicesPromise.promiseResult.get()?.data ?? []));
 		this._register(autorun((reader) => {
 			const sel = this.selection.read(reader);
 			if (!sel) return;
@@ -617,24 +899,171 @@ function pad(text, width) {
 	return text.slice(0, width - 1) + "…";
 }
 //#endregion
+//#region src/ui/ViewArea.tsx
+/** Class binding keeps contributed views hook-free. Models own their sessions. */
+var ViewArea = class extends React.Component {
+	state = { revision: 0 };
+	subscription;
+	componentDidMount() {
+		this.subscription = autorun((reader) => {
+			const model = this.props.model;
+			model.views.tab.read(reader);
+			model.views.kind.read(reader);
+			model.views.tabs.read(reader);
+			model.views.session.read(reader);
+			model.views.error.read(reader);
+			model.focusedColumn.read(reader);
+			model.currentSchemaState.read(reader);
+			this.setState((previous) => ({ revision: previous.revision + 1 }));
+		});
+	}
+	componentWillUnmount() {
+		this.subscription?.dispose();
+	}
+	render() {
+		const model = this.props.model;
+		const views = model.views;
+		const selected = views.tab.get();
+		const tabs = views.tabs.get();
+		const current = tabs.find((tab) => tab.id === selected);
+		const chromeRows = this.props.chromeRows ?? 2;
+		const contentRows = Math.max(1, this.props.height - chromeRows);
+		return /* @__PURE__ */ jsxs(Box, {
+			flexDirection: "column",
+			flexGrow: 1,
+			flexBasis: 0,
+			minWidth: 0,
+			height: this.props.height,
+			overflow: "hidden",
+			children: [
+				chromeRows > 0 && /* @__PURE__ */ jsx(Box, {
+					height: 1,
+					flexShrink: 0,
+					children: /* @__PURE__ */ jsxs(Text, {
+						wrap: "truncate-end",
+						children: [
+							views.kind.get(),
+							": ",
+							tabs.map((tab) => tab.id === selected ? `[${tab.title}]` : tab.title).join("  ")
+						]
+					})
+				}),
+				chromeRows > 1 && /* @__PURE__ */ jsx(Box, {
+					height: 1,
+					flexShrink: 0,
+					children: /* @__PURE__ */ jsx(Text, {
+						dimColor: true,
+						wrap: "truncate-end",
+						children: safeTerminalText(current?.condition ?? "Unavailable for this target")
+					})
+				}),
+				selected === "methods" ? /* @__PURE__ */ jsx(Box, {
+					height: contentRows,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: this.props.children
+				}) : views.error.get() ? /* @__PURE__ */ jsx(Text, {
+					color: "red",
+					children: safeTerminalText(views.error.get())
+				}) : views.session.get() ? /* @__PURE__ */ jsx(ViewFrame, {
+					session: views.session.get(),
+					rows: contentRows,
+					maxColumns: this.props.columns,
+					tabbed: true,
+					active: model.focusedColumn.get() > 0
+				}) : /* @__PURE__ */ jsx(Text, { children: current ? "Loading view…" : "View unavailable; press tab" })
+			]
+		});
+	}
+};
+var ViewFooter = class extends React.Component {
+	state = { revision: 0 };
+	subscription;
+	componentDidMount() {
+		this.subscription = autorun((reader) => {
+			this.props.model.views.tab.read(reader);
+			this.props.model.views.session.read(reader);
+			this.props.model.focusedColumn.read(reader);
+			this.props.model.formEditing.read(reader);
+			this.setState((previous) => ({ revision: previous.revision + 1 }));
+		});
+	}
+	componentWillUnmount() {
+		this.subscription?.dispose();
+	}
+	render() {
+		const model = this.props.model;
+		if (model.views.session.get()) return /* @__PURE__ */ jsx(Text, {
+			dimColor: true,
+			children: model.focusedColumn.get() === 0 ? "Enter/→: focus view" : "View commands shown above"
+		});
+		const noop = () => {};
+		const commands = hostCommands({
+			quit: noop,
+			nextTab: noop,
+			toggleScope: noop,
+			back: model.views.tab.get() !== "methods" ? noop : void 0
+		}, model.formEditing.get());
+		return /* @__PURE__ */ jsx(Text, {
+			dimColor: true,
+			wrap: "truncate-end",
+			children: (model.views.tab.get() === "methods" ? "←/→: switch column · ↑/↓: move · Enter: edit/submit · Esc: cancel edit · " : "") + formatCommandLegend(commands)
+		});
+	}
+};
+//#endregion
+//#region src/views/TerminalKeyInput.tsx
+/** Readline preserves named keys such as Home/End that Ink's Key type omits. */
+var TerminalKeyInput = class extends React.Component {
+	onKey = (input, key) => this.props.onKey({
+		...key,
+		input
+	});
+	componentDidMount() {
+		emitKeypressEvents(stdin);
+		stdin.on("keypress", this.onKey);
+	}
+	componentWillUnmount() {
+		stdin.off("keypress", this.onKey);
+	}
+	render() {
+		return null;
+	}
+};
+//#endregion
 //#region src/ui/App.tsx
-const IDENTITY_HEADER_H = 1;
-const FOOTER_H = 1;
-const RESULT_H = 8;
 /** Column chrome that is not list rows: top border + bottom border + title. */
 const COLUMN_CHROME_H = 3;
-/** Re-render on terminal resize so the height math tracks the live row count. */
-function useTerminalRows() {
-	const { stdout } = useStdout();
-	const [rows, setRows] = React.useState(stdout.rows ?? 30);
-	React.useEffect(() => {
-		const onResize = () => setRows(stdout.rows ?? 30);
-		stdout.on("resize", onResize);
-		return () => {
-			stdout.off("resize", onResize);
-		};
-	}, [stdout]);
-	return rows;
+function uiLayout(columns, rows, focusedColumn, warningCount = 0) {
+	const width = Math.max(1, Math.floor(columns));
+	const height = Math.max(1, Math.floor(rows));
+	const compact = width < 60;
+	const headerRows = height > 2 ? 1 + Math.min(warningCount, Math.max(0, height - 10)) : 0;
+	const footerRows = height > 1 ? 1 : 0;
+	const bodyRows = Math.max(1, height - headerRows - footerRows);
+	const sidebarWidth = compact ? focusedColumn === 0 ? width : 0 : Math.min(28, Math.max(18, Math.floor(width * .22)));
+	const mainWidth = width - sidebarWidth;
+	const viewHeaderRows = Math.min(bodyRows - 1, height < 20 ? 1 : 2);
+	const contentRows = bodyRows - viewHeaderRows;
+	const resultRows = Math.min(Math.max(0, contentRows - 1), Math.max(3, Math.min(6, Math.floor(contentRows / 3))));
+	const methodRows = contentRows - resultRows;
+	const splitMethods = mainWidth >= 65;
+	return {
+		width,
+		height,
+		compact,
+		headerRows,
+		footerRows,
+		bodyRows,
+		sidebarWidth,
+		mainWidth,
+		viewHeaderRows,
+		contentRows,
+		resultRows,
+		methodRows,
+		splitMethods,
+		methodWidth: splitMethods ? Math.min(30, Math.max(22, Math.floor(mainWidth * .35))) : mainWidth
+	};
 }
 /**
 * Miller-column TUI: three columns left → right (services, methods, form)
@@ -643,67 +1072,162 @@ function useTerminalRows() {
 * 0 / 1 immediately previews into the column to its right.
 */
 const App = ({ model }) => {
-	const focusedColumn = useObservable(model.focusedColumn);
-	const editing = useObservable(model.formEditing);
-	const discoveryWarnings = useObservable(model.discoveryWarnings);
-	const termRows = useTerminalRows();
 	const { exit } = useApp();
-	useInput((input, key) => {
-		if (editing) return;
-		if (input === "q") {
-			exit();
+	const { stdout } = useStdout();
+	useInput(() => {});
+	return /* @__PURE__ */ jsx(AppLayout, {
+		model,
+		exit,
+		stdout
+	});
+};
+var AppLayout = class extends React.Component {
+	state = { revision: 0 };
+	measuredColumns = observableValue(this, void 0);
+	root = React.createRef();
+	mounted = false;
+	subscription;
+	invalidate = () => this.setState((previous) => ({ revision: previous.revision + 1 }));
+	componentDidMount() {
+		this.mounted = true;
+		this.props.stdout.prependListener("resize", this.invalidate);
+		this.subscription = autorun((reader) => {
+			const { model } = this.props;
+			model.focusedColumn.read(reader);
+			model.formEditing.read(reader);
+			model.discoveryWarnings.read(reader);
+			model.views.tab.read(reader);
+			this.measuredColumns.read(reader);
+			this.invalidate();
+		});
+		this.measure();
+	}
+	componentDidUpdate() {
+		this.measure();
+	}
+	measure() {
+		queueMicrotask(() => {
+			if (!this.mounted || !this.root.current) return;
+			const width = Math.max(1, Math.floor(measureElement(this.root.current).width));
+			if (width !== this.measuredColumns.get()) this.measuredColumns.set(width, void 0);
+		});
+	}
+	componentWillUnmount() {
+		this.mounted = false;
+		this.subscription?.dispose();
+		this.props.stdout.off("resize", this.invalidate);
+	}
+	onKey = (event) => {
+		const { model, exit } = this.props;
+		const focusedColumn = model.focusedColumn.get();
+		if (model.formEditing.get()) {
+			if (matchesKey({
+				key: "c",
+				ctrl: true
+			}, event)) exit();
 			return;
 		}
-		if (key.leftArrow && focusedColumn > 0) {
+		const inView = model.views.tab.get() !== "methods" && focusedColumn > 0;
+		if (dispatchHostKey(inView ? model.views.session.get() : void 0, event, {
+			quit: exit,
+			nextTab: () => model.views.cycleTab(),
+			toggleScope: () => model.views.toggleKind(),
+			back: inView ? () => model.focusColumn(0) : void 0
+		})) return;
+		if (inView) return;
+		if (event.name === "left" && focusedColumn > 0) {
 			model.focusColumn(focusedColumn - 1);
 			return;
 		}
-		if (key.rightArrow && focusedColumn < 2) {
+		if (event.name === "right" && focusedColumn < 2) {
 			model.focusColumn(focusedColumn + 1);
 			return;
 		}
-	});
-	const headerHeight = IDENTITY_HEADER_H + discoveryWarnings.length;
-	const bodyHeight = Math.max(4, termRows - headerHeight - RESULT_H - FOOTER_H);
-	const listHeight = Math.max(1, bodyHeight - COLUMN_CHROME_H);
-	return /* @__PURE__ */ jsxs(Box, {
-		flexDirection: "column",
-		height: termRows,
-		children: [
-			/* @__PURE__ */ jsx(Header, {
-				model,
-				warnings: discoveryWarnings
-			}),
-			/* @__PURE__ */ jsxs(Box, {
-				height: bodyHeight,
-				children: [
-					/* @__PURE__ */ jsx(ServicesColumn, {
-						model,
-						focused: focusedColumn === 0,
-						height: bodyHeight,
-						listHeight
-					}),
-					/* @__PURE__ */ jsx(MethodsColumn, {
-						model,
-						focused: focusedColumn === 1,
-						height: bodyHeight,
-						listHeight
-					}),
-					/* @__PURE__ */ jsx(FormColumn, {
+	};
+	render() {
+		const { model, stdout } = this.props;
+		const focusedColumn = model.focusedColumn.get();
+		const warnings = model.discoveryWarnings.get();
+		const layout = uiLayout(Math.min(this.measuredColumns.get() ?? 1, stdout.columns ?? 80), stdout.rows ?? 30, focusedColumn, warnings.length);
+		return /* @__PURE__ */ jsxs(Box, {
+			ref: this.root,
+			flexDirection: "column",
+			width: "100%",
+			minWidth: 0,
+			height: layout.height,
+			overflow: "hidden",
+			children: [
+				/* @__PURE__ */ jsx(TerminalKeyInput, { onKey: this.onKey }),
+				layout.headerRows > 0 && /* @__PURE__ */ jsx(Box, {
+					height: layout.headerRows,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: /* @__PURE__ */ jsx(Header, {
 						model,
-						focused: focusedColumn === 2,
-						height: bodyHeight,
-						listHeight
+						warnings: warnings.slice(0, layout.headerRows - 1)
 					})
-				]
-			}),
-			/* @__PURE__ */ jsx(ResultPane, { model }),
-			/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, {
-				dimColor: true,
-				children: "←/→: switch column | ↑/↓: move | enter: edit / submit | esc: cancel edit | q: quit"
-			}) })
-		]
-	});
+				}),
+				/* @__PURE__ */ jsxs(Box, {
+					width: layout.width,
+					height: layout.bodyRows,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: [layout.sidebarWidth > 0 && /* @__PURE__ */ jsx(ServicesColumn, {
+						model,
+						focused: focusedColumn === 0,
+						width: layout.sidebarWidth,
+						height: layout.bodyRows,
+						listHeight: Math.max(1, layout.bodyRows - COLUMN_CHROME_H)
+					}), layout.mainWidth > 0 && /* @__PURE__ */ jsx(Box, {
+						width: layout.mainWidth,
+						height: layout.bodyRows,
+						flexShrink: 0,
+						overflow: "hidden",
+						children: /* @__PURE__ */ jsx(ViewArea, {
+							model,
+							height: layout.bodyRows,
+							columns: layout.mainWidth,
+							chromeRows: layout.viewHeaderRows,
+							children: /* @__PURE__ */ jsxs(Box, {
+								flexDirection: "column",
+								height: layout.contentRows,
+								width: layout.mainWidth,
+								flexShrink: 0,
+								overflow: "hidden",
+								children: [/* @__PURE__ */ jsxs(Box, {
+									height: layout.methodRows,
+									width: layout.mainWidth,
+									flexShrink: 0,
+									overflow: "hidden",
+									children: [(layout.splitMethods || focusedColumn !== 2) && /* @__PURE__ */ jsx(MethodsColumn, {
+										model,
+										focused: focusedColumn === 1,
+										width: layout.methodWidth,
+										height: layout.methodRows,
+										listHeight: Math.max(1, layout.methodRows - COLUMN_CHROME_H)
+									}), (layout.splitMethods || focusedColumn === 2) && /* @__PURE__ */ jsx(FormColumn, {
+										model,
+										focused: focusedColumn === 2,
+										height: layout.methodRows,
+										listHeight: Math.max(1, layout.methodRows - COLUMN_CHROME_H)
+									})]
+								}), layout.resultRows > 0 && /* @__PURE__ */ jsx(ResultPane, {
+									model,
+									height: layout.resultRows
+								})]
+							})
+						})
+					})]
+				}),
+				layout.footerRows > 0 && /* @__PURE__ */ jsx(Box, {
+					height: layout.footerRows,
+					flexShrink: 0,
+					overflow: "hidden",
+					children: /* @__PURE__ */ jsx(ViewFooter, { model })
+				})
+			]
+		});
+	}
 };
 /** "▲ N more" / "▼ N more" indicator row, shown only when items are hidden. */
 const ScrollIndicator = ({ direction, count }) => {
@@ -717,17 +1241,24 @@ const Header = ({ model, warnings }) => {
 	const identity = useObservable(model.identity);
 	return /* @__PURE__ */ jsxs(Box, {
 		flexDirection: "column",
-		children: [/* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
-			dimColor: true,
-			children: "identity: "
-		}), /* @__PURE__ */ jsx(Text, { children: identity ?? "(resolving…)" })] }), warnings.map((warning) => /* @__PURE__ */ jsxs(Text, {
+		children: [/* @__PURE__ */ jsxs(Box, {
+			height: 1,
+			flexShrink: 0,
+			children: [/* @__PURE__ */ jsx(Text, {
+				dimColor: true,
+				children: "identity: "
+			}), /* @__PURE__ */ jsx(Text, {
+				wrap: "truncate-end",
+				children: identity ?? "(resolving…)"
+			})]
+		}), warnings.map((warning) => /* @__PURE__ */ jsxs(Text, {
 			color: "yellow",
 			wrap: "truncate-end",
 			children: ["! ", warning]
 		}, warning))]
 	});
 };
-const ServicesColumn = ({ model, focused, height, listHeight }) => {
+const ServicesColumn = ({ model, focused, width, height, listHeight }) => {
 	const result = useObservable(model.servicesPromise.promiseResult);
 	const selection = useObservable(model.selection);
 	useInput((_input, key) => {
@@ -741,7 +1272,7 @@ const ServicesColumn = ({ model, focused, height, listHeight }) => {
 	return /* @__PURE__ */ jsx(Column, {
 		title: "Services",
 		focused,
-		width: "25%",
+		width,
 		height,
 		children: !result ? /* @__PURE__ */ jsx(Text, {
 			dimColor: true,
@@ -775,7 +1306,7 @@ const ServicesColumn = ({ model, focused, height, listHeight }) => {
 		] })
 	});
 };
-const MethodsColumn = ({ model, focused, height, listHeight }) => {
+const MethodsColumn = ({ model, focused, width, height, listHeight }) => {
 	const selection = useObservable(model.selection);
 	const schemaState = useObservable(model.currentSchemaState);
 	const methods = useObservable(model.currentMethods);
@@ -789,7 +1320,7 @@ const MethodsColumn = ({ model, focused, height, listHeight }) => {
 	return /* @__PURE__ */ jsx(Column, {
 		title: "Methods",
 		focused,
-		width: "25%",
+		width,
 		height,
 		children: !selection ? /* @__PURE__ */ jsx(Text, {
 			dimColor: true,
@@ -938,7 +1469,7 @@ const MethodForm = ({ model, method, focused, listHeight }) => {
 		children: [
 			/* @__PURE__ */ jsx(Text, {
 				bold: true,
-				children: (method.result === void 0 ? "notify  " : "request ") + selection?.methodName
+				children: (method.result === void 0 ? "notify  " : "request ") + method.name
 			}),
 			method.summary ? /* @__PURE__ */ jsx(Text, {
 				dimColor: true,
@@ -993,6 +1524,7 @@ const Column = ({ title, focused, children, width, flexGrow, height }) => {
 		width,
 		flexGrow,
 		height,
+		minWidth: 0,
 		overflow: "hidden",
 		borderStyle: "single",
 		borderColor: focused ? "cyan" : void 0,
@@ -1003,13 +1535,14 @@ const Column = ({ title, focused, children, width, flexGrow, height }) => {
 		}), children]
 	});
 };
-const ResultPane = ({ model }) => {
+const ResultPane = ({ model, height }) => {
 	const promise = useObservable(model.lastCall);
 	const result = useObservable(promise ? promise.promiseResult : NO_RESULT);
 	const chunks = useObservable(model.streamChunks);
 	return /* @__PURE__ */ jsxs(Box, {
 		flexDirection: "column",
-		height: RESULT_H,
+		height,
+		flexShrink: 0,
 		overflow: "hidden",
 		borderStyle: "single",
 		paddingX: 1,
@@ -1056,20 +1589,21 @@ function formatError(e) {
 //#endregion
 //#region src/ui/runUi.tsx
 async function runUi(opts) {
-	if (isHubEndpoint(opts.endpoint)) await _runUiReconnecting(opts.endpoint, opts.principalSpec);
-	else await _runUiOnce(opts.endpoint, opts.principalSpec);
+	if (isHubEndpoint(opts.endpoint) && opts.profile !== "rpc") await _runUiReconnecting(opts.endpoint, opts.principalSpec, opts.schema);
+	else await _runUiOnce(opts.endpoint, opts.principalSpec, opts.schema, opts.profile);
 }
 /** Non-Hub endpoints: a single connection, no redial. */
-async function _runUiOnce(endpoint, principalSpec) {
+async function _runUiOnce(endpoint, principalSpec, schema, profile) {
 	const conn = await connect(endpoint);
-	const identity = _isRawEndpoint(endpoint) ? "unsigned (raw endpoint)" : _formatIdentity(await setupSigning(conn.channel, conn.signing, principalSpec, { negotiateHubCaps: false }));
-	const model = new UiModel(conn.channel);
+	const identity = _isRawEndpoint(endpoint) || profile === "rpc" ? "unsigned (raw endpoint)" : _formatIdentity(await setupSigning(conn.channel, conn.signing, principalSpec, { negotiateHubCaps: false }));
+	const model = new UiModel(schema ? withStaticHubReflection(conn.channel, schema) : conn.channel);
 	model.identity.set(identity, void 0);
-	const instance = render(/* @__PURE__ */ jsx(App, { model }));
+	const instance = render(/* @__PURE__ */ jsx(App, { model }), { exitOnCtrlC: false });
 	try {
 		await instance.waitUntilExit();
 	} finally {
 		model.dispose();
+		await model.views.waitForIdle();
 		conn.close();
 	}
 }
@@ -1082,7 +1616,7 @@ function _isRawEndpoint(endpoint) {
 * open a fresh hub channel, install signing, and point the swappable sender at
 * the new signed channel. The TUI is rendered once, after the first connect.
 */
-async function _runUiReconnecting(endpoint, principalSpec) {
+async function _runUiReconnecting(endpoint, principalSpec, schema) {
 	const swappable = new SwappableSender();
 	let model;
 	const hubEndpoint = endpoint.kind === "ws" ? endpoint.url : endpoint.path;
@@ -1094,16 +1628,29 @@ async function _runUiReconnecting(endpoint, principalSpec) {
 		const signed = SigningSender.wrapChannel(channel, signing).sender;
 		const session = await setupSigning(signed, signing, principalSpec, { negotiateHubCaps: true });
 		swappable.setTarget(signed);
+		channel.onClose(() => {
+			swappable.setTarget(void 0);
+			model?.views.disconnect();
+			model?.identity.set("disconnected; reconnecting…", void 0);
+		});
 		if (!model) {
-			model = new UiModel(swappable);
+			model = new UiModel(schema ? withStaticHubReflection(swappable, schema) : swappable);
 			model.identity.set(_formatIdentity(session), void 0);
-			render(/* @__PURE__ */ jsx(App, { model })).waitUntilExit().finally(() => handle.stop());
-		} else model.identity.set(_formatIdentity(session), void 0);
+			render(/* @__PURE__ */ jsx(App, { model }), { exitOnCtrlC: false }).waitUntilExit().then(async () => {
+				model?.dispose();
+				await model?.views.waitForIdle();
+				handle.stop();
+			}, () => handle.stop());
+		} else {
+			model.identity.set(_formatIdentity(session), void 0);
+			model.views.reconnect();
+		}
 	});
 	try {
 		await handle.done;
 	} finally {
 		model?.dispose();
+		await model?.views.waitForIdle();
 	}
 }
 /** One-line identity label for the TUI header (source + truncated nodeId). */
@@ -1140,4 +1687,4 @@ var SwappableSender = class {
 //#endregion
 export { runUi };
 
-//# sourceMappingURL=runUi-CuJr8_tY.js.map
+//# sourceMappingURL=runUi-Dp2P3aNN.js.map