mu-coding 0.1.0 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mu-coding",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Minimal terminal AI assistant for local models",
   "type": "module",
   "bin": {
@@ -12,8 +12,8 @@
   },
   "dependencies": {
     "ink": "^7.0.1",
-    "mu-agents": "0.1.0",
-    "mu-provider": "0.1.0",
+    "mu-agents": "0.2.0",
+    "mu-provider": "0.2.0",
     "react": "^19.2.5"
   }
 }

package/src/cli.ts

@@ -12,12 +12,14 @@ function printHelp(): never {
   console.log(`mu — minimal terminal AI assistant
 
 Usage:
-  mu                  Start interactive chat
-  mu -p "prompt"      Single-shot prompt, then exit
-  mu -m model -p "p"  Single-shot with specific model
-  mu -m model         Interactive with specific model
-  mu -c               Continue most recent session
-  mu --session <path> Resume a specific session file
+  mu                        Start interactive chat
+  mu -p "prompt"            Single-shot prompt, then exit
+  mu -m model -p "p"        Single-shot with specific model
+  mu -m model               Interactive with specific model
+  mu -c                     Continue most recent session
+  mu --session <path>       Resume a specific session file
+  mu install npm:<package>  Install a plugin from npm
+  mu uninstall npm:<pkg>    Remove an installed plugin
 
 Config (XDG):
   ~/.config/mu/config.json  — configuration (baseUrl, model, streamTimeoutMs)

package/src/install.ts

@@ -0,0 +1,88 @@
+import { execSync } from 'node:child_process';
+import { existsSync, mkdirSync, writeFileSync } from 'node:fs';
+import { join } from 'node:path';
+import { getDataDir, loadConfig, saveConfig } from './config';
+
+const INIT_PACKAGE_JSON = JSON.stringify({ private: true, dependencies: {} }, null, 2);
+
+function ensureDataDir(): string {
+  const dataDir = getDataDir();
+  mkdirSync(dataDir, { recursive: true });
+
+  const pkgPath = join(dataDir, 'package.json');
+  if (!existsSync(pkgPath)) {
+    writeFileSync(pkgPath, INIT_PACKAGE_JSON, 'utf-8');
+  }
+
+  return dataDir;
+}
+
+function stripNpmPrefix(specifier: string): string {
+  if (!specifier.startsWith('npm:')) {
+    console.error(`Error: package specifier must start with npm: — got "${specifier}"`);
+    process.exit(1);
+  }
+  return specifier.slice(4);
+}
+
+export async function runInstall(args: string[]): Promise<void> {
+  if (args.length === 0) {
+    console.error('Usage: mu install npm:<package>');
+    process.exit(1);
+  }
+
+  const dataDir = ensureDataDir();
+  const config = loadConfig();
+  const plugins = config.plugins ?? [];
+
+  for (const specifier of args) {
+    const bare = stripNpmPrefix(specifier);
+
+    console.log(`Installing ${bare}...`);
+    try {
+      execSync(`bun add ${bare}`, { cwd: dataDir, stdio: 'inherit' });
+    } catch {
+      console.error(`Failed to install ${bare}`);
+      process.exit(1);
+    }
+
+    // Add to plugins if not already present
+    const existing = plugins.some((p) => (typeof p === 'string' ? p : p.name) === specifier);
+    if (!existing) {
+      plugins.push(specifier);
+    }
+
+    console.log(`✓ ${specifier}`);
+  }
+
+  saveConfig({ plugins });
+}
+
+export async function runUninstall(args: string[]): Promise<void> {
+  if (args.length === 0) {
+    console.error('Usage: mu uninstall npm:<package>');
+    process.exit(1);
+  }
+
+  const dataDir = ensureDataDir();
+  const config = loadConfig();
+  let plugins = config.plugins ?? [];
+
+  for (const specifier of args) {
+    const bare = stripNpmPrefix(specifier);
+
+    console.log(`Removing ${bare}...`);
+    try {
+      execSync(`bun remove ${bare}`, { cwd: dataDir, stdio: 'inherit' });
+    } catch {
+      console.error(`Failed to remove ${bare}`);
+      process.exit(1);
+    }
+
+    plugins = plugins.filter((p) => (typeof p === 'string' ? p : p.name) !== specifier);
+
+    console.log(`✓ Removed ${specifier}`);
+  }
+
+  saveConfig({ plugins });
+}

package/src/main.tsx

@@ -1,12 +1,15 @@
 #!/usr/bin/env bun
 import { readdirSync } from 'node:fs';
-import { join } from 'node:path';
+import { createRequire } from 'node:module';
+import { join, resolve } from 'node:path';
 import { render } from 'ink';
 import { createBuiltinPlugin, PluginRegistry } from 'mu-agents';
 import { parseArgs, resolveInitialMessages } from './cli';
-import { type AppConfig, getPluginsDir, loadConfig } from './config';
+import { type AppConfig, getDataDir, getPluginsDir, loadConfig } from './config';
 import { runSingleShot } from './singleShot';
+import { handleSubcommand } from './subcommands';
 import { ChatPanel } from './tui/components/chat/ChatPanel';
+import { InkUIService } from './tui/services/uiService';
 
 function discoverPluginFiles(): string[] {
   const dir = getPluginsDir();
@@ -19,7 +22,78 @@ function discoverPluginFiles(): string[] {
   }
 }
 
-async function createRegistry(cwd: string, config: AppConfig) {
+/**
+ * Resolve an npm: specifier to an absolute path via the data dir's node_modules.
+ */
+function formatPluginError(name: string, err: unknown): string {
+  const parts: string[] = [`Plugin "${name}" failed`];
+  let current: unknown = err;
+  while (current) {
+    if (current instanceof Error) {
+      parts.push(current.message);
+      current = current.cause;
+    } else {
+      parts.push(String(current));
+      break;
+    }
+  }
+  return parts.join(': ');
+}
+
+function resolveNpmPlugin(specifier: string): string {
+  const bare = specifier.slice(4);
+  const dataDir = getDataDir();
+  try {
+    const require = createRequire(resolve(dataDir, 'package.json'));
+    return require.resolve(bare);
+  } catch (err) {
+    throw new Error(`Cannot resolve "${bare}" from ${dataDir}/node_modules — is it installed?`, { cause: err });
+  }
+}
+
+/**
+ * Load a plugin by name or path, resolving from this package's context.
+ * This allows workspace packages (like mu-pi-compat) to be found even though
+ * mu-agents' registry can't resolve them from its own location.
+ *
+ * Plugins prefixed with npm: are resolved from ~/.local/share/mu/node_modules/.
+ */
+async function loadPluginFromHere(
+  registry: PluginRegistry,
+  name: string,
+  pluginConfig?: Record<string, unknown>,
+  uiService?: InkUIService,
+): Promise<void> {
+  try {
+    const target = name.startsWith('npm:') ? resolveNpmPlugin(name) : name;
+    const mod = await import(target);
+    const factory = mod.default ?? mod.createPlugin;
+
+    if (typeof factory === 'function') {
+      const plugin = factory(pluginConfig ?? {});
+      await registry.register(plugin);
+    } else if (typeof mod === 'object' && mod !== null && 'name' in mod) {
+      await registry.register(mod);
+    } else {
+      const exportKeys = Object.keys(mod).join(', ') || '(none)';
+      uiService?.notify(`Plugin "${name}": no plugin export found. Exports: [${exportKeys}]`, 'error');
+    }
+  } catch (err) {
+    // npm: plugins don't fall back — they must resolve from data dir
+    if (name.startsWith('npm:')) {
+      uiService?.notify(formatPluginError(name, err), 'error');
+      return;
+    }
+    // Non-npm plugins fall back to registry loader (for file paths)
+    try {
+      await registry.loadPlugin(name, pluginConfig);
+    } catch (fallbackErr) {
+      uiService?.notify(formatPluginError(name, fallbackErr), 'error');
+    }
+  }
+}
+
+async function createRegistry(cwd: string, config: AppConfig, uiService: InkUIService) {
   const registry = new PluginRegistry({ cwd, config: {} });
 
   // Register built-in tools (read, write, edit, bash)
@@ -30,12 +104,16 @@ async function createRegistry(cwd: string, config: AppConfig) {
     await registry.loadPlugin(filePath);
   }
 
-  // Load npm package plugins from config
+  // Load configured plugins
   if (config.plugins?.length) {
     for (const entry of config.plugins) {
       const name = typeof entry === 'string' ? entry : entry.name;
       const pluginConfig = typeof entry === 'string' ? undefined : entry.config;
-      await registry.loadPlugin(name, pluginConfig);
+
+      // Inject uiService for plugins that accept it (duck typing)
+      const finalConfig = pluginConfig ? { ...pluginConfig, ui: uiService } : { ui: uiService };
+
+      await loadPluginFromHere(registry, name, finalConfig, uiService);
     }
   }
 
@@ -43,11 +121,14 @@ async function createRegistry(cwd: string, config: AppConfig) {
 }
 
 async function main() {
+  if (await handleSubcommand()) return;
+
   const cliArgs = parseArgs();
   const config = loadConfig(cliArgs.model);
   const root = process.cwd();
 
-  const registry = await createRegistry(root, config);
+  const uiService = new InkUIService();
+  const registry = await createRegistry(root, config, uiService);
 
   if (cliArgs.prompt) {
     try {
@@ -64,7 +145,7 @@ async function main() {
 
   const initialMessages = resolveInitialMessages(cliArgs);
 
-  render(<ChatPanel config={config} initialMessages={initialMessages} registry={registry} />, {
+  render(<ChatPanel config={config} initialMessages={initialMessages} registry={registry} uiService={uiService} />, {
     exitOnCtrlC: false,
     kittyKeyboard: { mode: 'enabled' },
   });

package/src/subcommands.ts

@@ -0,0 +1,20 @@
+import { runInstall, runUninstall } from './install';
+
+/**
+ * Handle CLI subcommands that run before the TUI.
+ * Returns true if a subcommand was handled (caller should exit).
+ */
+export async function handleSubcommand(): Promise<boolean> {
+  const sub = process.argv[2];
+
+  switch (sub) {
+    case 'install':
+      await runInstall(process.argv.slice(3));
+      return true;
+    case 'uninstall':
+      await runUninstall(process.argv.slice(3));
+      return true;
+    default:
+      return false;
+  }
+}

package/src/tui/commands.ts

@@ -1,19 +1,33 @@
+import type { CommandContext, SlashCommand as PluginSlashCommand } from 'mu-agents';
+
 export interface SlashCommand {
   name: string;
   description: string;
-  action: string;
+  action?: string;
+  execute?: (args: string) => Promise<string | undefined>;
 }
 
-const COMMANDS: SlashCommand[] = [
+const BUILTIN_COMMANDS: SlashCommand[] = [
   { name: '/model', description: 'Select a model', action: 'model' },
   { name: '/sessions', description: 'List project sessions', action: 'sessions' },
   { name: '/new', description: 'New conversation', action: 'new' },
 ];
 
-export function matchCommands(input: string): SlashCommand[] {
+export function matchCommands(input: string, pluginCommands: PluginSlashCommand[] = []): SlashCommand[] {
   if (!input.startsWith('/')) {
     return [];
   }
   const q = input.toLowerCase();
-  return COMMANDS.filter((cmd) => cmd.name.startsWith(q));
+
+  const fromPlugins: SlashCommand[] = pluginCommands.map((pc) => ({
+    name: `/${pc.name}`,
+    description: pc.description,
+    execute: (args: string) => {
+      const ctx: CommandContext = { messages: [], cwd: process.cwd(), config: {} as CommandContext['config'] };
+      return pc.execute(args, ctx);
+    },
+  }));
+
+  const all = [...BUILTIN_COMMANDS, ...fromPlugins];
+  return all.filter((cmd) => cmd.name.startsWith(q));
 }

package/src/tui/components/chat/ChatPanel.tsx

@@ -5,6 +5,7 @@ import { useRef } from 'react';
 import { ChatContext } from '../../context/chat';
 import { useScroll } from '../../hooks/useScroll';
 import { useMeasure, useTerminalSize } from '../../hooks/useTerminal';
+import type { InkUIService } from '../../services/uiService';
 import { useChat } from '../../useChat';
 import { ChatPanelBody } from './ChatPanelBody';
 
@@ -12,10 +13,12 @@ export function ChatPanel({
   config,
   initialMessages,
   registry,
+  uiService,
 }: {
   config: ProviderConfig;
   initialMessages?: ChatMessage[];
   registry: PluginRegistry;
+  uiService?: InkUIService;
 }) {
   const ctx = useChat(config, registry, initialMessages);
   const { width, height } = useTerminalSize();
@@ -49,6 +52,7 @@ export function ChatPanel({
         isActive={!anyModalOpen}
         onScrollUp={onScrollUp}
         onScrollDown={onScrollDown}
+        uiService={uiService}
       />
     </ChatContext.Provider>
   );

package/src/tui/components/chat/ChatPanelBody.tsx

@@ -2,8 +2,11 @@ import { Box, type DOMElement as InkDOMElement } from 'ink';
 import type { StatusSegment } from 'mu-agents';
 import { useEffect, useState } from 'react';
 import { useChatContext } from '../../context/chat';
+import type { InkUIService, ToastRequest } from '../../services/uiService';
 import { MessageView, StatusBar } from '../chatLayout';
 import { InputBox } from '../inputBox';
+import { DialogLayer } from '../ui/dialogLayer';
+import { ToastContainer, useToast } from '../ui/toast';
 import { Pickers } from './Pickers';
 
 interface LayoutProps {
@@ -19,9 +22,24 @@ interface LayoutProps {
   onScrollDown: () => void;
 }
 
-export function ChatPanelBody(props: LayoutProps) {
+const TOAST_LEVEL_COLORS: Record<string, string> = {
+  info: 'cyan',
+  success: 'green',
+  warning: 'yellow',
+  error: 'red',
+};
+
+export function ChatPanelBody(props: LayoutProps & { uiService?: InkUIService }) {
   const { session, models, abort, registry } = useChatContext();
   const [pluginStatus, setPluginStatus] = useState<StatusSegment[]>([]);
+  const { toasts, show, dismiss } = useToast();
+
+  useEffect(() => {
+    if (!props.uiService) return;
+    props.uiService.onToast((toast: ToastRequest) => {
+      show(toast.message, TOAST_LEVEL_COLORS[toast.level] ?? 'white');
+    });
+  }, [props.uiService, show]);
 
   useEffect(() => {
     const refresh = () => setPluginStatus(registry.getStatusSegments());
@@ -62,6 +80,8 @@ export function ChatPanelBody(props: LayoutProps) {
         pluginStatus={pluginStatus}
       />
       <Pickers />
+      {props.uiService && <DialogLayer service={props.uiService} />}
+      <ToastContainer toasts={toasts} onDismiss={dismiss} />
     </Box>
   );
 }

package/src/tui/components/inputBox.tsx

@@ -103,7 +103,7 @@ export function InputBox({
   model = '',
   history = [],
 }: InputBoxProps) {
-  const { session, toggles, attachment, models, abort } = useChatContext();
+  const { session, toggles, attachment, models, abort, registry } = useChatContext();
 
   const actions: InputActions = {
     onCtrlC: abort.onCtrlC,
@@ -124,6 +124,7 @@ export function InputBox({
     history,
     actions,
     onSubmit,
+    pluginCommands: registry.getCommands(),
   });
 
   return (

package/src/tui/components/ui/dialogLayer.tsx

@@ -0,0 +1,156 @@
+import { Box, Text, useInput } from 'ink';
+import { useCallback, useEffect, useState } from 'react';
+import type { DialogRequest, InkUIService } from '../../services/uiService';
+import { Dropdown } from './dropdown';
+import { Modal } from './modal';
+
+// ─── Confirm Dialog ───────────────────────────────────────────────────────────
+
+function ConfirmDialog({
+  dialog,
+  onResolve,
+  onCancel,
+}: {
+  dialog: DialogRequest;
+  onResolve: (value: unknown) => void;
+  onCancel: () => void;
+}) {
+  const [selected, setSelected] = useState(0);
+
+  useInput((input, key) => {
+    if (key.escape) {
+      onCancel();
+    } else if (key.return) {
+      onResolve(selected === 0);
+    } else if (key.leftArrow || input === 'h') {
+      setSelected(0);
+    } else if (key.rightArrow || input === 'l') {
+      setSelected(1);
+    } else if (input === 'y' || input === 'Y') {
+      onResolve(true);
+    } else if (input === 'n' || input === 'N') {
+      onResolve(false);
+    }
+  });
+
+  return (
+    <Modal visible={true} title={dialog.title}>
+      {dialog.message && (
+        <Box marginBottom={1}>
+          <Text>{dialog.message}</Text>
+        </Box>
+      )}
+      <Box gap={2}>
+        <Text color={selected === 0 ? 'green' : undefined} bold={selected === 0}>
+          {selected === 0 ? '▸ ' : '  '}Yes
+        </Text>
+        <Text color={selected === 1 ? 'red' : undefined} bold={selected === 1}>
+          {selected === 1 ? '▸ ' : '  '}No
+        </Text>
+      </Box>
+      <Box marginTop={1}>
+        <Text dimColor={true}>y/n · Enter to confirm · Esc to cancel</Text>
+      </Box>
+    </Modal>
+  );
+}
+
+// ─── Select Dialog ────────────────────────────────────────────────────────────
+
+function SelectDialog({
+  dialog,
+  onResolve,
+  onCancel,
+}: {
+  dialog: DialogRequest;
+  onResolve: (value: unknown) => void;
+  onCancel: () => void;
+}) {
+  const items = (dialog.options ?? []).map((opt) => ({
+    label: opt,
+    value: opt,
+  }));
+
+  return (
+    <Modal visible={true} title={dialog.title}>
+      <Dropdown items={items} placeholder="Filter..." onSelect={(item) => onResolve(item.value)} onCancel={onCancel} />
+    </Modal>
+  );
+}
+
+// ─── Input Dialog ─────────────────────────────────────────────────────────────
+
+function InputDialog({
+  dialog,
+  onResolve,
+  onCancel,
+}: {
+  dialog: DialogRequest;
+  onResolve: (value: unknown) => void;
+  onCancel: () => void;
+}) {
+  const [value, setValue] = useState('');
+
+  useInput((input, key) => {
+    if (key.escape) {
+      onCancel();
+    } else if (key.return) {
+      onResolve(value || null);
+    } else if (key.backspace || key.delete) {
+      setValue((v) => v.slice(0, -1));
+    } else if (input && input.length === 1) {
+      setValue((v) => v + input);
+    }
+  });
+
+  return (
+    <Modal visible={true} title={dialog.title}>
+      <Box flexDirection="column">
+        <Box paddingX={1} marginBottom={1}>
+          {!value && dialog.placeholder && <Text dimColor={true}>{dialog.placeholder}</Text>}
+          {value && <Text>{value}</Text>}
+          <Text inverse={true}>▎</Text>
+        </Box>
+        <Box>
+          <Text dimColor={true}>Enter to submit · Esc to cancel</Text>
+        </Box>
+      </Box>
+    </Modal>
+  );
+}
+
+// ─── Dialog Layer ─────────────────────────────────────────────────────────────
+
+export function DialogLayer({ service }: { service: InkUIService }) {
+  const [dialog, setDialog] = useState<DialogRequest | null>(service.currentDialog());
+
+  useEffect(() => {
+    return service.subscribe(() => {
+      setDialog(service.currentDialog());
+    });
+  }, [service]);
+
+  const handleResolve = useCallback(
+    (value: unknown) => {
+      service.resolveDialog(value);
+    },
+    [service],
+  );
+
+  const handleCancel = useCallback(() => {
+    service.cancelDialog();
+  }, [service]);
+
+  if (!dialog) return null;
+
+  switch (dialog.type) {
+    case 'confirm':
+      return <ConfirmDialog dialog={dialog} onResolve={handleResolve} onCancel={handleCancel} />;
+    case 'select':
+      return <SelectDialog dialog={dialog} onResolve={handleResolve} onCancel={handleCancel} />;
+    case 'input':
+      return <InputDialog dialog={dialog} onResolve={handleResolve} onCancel={handleCancel} />;
+    default:
+      return null;
+  }
+}

package/src/tui/components/ui/toast.tsx

@@ -1,5 +1,5 @@
-import { Box, Text, useStdout } from 'ink';
-import { useState } from 'react';
+import { Box, Text, useInput, useStdout } from 'ink';
+import { useCallback, useState } from 'react';
 
 export interface Toast {
   id: number;
@@ -12,31 +12,53 @@ let nextId = 0;
 export function useToast() {
   const [toasts, setToasts] = useState<Toast[]>([]);
 
-  const show = (message: string, color?: string, durationMs = 2000) => {
+  const show = useCallback((message: string, color?: string) => {
     const id = nextId++;
     setToasts((prev) => [...prev, { id, message, color }]);
-    setTimeout(() => {
-      setToasts((prev) => prev.filter((t) => t.id !== id));
-    }, durationMs);
-  };
+  }, []);
 
-  return { toasts, show };
+  const dismiss = useCallback((id: number) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+
+  const dismissFirst = useCallback(() => {
+    setToasts((prev) => prev.slice(1));
+  }, []);
+
+  return { toasts, show, dismiss, dismissFirst };
 }
 
-export function ToastContainer({ toasts }: { toasts: Toast[] }) {
+export function ToastContainer({ toasts, onDismiss }: { toasts: Toast[]; onDismiss: (id: number) => void }) {
   const { stdout } = useStdout();
   const columns = stdout.columns;
 
+  useInput((_input, key) => {
+    if (toasts.length > 0 && key.escape) {
+      onDismiss(toasts[0].id);
+    }
+  });
+
   if (toasts.length === 0) {
     return null;
   }
 
+  const maxWidth = Math.min(60, columns - 4);
+
   return (
     <Box position="absolute" top={0} left={0} width={columns} justifyContent="flex-end" paddingX={2} paddingY={1}>
       <Box flexDirection="column" gap={1}>
         {toasts.map((t) => (
-          <Box key={t.id} backgroundColor="#1a1a1a" paddingX={2} paddingY={0}>
-            <Text color={t.color ?? 'green'}>{t.message}</Text>
+          <Box key={t.id} backgroundColor="#1a1a1a" paddingX={2} paddingY={0} width={maxWidth}>
+            <Box flexGrow={1} flexShrink={1}>
+              <Text color={t.color ?? 'green'} wrap="wrap">
+                {t.message}
+              </Text>
+            </Box>
+            <Box marginLeft={1} flexShrink={0}>
+              <Text color="gray" dimColor={true}>
+                [esc]✕
+              </Text>
+            </Box>
           </Box>
         ))}
       </Box>

package/src/tui/hooks/useInputHandler.ts

@@ -1,4 +1,5 @@
 import { type Key, useInput, useStdin } from 'ink';
+import type { SlashCommand as PluginSlashCommand } from 'mu-agents';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { matchCommands, type SlashCommand } from '../commands';
 
@@ -30,6 +31,7 @@ interface UseInputHandlerOptions {
   history: string[];
   actions: InputActions;
   onSubmit: (text: string) => void;
+  pluginCommands?: PluginSlashCommand[];
 }
 
 // Build a stable key identifier from an Ink key event
@@ -199,14 +201,25 @@ function handleInsert(input: string, c: BindingCtx) {
   }
 }
 
+function executeCommand(cmd: SlashCommand, args: string, actions: InputActions): void {
+  if (cmd.execute) {
+    cmd.execute(args);
+  } else if (cmd.action) {
+    const actionKey = COMMAND_ACTIONS[cmd.action];
+    if (actionKey) {
+      (actions[actionKey] as (() => void) | undefined)?.();
+    }
+  }
+}
+
 export function useInputHandler(options: UseInputHandlerOptions): InputState {
-  const { isActive, streaming, history, actions, onSubmit } = options;
+  const { isActive, streaming, history, actions, onSubmit, pluginCommands } = options;
   const [value, setValue] = useState('');
   const [cmdIndex, setCmdIndex] = useState(0);
   const nav = useHistoryNavigation(value, history);
   const backspaceHandledRef = useRawBackspace(isActive, setValue);
 
-  const commands = useMemo(() => matchCommands(value.trim()), [value]);
+  const commands = useMemo(() => matchCommands(value.trim(), pluginCommands), [value, pluginCommands]);
   const isCommandMode = commands.length > 0 && value.trim().startsWith('/');
 
   const submit = useCallback(() => {
@@ -216,11 +229,9 @@ export function useInputHandler(options: UseInputHandlerOptions): InputState {
     if (isCommandMode) {
       const cmd = commands[cmdIndex];
       if (cmd) {
+        const args = value.trim().slice(cmd.name.length).trim();
         setValue('');
-        const actionKey = COMMAND_ACTIONS[cmd.action];
-        if (actionKey) {
-          (actions[actionKey] as (() => void) | undefined)?.();
-        }
+        executeCommand(cmd, args, actions);
       }
       return;
     }

package/src/tui/services/uiService.ts

@@ -0,0 +1,155 @@
+export type DialogType = 'confirm' | 'select' | 'input';
+
+export interface DialogRequest {
+  id: number;
+  type: DialogType;
+  title: string;
+  message?: string;
+  options?: string[];
+  placeholder?: string;
+  resolve: (value: unknown) => void;
+}
+
+export interface ToastRequest {
+  message: string;
+  level: 'info' | 'success' | 'warning' | 'error';
+}
+
+let nextDialogId = 0;
+
+/**
+ * InkUIService bridges plugin UI requests with ink's React rendering.
+ *
+ * Dialog methods (confirm, select, input) push requests into a queue.
+ * The TUI's DialogLayer component consumes the queue and renders appropriate modals.
+ * When the user interacts, the promise is resolved.
+ *
+ * This class implements the same shape as mu-pi-compat's UIService interface
+ * via structural typing — no import needed.
+ */
+export class InkUIService {
+  private dialogQueue: DialogRequest[] = [];
+  private subscribers: Set<() => void> = new Set();
+  private toastCallback: ((toast: ToastRequest) => void) | null = null;
+  private statusMap: Map<string, string> = new Map();
+  private statusCallback: ((entries: Map<string, string>) => void) | null = null;
+
+  // ─── Subscription (used by React hooks) ─────────────────────────────────
+
+  subscribe(fn: () => void): () => void {
+    this.subscribers.add(fn);
+    return () => this.subscribers.delete(fn);
+  }
+
+  private notifySubscribers(): void {
+    for (const fn of this.subscribers) {
+      fn();
+    }
+  }
+
+  /** Get the current dialog at the front of the queue */
+  currentDialog(): DialogRequest | null {
+    return this.dialogQueue[0] ?? null;
+  }
+
+  /** Resolve the current dialog and advance the queue */
+  resolveDialog(value: unknown): void {
+    const dialog = this.dialogQueue.shift();
+    if (dialog) {
+      dialog.resolve(value);
+      this.notifySubscribers();
+    }
+  }
+
+  /** Cancel/dismiss the current dialog */
+  cancelDialog(): void {
+    const dialog = this.dialogQueue.shift();
+    if (dialog) {
+      dialog.resolve(dialog.type === 'confirm' ? false : null);
+      this.notifySubscribers();
+    }
+  }
+
+  // ─── Toast ──────────────────────────────────────────────────────────────
+
+  private pendingToasts: ToastRequest[] = [];
+
+  onToast(callback: (toast: ToastRequest) => void): void {
+    this.toastCallback = callback;
+    // Flush any toasts that fired before the TUI mounted
+    for (const toast of this.pendingToasts) {
+      callback(toast);
+    }
+    this.pendingToasts = [];
+  }
+
+  // ─── Status ─────────────────────────────────────────────────────────────
+
+  onStatusChange(callback: (entries: Map<string, string>) => void): void {
+    this.statusCallback = callback;
+  }
+
+  getStatusEntries(): Map<string, string> {
+    return new Map(this.statusMap);
+  }
+
+  // ─── Plugin UI Methods ──────────────────────────────────────────────────
+
+  notify(message: string, level?: 'info' | 'success' | 'warning' | 'error'): void {
+    const toast: ToastRequest = { message, level: level ?? 'info' };
+    if (this.toastCallback) {
+      this.toastCallback(toast);
+    } else {
+      this.pendingToasts.push(toast);
+    }
+  }
+
+  confirm(title: string, message: string): Promise<boolean> {
+    return new Promise((resolve) => {
+      this.dialogQueue.push({
+        id: nextDialogId++,
+        type: 'confirm',
+        title,
+        message,
+        resolve: resolve as (value: unknown) => void,
+      });
+      this.notifySubscribers();
+    });
+  }
+
+  select(title: string, options: string[]): Promise<string | null> {
+    return new Promise((resolve) => {
+      this.dialogQueue.push({
+        id: nextDialogId++,
+        type: 'select',
+        title,
+        options,
+        resolve: resolve as (value: unknown) => void,
+      });
+      this.notifySubscribers();
+    });
+  }
+
+  input(title: string, placeholder?: string): Promise<string | null> {
+    return new Promise((resolve) => {
+      this.dialogQueue.push({
+        id: nextDialogId++,
+        type: 'input',
+        title,
+        placeholder,
+        resolve: resolve as (value: unknown) => void,
+      });
+      this.notifySubscribers();
+    });
+  }
+
+  setStatus(key: string, text: string): void {
+    this.statusMap.set(key, text);
+    this.statusCallback?.(this.statusMap);
+  }
+
+  clearStatus(key: string): void {
+    this.statusMap.delete(key);
+    this.statusCallback?.(this.statusMap);
+  }
+}

package/src/tui/useAbort.ts

@@ -50,7 +50,10 @@ export function useAbort(
     }
     if (onCtrlC()) {
       exit();
-      setTimeout(() => process.exit(0), 100);
+      setTimeout(() => {
+        process.stdout.write('\x1b[<u');
+        process.exit(0);
+      }, 100);
     }
   }, [streaming, onCtrlC, exit, controllerRef]);