demian-cli 1.0.9 → 1.1.0

package/dist/tui.mjs

@@ -25727,7 +25727,7 @@ var init_store = __esm({
       }
       markTaskFailed(message) {
         const lines = [message];
-        if (this.#lastRetryPrompt()) lines.push("Press ctrl+r or type /retry to run the last task again.");
+        if (this.#lastRetryPrompt()) lines.push("Press Esc then r or type /retry to run the last task again.");
         this.#append({ kind: "warning", title: "Task Failed", lines });
         this.#state.status.reason = "error";
         this.#state.inputMode = this.#exitRequested ? "done" : "prompt";
@@ -26987,9 +26987,10 @@ __export(app_exports, {
 });
 import React, { useEffect, useState } from "react";
 import { Box, Text, useApp, useInput } from "ink";
-function TuiApp({ store }) {
+function TuiApp({ store, version = "dev" }) {
   const [state, setState] = useState(() => store.snapshot());
   const [now2, setNow] = useState(() => Date.now());
+  const [shortcutMode, setShortcutMode] = useState(false);
   const app = useApp();
   useEffect(() => {
     const update = () => setState(store.snapshot());
@@ -27002,27 +27003,64 @@ function TuiApp({ store }) {
     const timer = setInterval(() => setNow(Date.now()), 450);
     return () => clearInterval(timer);
   }, [state.workPlan?.planId, state.inputMode]);
+  useEffect(() => {
+    setShortcutMode(false);
+  }, [state.inputMode, state.permission !== void 0]);
   useInput((input2, key) => {
     const textInput = textInputForKeypress(input2, key);
-    if (key.ctrl && input2 === "c") {
-      store.requestExit();
-      app.exit();
-      return;
-    }
-    if (key.ctrl && input2 === "t") {
-      store.toggleLatestToolExpanded();
-      return;
-    }
-    if (key.ctrl && input2 === "p") {
-      store.toggleWorkPlanExpanded();
-      return;
-    }
-    if (key.ctrl && input2 === "r") {
-      store.retryLastPrompt();
-      return;
-    }
-    if (key.ctrl && input2 === "e") {
-      store.usePendingClaudeCodePlan();
+    if (shortcutMode) {
+      setShortcutMode(false);
+      if (key.escape) return;
+      const shortcut = input2.toLowerCase();
+      if (shortcut === "q") {
+        store.requestExit();
+        app.exit();
+        return;
+      }
+      if (shortcut === "s" && state.inputMode === "running") {
+        store.stopActiveTask();
+        return;
+      }
+      if (shortcut === "p" && state.inputMode === "prompt") {
+        store.openProviderSelector();
+        return;
+      }
+      if (shortcut === "a" && state.inputMode === "prompt") {
+        store.openAgentSelector();
+        return;
+      }
+      if (shortcut === "m" && state.inputMode === "prompt") {
+        store.openModelEditor();
+        return;
+      }
+      if (shortcut === "o" && state.inputMode === "prompt") {
+        store.openPermissionPresetSelector();
+        return;
+      }
+      if (shortcut === "u" && state.inputMode === "prompt") {
+        store.clearPromptInput();
+        return;
+      }
+      if (shortcut === "d" && state.turnDiff) {
+        store.toggleDiffExpanded();
+        return;
+      }
+      if (shortcut === "t" && state.blocks.some((block) => block.kind === "tool")) {
+        store.toggleLatestToolExpanded();
+        return;
+      }
+      if (shortcut === "w" && (state.workPlan || state.inputMode === "running")) {
+        store.toggleWorkPlanExpanded();
+        return;
+      }
+      if (shortcut === "e" && state.pendingClaudeCodePlan) {
+        store.usePendingClaudeCodePlan();
+        return;
+      }
+      if (shortcut === "r" && state.canRetryLastPrompt) {
+        store.retryLastPrompt();
+        return;
+      }
       return;
     }
     if (state.permission) {
@@ -27094,10 +27132,6 @@ function TuiApp({ store }) {
         store.closeSettings();
         return;
       }
-      if (key.ctrl && input2 === "u") {
-        store.clearModelInput();
-        return;
-      }
       if (key.return) {
         if (textInput) store.appendModelInput(textInput);
         store.submitModelInput();
@@ -27111,10 +27145,6 @@ function TuiApp({ store }) {
       return;
     }
     if (state.inputMode === "prompt" || state.inputMode === "running") {
-      if (key.tab && state.turnDiff) {
-        store.toggleDiffExpanded();
-        return;
-      }
       if (state.inputMode === "prompt" && key.upArrow) {
         store.navigatePromptHistory(-1);
         return;
@@ -27123,24 +27153,8 @@ function TuiApp({ store }) {
         store.navigatePromptHistory(1);
         return;
       }
-      if (!key.return && state.inputMode === "prompt" && !state.promptInput && input2 === "p") {
-        store.openProviderSelector();
-        return;
-      }
-      if (!key.return && state.inputMode === "prompt" && !state.promptInput && input2 === "a") {
-        store.openAgentSelector();
-        return;
-      }
-      if (!key.return && state.inputMode === "prompt" && !state.promptInput && input2 === "m") {
-        store.openModelEditor();
-        return;
-      }
-      if (!key.return && state.inputMode === "prompt" && !state.promptInput && input2 === "o") {
-        store.openPermissionPresetSelector();
-        return;
-      }
-      if (key.ctrl && input2 === "u") {
-        store.clearPromptInput();
+      if (key.escape) {
+        setShortcutMode(true);
         return;
       }
       if (key.return) {
@@ -27156,17 +27170,29 @@ function TuiApp({ store }) {
       return;
     }
   });
+  const shellProps = { flexDirection: "column", paddingX: 1, minHeight: terminalHeight() };
+  if (shouldShowEmptyState(state)) {
+    return React.createElement(
+      Box,
+      shellProps,
+      React.createElement(EmptyState, { state, version, shortcutMode })
+    );
+  }
   return React.createElement(
     Box,
-    { flexDirection: "column", paddingX: 1 },
-    React.createElement(StatusBar, { state, now: now2 }),
-    React.createElement(SettingsBar, { state }),
-    React.createElement(shouldShowLoading(state) ? LoadingView : TranscriptView, { state }),
-    React.createElement(DiffAccordion, { state }),
-    React.createElement(WorkPlanPanel, { state, now: now2 }),
-    React.createElement(ActivityBar, { state }),
-    React.createElement(GoalIsland, { state }),
-    React.createElement(BottomBar, { state })
+    shellProps,
+    React.createElement(StatusBar, { state, now: now2, version }),
+    React.createElement(
+      Box,
+      { flexDirection: "column", flexGrow: 1, paddingX: 1 },
+      React.createElement(shouldShowLoading(state) ? LoadingView : TranscriptView, { state }),
+      React.createElement(DiffAccordion, { state }),
+      React.createElement(WorkPlanPanel, { state, now: now2 }),
+      React.createElement(ActivityBar, { state }),
+      React.createElement(GoalIsland, { state }),
+      React.createElement(Box, { flexGrow: 1 }),
+      React.createElement(InteractionPanel, { state, shortcutMode })
+    )
   );
 }
 function textInputForKeypress(input2, key) {
@@ -27179,15 +27205,107 @@ function textInputForKeypress(input2, key) {
 function shouldShowLoading(state) {
   return state.inputMode === "starting" || state.inputMode === "running" && state.blocks.length === 0 && !state.streamingText;
 }
+function shouldShowEmptyState(state) {
+  return state.inputMode === "prompt" && !state.permission && state.blocks.length === 0 && !state.streamingText && !state.turnDiff && !state.workPlan && !state.goal;
+}
+function EmptyState({ state, version, shortcutMode }) {
+  const prompt = state.promptInput || 'Ask anything... "\uC774 \uD504\uB85C\uC81D\uD2B8\uC758 \uAD6C\uC870\uB97C \uC54C\uB824\uC918"';
+  const hint = shortcutMode ? shortcutHelp(state) : "enter send \xB7 esc commands \xB7 / commands";
+  const topGap = Math.max(2, Math.min(8, Math.floor(terminalHeight() * 0.18)));
+  return React.createElement(
+    Box,
+    { flexDirection: "column", flexGrow: 1 },
+    React.createElement(Box, { height: topGap }),
+    React.createElement(DemianWordmark),
+    React.createElement(Box, { height: 2 }),
+    React.createElement(
+      Box,
+      { alignSelf: "center", width: promptPanelWidth(), flexDirection: "column", borderStyle: "double", borderColor: shortcutMode ? "cyan" : "blue", paddingX: 2, paddingY: 1 },
+      React.createElement(Text, { color: state.promptInput ? "white" : "gray" }, prompt)
+    ),
+    React.createElement(SessionMetaBox, { state, version }),
+    React.createElement(
+      Box,
+      { alignSelf: "center", width: promptPanelWidth(), justifyContent: "flex-end", marginTop: 1 },
+      React.createElement(Text, { color: shortcutMode ? "cyan" : "gray" }, hint)
+    ),
+    state.promptError ? React.createElement(Box, { alignSelf: "center", width: promptPanelWidth(), marginTop: 1 }, React.createElement(Text, { color: "yellow" }, state.promptError)) : null,
+    React.createElement(Box, { flexGrow: 1 })
+  );
+}
+function SessionMetaBox({ state, version, marginTop = 1 }) {
+  const width = promptPanelWidth();
+  const compact = width < 68;
+  const agent = shorten(state.selectedAgent ?? state.status.agent ?? "general", compact ? 14 : 18);
+  const model = shorten(state.selection?.model ?? state.status.model ?? "model", compact ? Math.max(18, width - 14) : 30);
+  const workspace = shorten(state.status.cwd ?? process.cwd(), compact ? Math.max(18, width - 18) : 46);
+  const rows = compact ? [
+    React.createElement(
+      Box,
+      { key: "mode" },
+      React.createElement(MetaItem, { label: "agent", value: agent, color: "green" }),
+      React.createElement(MetaDivider),
+      React.createElement(MetaItem, { label: "perm", value: state.permissionPreset, color: "yellow" })
+    ),
+    React.createElement(Box, { key: "model" }, React.createElement(MetaItem, { label: "model", value: model, color: "cyan" })),
+    React.createElement(Box, { key: "workspace" }, React.createElement(MetaItem, { label: "workspace", value: workspace, color: "white" })),
+    version ? React.createElement(Box, { key: "version" }, React.createElement(MetaItem, { label: "version", value: `v${version}`, color: "gray" })) : null
+  ].filter(Boolean) : [
+    React.createElement(
+      Box,
+      { key: "mode" },
+      React.createElement(MetaItem, { label: "agent", value: agent, color: "green" }),
+      React.createElement(MetaDivider),
+      React.createElement(MetaItem, { label: "model", value: model, color: "cyan" }),
+      React.createElement(MetaDivider),
+      React.createElement(MetaItem, { label: "perm", value: state.permissionPreset, color: "yellow" })
+    ),
+    React.createElement(
+      Box,
+      { key: "workspace" },
+      React.createElement(MetaItem, { label: "workspace", value: workspace, color: "white" }),
+      version ? React.createElement(MetaDivider) : null,
+      version ? React.createElement(MetaItem, { label: "version", value: `v${version}`, color: "gray" }) : null
+    )
+  ];
+  return React.createElement(
+    Box,
+    { alignSelf: "center", width, flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 2, marginTop },
+    ...rows
+  );
+}
+function MetaItem({ label, value, color }) {
+  return React.createElement(
+    Text,
+    null,
+    React.createElement(Text, { color: "gray" }, `${label} `),
+    React.createElement(Text, { color }, value)
+  );
+}
+function MetaDivider() {
+  return React.createElement(Text, { color: "gray" }, " \xB7 ");
+}
+function DemianWordmark() {
+  if (terminalWidth() < 58) {
+    return React.createElement(Box, { alignSelf: "center" }, React.createElement(Text, { color: "gray", bold: true }, "DEMIAN"));
+  }
+  return React.createElement(
+    Box,
+    { alignSelf: "center", flexDirection: "column" },
+    ...DEMIAN_WORDMARK_LINES.map(
+      (line, index) => React.createElement(Text, { key: index, color: index < 2 ? "gray" : "white", bold: true }, line)
+    )
+  );
+}
 function LoadingView({ state }) {
-  const title = state.inputMode === "starting" ? "Loading Demian" : "Preparing session";
+  const title = state.inputMode === "starting" ? "Demian runtime" : "Preparing session";
   const message = state.activity || (state.inputMode === "starting" ? "Loading configuration" : "Starting session");
   return React.createElement(
     Box,
-    { flexDirection: "column", marginTop: 1, borderStyle: "single", borderColor: "cyan", paddingX: 1, paddingY: 1 },
+    { flexDirection: "column", marginTop: 1, borderStyle: "double", borderColor: "cyan", paddingX: 1, paddingY: 1 },
     React.createElement(Text, { color: "cyan", bold: true }, title),
     React.createElement(Text, { color: "white" }, message),
-    React.createElement(Text, { color: "gray" }, "Please wait while demian gets ready.")
+    React.createElement(Text, { color: "gray" }, "Loading providers, tools, workspace state, and permissions.")
   );
 }
 function contextEfficiencySummary(state) {
@@ -27207,61 +27325,53 @@ function contextEfficiencySummary(state) {
   ].filter(Boolean);
   return parts.join(" | ");
 }
-function StatusBar({ state, now: now2 }) {
+function StatusBar({ state, now: now2, version }) {
   const status = state.status;
-  const items = [
-    claudeCodeBadge(state),
-    status.provider ? `provider ${status.provider}` : void 0,
-    status.model ? `model ${status.model}` : void 0,
-    status.agent ? `agent ${status.agent}` : void 0,
-    status.cwd ? `cwd ${shorten(status.cwd, 48)}` : void 0,
-    status.externalSessionId ? `cc session ${shorten(status.externalSessionId, 18)}` : void 0,
-    status.reason ? `reason ${status.reason}` : void 0
-  ].filter(Boolean);
+  const mode = tuiMode(state);
+  const provider = state.selection?.providerName ?? status.provider;
+  const model = state.selection?.model ?? status.model ?? "-";
+  const meta = [provider, shorten(model, 32), state.permissionPreset, `v${version}`].filter(Boolean).join(" \xB7 ");
   return React.createElement(
     Box,
-    { borderStyle: "round", paddingX: 1 },
-    React.createElement(DemianTuiMark, { active: state.inputMode === "starting" || state.inputMode === "running", now: now2 }),
-    React.createElement(Text, { color: "cyan", bold: true }, " demian "),
-    React.createElement(Text, { color: "gray" }, items.join(" \xB7 "))
+    { paddingX: 1, marginBottom: 1, justifyContent: "space-between" },
+    React.createElement(
+      Text,
+      null,
+      React.createElement(DemianTuiMark, { active: state.inputMode === "starting" || state.inputMode === "running", now: now2 }),
+      React.createElement(Text, { color: "cyan", bold: true }, " Demian")
+    ),
+    React.createElement(
+      Text,
+      null,
+      React.createElement(Text, { color: mode.color }, mode.label),
+      React.createElement(Text, { color: "gray" }, ` \xB7 ${meta}`)
+    )
   );
 }
 function DemianTuiMark({ active, now: now2 }) {
   const frame = active ? Math.floor(now2 / 450) % 4 : 0;
-  const shell = frame === 1 ? "<" : frame === 3 ? ">" : "^";
-  const face = frame === 2 ? "o" : "*";
+  const mark = active ? ["D>", "D*", "D+", "D*"][frame] : "D>";
   return React.createElement(
     Text,
     { color: "yellow", bold: true },
-    `[${shell}${face}]`
+    `[${mark}]`
   );
 }
-function claudeCodeBadge(state) {
-  const option = selectedProviderOption(state);
-  const isClaudeCode = state.status.runtime === "claudecode" || option?.type === "claudecode" || state.status.provider === "claudecode" || state.selection?.providerName === "claudecode";
-  if (!isClaudeCode) return void 0;
-  return option?.ga === true ? "[CC]" : "[CC Preview]";
-}
-function selectedProviderOption(state) {
-  const providerName = state.selection?.providerName ?? state.status.provider;
-  return providerName ? state.providerOptions.find((option) => option.name === providerName) : void 0;
-}
-function SettingsBar({ state }) {
-  const selection = state.selection;
-  if (!selection) return null;
-  const help = state.inputMode === "provider" ? "up/down select | enter apply | esc cancel" : state.inputMode === "agent" ? "up/down select | enter apply | esc cancel" : state.inputMode === "permissionPreset" ? "up/down select | enter apply | esc cancel" : state.inputMode === "model" ? "type model | enter apply | esc cancel" : "p provider | a agent | m model | o permissions | up/down history | /cowork task | /compact compact | enter send | ctrl+c exit";
-  return React.createElement(
-    Box,
-    { borderStyle: "single", paddingX: 1 },
-    React.createElement(Text, null, `agent ${state.selectedAgent ?? state.status.agent ?? "?"} | provider ${selection.providerName} (${selection.providerSource}) | model ${selection.model} (${selection.modelSource}) | permission ${state.permissionPreset} | ${help}`)
-  );
+function tuiMode(state) {
+  if (state.done) return { label: "done", color: "green" };
+  if (state.permission) return { label: "approval", color: "yellow" };
+  if (state.inputMode === "starting") return { label: "booting", color: "cyan" };
+  if (state.inputMode === "running") return { label: "running", color: "cyan" };
+  if (state.inputMode === "provider" || state.inputMode === "agent" || state.inputMode === "model" || state.inputMode === "permissionPreset") return { label: "settings", color: "magenta" };
+  if (state.inputMode === "prompt") return { label: "ready", color: "green" };
+  return { label: state.inputMode, color: "gray" };
 }
 function TranscriptView({ state }) {
   const blocks = state.blocks.slice(-12);
   const streaming = !state.streamingFinalized && state.streamingText ? { kind: "assistant", title: "Assistant streaming", lines: streamingLines(state.streamingText) } : void 0;
   return React.createElement(
     Box,
-    { flexDirection: "column", marginTop: 1 },
+    { flexDirection: "column", marginTop: 1, paddingX: 1 },
     ...blocks.map((block) => React.createElement(BlockView, { key: block.id, block })),
     streaming ? React.createElement(BlockView, { key: "streaming", block: streaming }) : null
   );
@@ -27453,21 +27563,26 @@ function toneColor(tone) {
   return void 0;
 }
 function ActivityBar({ state }) {
+  if (!shouldShowActivity(state)) return null;
   const warning = state.warnings.at(-1);
   const context = contextEfficiencySummary(state);
+  const color = state.done ? "green" : state.inputMode === "running" ? "cyan" : "blue";
   return React.createElement(
     Box,
-    { borderStyle: "round", borderColor: state.done ? "green" : "blue", paddingX: 1, flexDirection: "column" },
+    { borderStyle: "round", borderColor: color, paddingX: 1, flexDirection: "column" },
     React.createElement(
       Box,
       null,
-      React.createElement(Text, { color: state.done ? "green" : "blue", bold: true }, "Progress "),
+      React.createElement(Text, { color, bold: true }, "Activity "),
       React.createElement(Text, { color: state.done ? "green" : "white" }, state.activity),
       context ? React.createElement(Text, { color: "gray" }, ` | ${context}`) : null
     ),
     warning ? React.createElement(Text, { color: "yellow" }, ` \xB7 ${warning}`) : null
   );
 }
+function shouldShowActivity(state) {
+  return state.inputMode === "running" || state.done || state.warnings.length > 0 || Boolean(state.contextEfficiency);
+}
 function GoalIsland({ state }) {
   const goal = state.goal;
   if (!goal) return null;
@@ -27523,7 +27638,7 @@ function DiffAccordion({ state }) {
       null,
       React.createElement(Text, { color: "cyan", bold: true }, `${indicator} Diff `),
       React.createElement(Text, { color: "white" }, summary),
-      React.createElement(Text, { color: "gray" }, " | tab toggle")
+      React.createElement(Text, { color: "gray" }, " | esc then d toggle")
     ),
     state.diffExpanded ? React.createElement(
       Box,
@@ -27563,7 +27678,7 @@ function WorkPlanPanel({ state, now: now2 }) {
         null,
         React.createElement(Text, { color: "cyan", bold: true }, `${expanded ? "[-]" : "[+]"} Plan `),
         React.createElement(Text, { color: "white" }, "Thinking"),
-        React.createElement(Text, { color: "gray" }, " | ctrl+p toggle")
+        React.createElement(Text, { color: "gray" }, " | esc then w toggle")
       ),
       expanded ? React.createElement(Text, { color: "gray" }, "Demian is inspecting context and preparing a step-by-step plan.") : null
     );
@@ -27587,7 +27702,7 @@ function WorkPlanPanel({ state, now: now2 }) {
       elapsed ? React.createElement(Text, { color: "gray" }, ` (${elapsed})`) : null,
       React.createElement(Text, { color: "gray" }, ` | ${planProgressGraph(progress.resolved, progress.total)} ${progress.resolved}/${progress.total}`),
       blocked ? React.createElement(Text, { color: "red" }, ` | ${blocked} blocked`) : null,
-      React.createElement(Text, { color: "gray" }, " | ctrl+p toggle")
+      React.createElement(Text, { color: "gray" }, " | esc then w toggle")
     ),
     expanded ? React.createElement(
       Box,
@@ -27708,15 +27823,15 @@ function formatElapsed2(ms2) {
   if (minutes > 0) return `${minutes}m ${String(seconds).padStart(2, "0")}s`;
   return `${seconds}s`;
 }
-function BottomBar({ state }) {
+function InteractionPanel({ state, shortcutMode }) {
   if (state.inputMode === "starting") return React.createElement(LoadingBar);
   if (state.permission) return React.createElement(PermissionBar, { state });
   if (state.inputMode === "provider") return React.createElement(ProviderSelector, { state });
   if (state.inputMode === "agent") return React.createElement(AgentSelector, { state });
   if (state.inputMode === "permissionPreset") return React.createElement(PermissionPresetSelector, { state });
   if (state.inputMode === "model") return React.createElement(ModelEditor, { state });
-  if (state.inputMode === "running") return React.createElement(CommandBar, { state });
-  if (state.inputMode === "prompt") return React.createElement(PromptBar, { state });
+  if (state.inputMode === "running") return React.createElement(CommandBar, { state, shortcutMode });
+  if (state.inputMode === "prompt") return React.createElement(PromptBar, { state, shortcutMode });
   return React.createElement(PermissionBar, { state });
 }
 function LoadingBar() {
@@ -27724,58 +27839,72 @@ function LoadingBar() {
     Box,
     { flexDirection: "column", borderStyle: "double", paddingX: 1 },
     React.createElement(Text, { color: "cyan", bold: true }, "loading"),
-    React.createElement(Text, { color: "gray" }, "demian is preparing the session | ctrl+c exit")
+    React.createElement(Text, { color: "gray" }, "demian is preparing the session | type /exit after loading to quit")
   );
 }
-function PromptBar({ state }) {
+function shortcutHelp(state) {
+  const parts = ["esc cancel"];
+  if (state.inputMode === "prompt") parts.push("p provider", "a agent", "m model", "o permissions", "u clear");
+  if (state.inputMode === "running") parts.push("s stop");
+  if (state.turnDiff) parts.push("d diff");
+  if (state.blocks.some((block) => block.kind === "tool")) parts.push("t tools");
+  if (state.workPlan || state.inputMode === "running") parts.push("w plan");
+  if (state.pendingClaudeCodePlan) parts.push("e use CC plan");
+  if (state.canRetryLastPrompt) parts.push("r retry");
+  parts.push("q quit");
+  return `shortcut: ${parts.join(" | ")}`;
+}
+function PromptBar({ state, shortcutMode }) {
   const value = state.promptInput || "Type first message and press Enter";
-  const diffHelp = state.turnDiff ? " | tab diff" : "";
-  const toolHelp = state.blocks.some((block) => block.kind === "tool") ? " | ctrl+t tools" : "";
-  const planHelp = state.workPlan || state.inputMode === "running" ? " | ctrl+p plan" : "";
-  const claudeCodePlanHelp = state.pendingClaudeCodePlan ? " | ctrl+e use CC plan" : "";
-  const retryHelp = state.canRetryLastPrompt ? " | ctrl+r retry" : "";
+  const hint = shortcutMode ? shortcutHelp(state) : "enter send | esc shortcuts | up/down history | /cowork | /compact | /retry | /exit";
   return React.createElement(
     Box,
-    { flexDirection: "column", borderStyle: "single", paddingX: 1 },
+    { alignSelf: "center", width: promptPanelWidth(), flexDirection: "column", marginTop: 1 },
+    React.createElement(SessionMetaBox, { state, marginTop: 0 }),
     React.createElement(
       Box,
-      null,
-      React.createElement(Text, { color: "cyan", bold: true }, "> "),
-      React.createElement(Text, { color: "gray" }, `[perm:${state.permissionPreset}] `),
-      React.createElement(Text, { color: state.promptInput ? "white" : "gray" }, value)
-    ),
-    state.promptError ? React.createElement(Text, { color: "yellow" }, state.promptError) : React.createElement(Text, { color: "gray" }, `enter send | up/down history | p/a/m/o settings | /cowork | /compact | /retry | /exit | ctrl+u clear${diffHelp}${toolHelp}${planHelp}${claudeCodePlanHelp}${retryHelp}`)
+      { flexDirection: "column", borderStyle: "double", borderColor: shortcutMode ? "cyan" : "blue", paddingX: 2, paddingY: 1, marginTop: 1 },
+      React.createElement(
+        Box,
+        null,
+        React.createElement(Text, { color: "cyan", bold: true }, "> "),
+        React.createElement(Text, { color: state.promptInput ? "white" : "gray" }, value)
+      ),
+      state.promptError ? React.createElement(Text, { color: "yellow" }, state.promptError) : React.createElement(Text, { color: shortcutMode ? "cyan" : "gray" }, hint)
+    )
   );
 }
-function CommandBar({ state }) {
+function CommandBar({ state, shortcutMode }) {
   const value = state.promptInput || "Type /stop to stop or /exit to quit";
-  const diffHelp = state.turnDiff ? " | tab diff" : "";
-  const toolHelp = state.blocks.some((block) => block.kind === "tool") ? " | ctrl+t tools" : "";
-  const planHelp = state.workPlan || state.inputMode === "running" ? " | ctrl+p plan" : "";
+  const hint = shortcutMode ? shortcutHelp(state) : "running | /stop stop | /exit quit | esc shortcuts";
   return React.createElement(
     Box,
-    { flexDirection: "column", borderStyle: "single", paddingX: 1 },
+    { alignSelf: "center", width: promptPanelWidth(), flexDirection: "column", marginTop: 1 },
+    React.createElement(SessionMetaBox, { state, marginTop: 0 }),
     React.createElement(
       Box,
-      null,
-      React.createElement(Text, { color: "yellow", bold: true }, ": "),
-      React.createElement(Text, { color: "gray" }, `[perm:${state.permissionPreset}] `),
-      React.createElement(Text, { color: state.promptInput ? "white" : "gray" }, value)
-    ),
-    state.promptError ? React.createElement(Text, { color: "yellow" }, state.promptError) : React.createElement(Text, { color: "gray" }, `running | /stop stop | /exit quit${diffHelp}${toolHelp}${planHelp}`)
+      { flexDirection: "column", borderStyle: "double", borderColor: shortcutMode ? "cyan" : "yellow", paddingX: 2, paddingY: 1, marginTop: 1 },
+      React.createElement(
+        Box,
+        null,
+        React.createElement(Text, { color: "yellow", bold: true }, ": "),
+        React.createElement(Text, { color: state.promptInput ? "white" : "gray" }, value)
+      ),
+      state.promptError ? React.createElement(Text, { color: "yellow" }, state.promptError) : React.createElement(Text, { color: shortcutMode ? "cyan" : "gray" }, hint)
+    )
   );
 }
 function ProviderSelector({ state }) {
   const items = state.providerOptions;
   return React.createElement(
-    Box,
-    { flexDirection: "column", borderStyle: "double", paddingX: 1 },
-    React.createElement(Text, { color: "cyan", bold: true }, "Select provider"),
+    DialogFrame,
+    { title: "Providers", accent: "magenta" },
+    React.createElement(Text, { color: "gray" }, `${"Provider".padEnd(22)} ${"Model".padEnd(30)} Status`),
     ...items.map(
       (item, index) => React.createElement(
         Text,
         { key: item.name, color: index === state.providerCursor ? "cyan" : item.available === false ? "gray" : "white", bold: index === state.providerCursor },
-        `${index === state.providerCursor ? ">" : " "} ${item.label ?? item.name}  model ${item.modelLabel ?? item.model}`
+        `${index === state.providerCursor ? ">" : " "} ${shorten(item.label ?? item.name, 20).padEnd(20)} ${shorten((item.modelLabel ?? item.model) || "-", 30).padEnd(30)} ${providerStatusLabel(item)}`
       )
     ),
     React.createElement(Text, { color: "gray" }, "up/down select | enter apply | esc cancel")
@@ -27784,9 +27913,8 @@ function ProviderSelector({ state }) {
 function AgentSelector({ state }) {
   const items = state.agentOptions;
   return React.createElement(
-    Box,
-    { flexDirection: "column", borderStyle: "double", paddingX: 1 },
-    React.createElement(Text, { color: "cyan", bold: true }, "Select agent"),
+    DialogFrame,
+    { title: "Agents", accent: "magenta" },
     ...items.map(
       (item, index) => React.createElement(
         Text,
@@ -27799,9 +27927,8 @@ function AgentSelector({ state }) {
 }
 function PermissionPresetSelector({ state }) {
   return React.createElement(
-    Box,
-    { flexDirection: "column", borderStyle: "double", paddingX: 1 },
-    React.createElement(Text, { color: "cyan", bold: true }, "Default permission"),
+    DialogFrame,
+    { title: "Default Permission", accent: "magenta" },
     ...PERMISSION_PRESETS.map(
       (item, index) => React.createElement(
         Text,
@@ -27822,16 +27949,15 @@ function ModelEditor({ state }) {
   const current = state.selection?.model ?? "";
   const value = state.modelInput || `Keep ${current}`;
   return React.createElement(
-    Box,
-    { flexDirection: "column", borderStyle: "double", paddingX: 1 },
-    React.createElement(Text, { color: "cyan", bold: true }, "Model"),
+    DialogFrame,
+    { title: "Model", accent: "magenta" },
     React.createElement(
       Box,
       null,
       React.createElement(Text, { color: "cyan", bold: true }, "> "),
       React.createElement(Text, { color: state.modelInput ? "white" : "gray" }, value)
     ),
-    state.settingsError ? React.createElement(Text, { color: "yellow" }, state.settingsError) : React.createElement(Text, { color: "gray" }, "enter apply | ctrl+u clear | esc cancel")
+    state.settingsError ? React.createElement(Text, { color: "yellow" }, state.settingsError) : React.createElement(Text, { color: "gray" }, "enter apply | backspace edit | esc cancel")
   );
 }
 function PermissionBar({ state }) {
@@ -27841,18 +27967,48 @@ function PermissionBar({ state }) {
   }
   const detailLines = describeToolInput(pending.request.tool, pending.request.input);
   return React.createElement(
-    Box,
-    { flexDirection: "column", borderStyle: "double", paddingX: 1 },
-    React.createElement(Text, { color: "yellow", bold: true }, "Permission required"),
+    DialogFrame,
+    { title: "Permission Required", accent: "yellow" },
     React.createElement(Text, null, `Allow ${toolLabel(pending.request.tool, pending.request.input)}?`),
     ...detailLines.map((line, index) => React.createElement(Text, { key: index, color: "white" }, line)),
     ...permissionShortcutLines().map((line, index) => React.createElement(Text, { key: `shortcut-${index}`, color: "cyan", bold: true }, line))
   );
 }
+function DialogFrame({ title, accent, children }) {
+  return React.createElement(
+    Box,
+    { alignSelf: "center", width: dialogPanelWidth(), flexDirection: "column", borderStyle: "round", borderColor: accent, paddingX: 2, paddingY: 1, marginTop: 1 },
+    React.createElement(Text, { color: accent, bold: true }, title),
+    React.createElement(Box, { height: 1 }),
+    children
+  );
+}
+function providerStatusLabel(item) {
+  if (item.available !== false) return "ready";
+  if (item.catalog?.status === "missing-auth") return "auth";
+  if (item.catalog?.status === "unavailable") return "offline";
+  return "n/a";
+}
 function shorten(value, max) {
   if (value.length <= max) return value;
   return `\u2026${value.slice(value.length - max + 1)}`;
 }
+function terminalHeight() {
+  const rows = process.stdout.rows;
+  return typeof rows === "number" && Number.isFinite(rows) && rows > 0 ? Math.max(18, rows - 1) : 24;
+}
+function terminalWidth() {
+  const columns = process.stdout.columns;
+  return typeof columns === "number" && Number.isFinite(columns) && columns > 0 ? Math.max(48, columns) : 100;
+}
+function promptPanelWidth() {
+  const columns = terminalWidth();
+  return Math.max(40, Math.min(96, columns - 8, Math.floor(columns * 0.86)));
+}
+function dialogPanelWidth() {
+  const columns = terminalWidth();
+  return Math.max(48, Math.min(92, columns - 10, Math.floor(columns * 0.78)));
+}
 function formatTokens(value) {
   const tokens = typeof value === "number" && Number.isFinite(value) ? Math.max(0, Math.round(value)) : 0;
   if (tokens >= 1e6) return `${trimDecimal2(tokens / 1e6)}m`;
@@ -27866,12 +28022,20 @@ function clamp01(value) {
   if (!Number.isFinite(value)) return 0;
   return Math.max(0, Math.min(1, value));
 }
+var DEMIAN_WORDMARK_LINES;
 var init_app = __esm({
   "src/ui/tui/app.ts"() {
     "use strict";
     init_store();
     init_presets();
     init_tool_summary();
+    DEMIAN_WORDMARK_LINES = [
+      "     _                _             ",
+      "  __| | ___ _ __ ___ (_) __ _ _ __  ",
+      " / _` |/ _ \\ '_ ` _ \\| |/ _` | '_ \\ ",
+      "| (_| |  __/ | | | | | | (_| | | | |",
+      " \\__,_|\\___|_| |_| |_|_|\\__,_|_| |_|"
+    ];
   }
 });
 
@@ -34273,6 +34437,7 @@ var init_controller = __esm({
 
 // src/tui.ts
 init_parser();
+import { readFileSync as readFileSync2 } from "node:fs";
 
 // src/doctor/policies.ts
 import { existsSync } from "node:fs";
@@ -35222,7 +35387,7 @@ async function main(argv = process.argv.slice(2)) {
     ]);
     const React2 = ReactModule.default;
     const store = new TuiStore2();
-    const instance = render(React2.createElement(TuiApp2, { store }));
+    const instance = render(React2.createElement(TuiApp2, { store, version: packageVersion() }));
     try {
       const code = await runTuiSession2(flags, store);
       setTimeout(() => instance.unmount(), 100);
@@ -35241,6 +35406,14 @@ async function main(argv = process.argv.slice(2)) {
     throw error;
   }
 }
+function packageVersion() {
+  try {
+    const metadata = JSON.parse(readFileSync2(new URL("../package.json", import.meta.url), "utf8"));
+    return typeof metadata.version === "string" && metadata.version.trim() ? metadata.version : "dev";
+  } catch {
+    return "dev";
+  }
+}
 function parseArgs(argv) {
   const out = { prompt: "", transcript: true, images: [] };
   const rest = [];
@@ -35361,15 +35534,16 @@ Usage:
 Default:
   demian and demian-cli launch the Ink terminal UI.
   The TUI shows provider/model defaults before asking for the first message.
-  Press p to select provider, m to edit model, then Enter to send.
-  Press a to select the main agent before sending a message.
-  Press o to select the default permission preset: deny, ask, auto, or full.
+  Press Esc then p to select provider, Esc then m to edit model, then Enter to send.
+  Press Esc then a to select the main agent before sending a message.
+  Press Esc then o to select the default permission preset: deny, ask, auto, or full.
   Press up/down in the message composer to recall previous prompts.
-  Provider/model selections are remembered in .demian/preferences.json.
+  Provider/model selections are remembered in ~/.demian/preferences.json.
   After each answer, the TUI returns to standby for the next message.
   Use /cowork <task> to explicitly ask Demian to coordinate cowork sub agents in multi-agent mode.
   Use /compact to compact current history, /stop to stop active work, and /exit or /quit to close the TUI.
-  Tool approvals show the requested command/path in the bottom bar.
+  Press Esc then q to quit, Esc then s to stop a running task, and Esc then u to clear the composer.
+  Tool approvals show the requested command/path in a permission dialog.
   Press y to allow once, a to always allow the grant scope, or n/Enter to deny.
   Prompt arguments are still accepted as a compatibility shortcut.
 

package/dist/vscode-worker.mjs

@@ -850,7 +850,7 @@ var TuiStore = class {
   }
   markTaskFailed(message) {
     const lines = [message];
-    if (this.#lastRetryPrompt()) lines.push("Press ctrl+r or type /retry to run the last task again.");
+    if (this.#lastRetryPrompt()) lines.push("Press Esc then r or type /retry to run the last task again.");
     this.#append({ kind: "warning", title: "Task Failed", lines });
     this.#state.status.reason = "error";
     this.#state.inputMode = this.#exitRequested ? "done" : "prompt";
@@ -33180,6 +33180,7 @@ if (process.argv.includes("--config-path")) {
   process.exit(0);
 }
 var options = parseOptions();
+var SNAPSHOT_DEBOUNCE_MS = 80;
 var store = new TuiStore();
 var diffState = normalizeDiffState(options.initialSnapshot?.diff);
 var restoredSnapshot = normalizeInitialPublicState(options.initialSnapshot);
@@ -33405,7 +33406,7 @@ function scheduleSnapshot() {
   snapshotTimer = setTimeout(() => {
     snapshotTimer = void 0;
     send({ type: "snapshot", state: publicState(store.snapshot()) });
-  }, 33);
+  }, SNAPSHOT_DEBOUNCE_MS);
 }
 function sendSnapshotNow() {
   if (snapshotTimer) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "demian-cli",
-  "version": "1.0.9",
+  "version": "1.1.0",
   "description": "Local terminal coding agent with TUI, goals, cowork agents, permissions, and provider switching.",
   "type": "module",
   "icon": "media/demian.svg",