@kal-elsam/kairo-runtime 0.9.0 → 0.11.0

package/src/global/ink/cockpit-models.js

@@ -243,6 +243,7 @@ export function buildFooterModel({
   hasError = false,
   changesPhase = null,
   recoveryPhase = null,
+  recoveryHasPreview = false,
   settingsPhase = null,
   columns = 80
 } = {}) {
@@ -290,7 +291,8 @@ export function buildFooterModel({
 
   if (view === ORCHESTRATOR_VIEWS.ACTIVITY) {
     return {
-      text: buildRecoveryFooterParts(recoveryPhase).join(` ${glyphs.bullet} `),
+      text: buildRecoveryFooterParts(recoveryPhase, { hasPreview: recoveryHasPreview })
+        .join(` ${glyphs.bullet} `),
       columns: footerColumns
     };
   }
@@ -315,16 +317,21 @@ export function buildFooterModel({
     parts.push("Tab Region");
   }
 
-  const activatesOverviewCta = view === ORCHESTRATOR_VIEWS.HOME && navIndex === 0;
-  if (activatesOverviewCta) {
-    parts.push("Enter Activate");
-  } else if (view === ORCHESTRATOR_VIEWS.IDES
+  // HOME footer must stay on one line at 80 cols (frame already near 24 rows).
+  if (view === ORCHESTRATOR_VIEWS.HOME) {
+    return {
+      text: ["↑↓", "Enter", "Space", "R", "?", "/", "Esc"].join(` ${glyphs.bullet} `),
+      columns: footerColumns
+    };
+  }
+
+  if (region === COCKPIT_REGIONS.NAV
+    || view === ORCHESTRATOR_VIEWS.IDES
     || view === ORCHESTRATOR_VIEWS.MODULES
     || view === ORCHESTRATOR_VIEWS.PROFILE
     || view === ORCHESTRATOR_VIEWS.PROVIDERS
     || view === ORCHESTRATOR_VIEWS.DIAGNOSTICS
     || view === ORCHESTRATOR_VIEWS.USAGE
-    || region === COCKPIT_REGIONS.NAV
     || view === ORCHESTRATOR_VIEWS.RUNS
     || view === ORCHESTRATOR_VIEWS.ACTIVE_RUNS
     || view === ORCHESTRATOR_VIEWS.RECENT_RUNS
@@ -337,7 +344,7 @@ export function buildFooterModel({
 
   parts.push("? Help");
   parts.push("/ Actions");
-  parts.push(view === ORCHESTRATOR_VIEWS.HOME ? "Esc Exit" : "Esc Back");
+  parts.push("Esc Back");
 
   return { text: parts.join(` ${glyphs.bullet} `), columns: footerColumns };
 }

package/src/global/ink/cockpit-palette.js

@@ -4,7 +4,8 @@ import { ORCHESTRATOR_VIEWS } from "./orchestrator-state.js";
 export const PALETTE_KINDS = Object.freeze({
   NAVIGATE: "navigate",
   REFRESH: "refresh",
-  HELP: "help"
+  HELP: "help",
+  SETUP: "setup"
 });
 
 const DESTINATION_VIEWS = Object.freeze({
@@ -37,15 +38,25 @@ export function buildPaletteActions({
   navItems = COCKPIT_NAV
 } = {}) {
   const actions = [];
-  const recommendedView = resolvePaletteDestination(ctaDestination);
-  if (recommendedView) {
+  if (ctaDestination === "setup") {
     actions.push({
       id: "recommended",
-      kind: PALETTE_KINDS.NAVIGATE,
-      label: ctaTitle?.trim() || "Recommended next action",
-      view: recommendedView,
-      description: ctaDetail?.trim() || "Overview recommended destination."
+      kind: PALETTE_KINDS.SETUP,
+      label: ctaTitle?.trim() || "Finish local setup",
+      view: null,
+      description: ctaDetail?.trim() || "Open the local setup wizard."
     });
+  } else {
+    const recommendedView = resolvePaletteDestination(ctaDestination);
+    if (recommendedView) {
+      actions.push({
+        id: "recommended",
+        kind: PALETTE_KINDS.NAVIGATE,
+        label: ctaTitle?.trim() || "Recommended next action",
+        view: recommendedView,
+        description: ctaDetail?.trim() || "Overview recommended destination."
+      });
+    }
   }
   for (const item of navItems) {
     actions.push({

package/src/global/ink/cockpit-recovery.js

@@ -75,7 +75,7 @@ export function listRecoverySnapshots(snapshot) {
   return snapshot?.backups?.snapshots ?? [];
 }
 
-function formatWhen(timestamp) {
+export function formatWhen(timestamp) {
   if (!timestamp) return "unknown time";
   const raw = String(timestamp);
   if (/^\d{4}-\d{2}-\d{2}/.test(raw)) return raw.slice(0, 16).replace("T", " ");
@@ -84,7 +84,7 @@ function formatWhen(timestamp) {
   return date.toISOString().slice(0, 16).replace("T", " ");
 }
 
-function formatResult(action) {
+export function formatResult(action) {
   const value = String(action ?? "").toLowerCase();
   if (!value) return "done";
   if (value === "applied" || value === "ok" || value === "success") return "ok";
@@ -93,7 +93,7 @@ function formatResult(action) {
   return value;
 }
 
-function shortName(name) {
+export function shortName(name) {
   const raw = String(name ?? "").trim();
   if (!raw) return "snapshot";
   const parts = raw.split(/[/\\]/).filter(Boolean);
@@ -176,8 +176,11 @@ export function formatRecoveryLines({
   return lines;
 }
 
-export function buildRecoveryFooterParts(phase) {
+export function buildRecoveryFooterParts(phase, { hasPreview = false } = {}) {
   if (phase === RECOVERY_PHASE.PREVIEWING || phase === RECOVERY_PHASE.APPLYING) return ["Working…", "Esc Back"];
-  if (phase === RECOVERY_PHASE.CONFIRMING) return ["Y Restore", "N/Esc Cancel"];
-  return ["↑↓ Select", "Enter Preview", "R Re-scan", "Esc Back"];
+  if (phase === RECOVERY_PHASE.CONFIRMING) return ["Y Restore", "N/Esc Cancel", "Space"];
+  const parts = ["↑↓ Select", "Enter Preview", "R Re-scan"];
+  if (hasPreview) parts.push("Space");
+  parts.push("Esc Back");
+  return parts;
 }

package/src/global/ink/cockpit-usage.js

@@ -0,0 +1,111 @@
+/**
+ * Pure Usage / Tokens model — no React/Ink.
+ * Shared by formatUsageLines and SemanticUsagePanel.
+ */
+import { LAYOUT_MODES } from "./layout.js";
+
+export function usageRunLimit(layoutMode = LAYOUT_MODES.COMPACT) {
+  return layoutMode === LAYOUT_MODES.WIDE ? 8 : 3;
+}
+
+export function formatMeasuredBudgets(budgets) {
+  if (!budgets || typeof budgets !== "object") return null;
+  const parts = [];
+  if (Number.isFinite(budgets.stableUsedTokens) && Number.isFinite(budgets.stableBudgetTokens)) {
+    parts.push(`stable ${budgets.stableUsedTokens}/${budgets.stableBudgetTokens}`);
+  }
+  if (Number.isFinite(budgets.requestUsedTokens) && Number.isFinite(budgets.requestBudgetTokens)) {
+    parts.push(`request ${budgets.requestUsedTokens}/${budgets.requestBudgetTokens}`);
+  }
+  return parts.length > 0 ? parts.join(" · ") : null;
+}
+
+export function resolveConfiguredLimits(dashboard) {
+  const resolved = dashboard?.profile?.profile ?? {};
+  const configured = [];
+  if (Number.isFinite(resolved.tokenBudget)) configured.push(`token ${resolved.tokenBudget}`);
+  if (Number.isFinite(resolved.stableContextBudget)) configured.push(`stable ${resolved.stableContextBudget}`);
+  if (Number.isFinite(resolved.requestContextBudget)) configured.push(`request ${resolved.requestContextBudget}`);
+  return configured;
+}
+
+export function hasFiniteUsage(usage) {
+  if (!usage || typeof usage !== "object") return false;
+  return Number.isFinite(usage.total)
+    || Number.isFinite(usage.input)
+    || Number.isFinite(usage.output);
+}
+
+export function formatRunUsageLabel(run) {
+  const usage = run?.tokenUsage;
+  if (!hasFiniteUsage(usage)) return null;
+  const parts = [];
+  if (Number.isFinite(usage.input)) parts.push(`in ${usage.input}`);
+  if (Number.isFinite(usage.output)) parts.push(`out ${usage.output}`);
+  if (Number.isFinite(usage.total)) parts.push(`total ${usage.total}`);
+  return `${run.agentId ?? "agent"} · ${parts.join(" · ")}`;
+}
+
+function collectAuditableRuns(dashboard) {
+  return [...(dashboard?.activeRuns ?? []), ...(dashboard?.recentRuns ?? [])]
+    .filter((run) => hasFiniteUsage(run?.tokenUsage));
+}
+
+/** Pure adapter: Callout=status · Measured section owns the value. */
+export function adaptUsageModel({
+  snapshot = null,
+  dashboard = null,
+  layoutMode = LAYOUT_MODES.COMPACT
+} = {}) {
+  const measured = formatMeasuredBudgets(snapshot?.budgets);
+  const configured = resolveConfiguredLimits(dashboard);
+  const allRuns = collectAuditableRuns(dashboard);
+  const limit = usageRunLimit(layoutMode);
+  const visible = allRuns.slice(0, limit);
+  const hidden = Math.max(0, allRuns.length - visible.length);
+  const hasEvidence = Boolean(measured) || configured.length > 0 || allRuns.length > 0;
+
+  return {
+    title: "Usage",
+    callout: hasEvidence
+      ? {
+        tone: "info",
+        title: "Usage evidence available",
+        body: "Budgets and run tokenUsage only — no invented totals."
+      }
+      : {
+        tone: "info",
+        title: "Data unavailable",
+        body: "No measured budgets, profile limits, or auditable run tokenUsage."
+      },
+    measured: measured ?? "Data unavailable",
+    configured: configured.length > 0
+      ? configured.join(" · ")
+      : "No profile token budgets configured.",
+    runs: visible.map((run, i) => ({
+      id: `usage-run-${i}`,
+      label: formatRunUsageLabel(run)
+    })),
+    runTotal: allRuns.length,
+    runLimit: limit,
+    moreLine: hidden > 0 ? `… ${hidden} more` : null,
+    hasEvidence,
+    footnote: "Auditable budgets only — no invented token savings."
+  };
+}
+
+export function formatUsageLinesFromModel(model) {
+  const lines = [
+    "MEASURED", model.measured, "",
+    "CONFIGURED LIMITS", model.configured, "",
+    "RUN USAGE"
+  ];
+  if (model.runs.length === 0) {
+    lines.push("No auditable run tokenUsage yet.");
+  } else {
+    for (const item of model.runs) lines.push(item.label);
+    if (model.moreLine) lines.push(model.moreLine);
+  }
+  lines.push("", model.footnote);
+  return lines;
+}

package/src/global/ink/cockpit-views.js

@@ -5,7 +5,6 @@ import { CockpitEmptyState } from "./cockpit/primitives.js";
 import {
   formatProviderLines,
   formatRunDetailLines,
-  formatRunLines,
   formatSystemHealthLines,
   formatLaunchWizardLines,
   ORCHESTRATOR_VIEWS,
@@ -13,14 +12,15 @@ import {
 } from "./orchestrator-state.js";
 import { windowLinesForLayout } from "./cockpit-models.js";
 import { LAYOUT_MODES } from "./layout.js";
-import { formatRunsHubLines, RUNS_HUB_ITEMS } from "./cockpit-runs.js";
-import { formatReviewDetailLines, formatReviewListLines } from "./cockpit-reviews.js";
-import { formatChangesActionLines } from "./cockpit-changes.js";
-import { formatRecoveryLines } from "./cockpit-recovery.js";
-import { formatUsageLines } from "./cockpit-control-center.js";
-import { formatOrchestrationStatus } from "./cockpit-runs.js";
-import { formatAlertListLines } from "./cockpit-alerts.js";
-import { formatSettingsLines } from "./cockpit-settings.js";
+import { SemanticOverviewPanel } from "./ux/live-overview.js";
+import { SemanticGovernancePanel } from "./ux/live-governance.js";
+import { SemanticActivityPanel } from "./ux/live-activity.js";
+import { SemanticOrchestrationPanel } from "./ux/live-orchestration.js";
+import { SemanticAlertsPanel } from "./ux/live-alerts.js";
+import { SemanticSettingsPanel } from "./ux/live-settings.js";
+import { SemanticUsagePanel } from "./ux/live-usage.js";
+import { formatReviewDetailLines } from "./cockpit-reviews.js";
+import { listCuratedIntegrations } from "./cockpit-settings.js";
 
 export function PalettePanel({ model, colorEnabled = true }) {
   return React.createElement(Box, { flexDirection: "column" },
@@ -95,6 +95,11 @@ export function renderCockpitView({
   recoveryAction = null,
   settingsAction = null,
   colorEnabled = true,
+  unicode = true,
+  overviewDetailsOpen = false,
+  governanceDetailsOpen = false,
+  activityDetailsOpen = false,
+  contentFocused = false,
   homeDir = null
 }) {
   if (palette) {
@@ -102,14 +107,21 @@ export function renderCockpitView({
   }
   switch (view) {
     case ORCHESTRATOR_VIEWS.HOME:
-      return React.createElement(ControlCenterPanel, { model: controlCenter, colorEnabled });
+      return React.createElement(SemanticOverviewPanel, {
+        model: controlCenter,
+        detailsOpen: overviewDetailsOpen,
+        colorEnabled,
+        unicode,
+        layoutMode
+      });
     case ORCHESTRATOR_VIEWS.USAGE:
-      return governanceList(
-        "Usage",
-        formatUsageLines({ snapshot, dashboard }),
+      return React.createElement(SemanticUsagePanel, {
+        snapshot,
+        dashboard,
         layoutMode,
-        colorEnabled
-      );
+        colorEnabled,
+        unicode
+      });
     case ORCHESTRATOR_VIEWS.IDES:
     case ORCHESTRATOR_VIEWS.PROVIDERS:
       return governanceList("IDEs & models", [
@@ -120,73 +132,54 @@ export function renderCockpitView({
     case ORCHESTRATOR_VIEWS.MODULES:
       return governanceList("Harness modules", formatModuleLines(snapshot), layoutMode, colorEnabled);
     case ORCHESTRATOR_VIEWS.CHANGES:
-      return governanceList(
-        "Governance",
-        formatChangeLines(snapshot, changesAction, layoutMode, homeDir),
+      return React.createElement(SemanticGovernancePanel, {
+        snapshot,
+        changesAction,
+        homeDir,
+        detailsOpen: governanceDetailsOpen,
         layoutMode,
-        colorEnabled
-      );
+        colorEnabled,
+        unicode
+      });
     case ORCHESTRATOR_VIEWS.ACTIVITY:
-      return governanceList(
-        "Activity",
-        formatRecoveryLines({ snapshot, recoveryAction, listIndex, dashboard, homeDir }),
+      return React.createElement(SemanticActivityPanel, {
+        snapshot,
+        recoveryAction,
+        dashboard,
+        listIndex,
+        homeDir,
+        detailsOpen: activityDetailsOpen,
         layoutMode,
-        colorEnabled
-      );
+        contentFocused,
+        colorEnabled,
+        unicode
+      });
     case ORCHESTRATOR_VIEWS.PROFILE:
-      return governanceList(
-        "Settings",
-        formatSettingsLines({
-          listIndex,
-          settingsAction,
-          snapshot,
-          diagnostics
-        }),
-        layoutMode,
-        colorEnabled
-      );
-    case ORCHESTRATOR_VIEWS.RUNS:
-      return listBlock(
-        `Orchestration · ${formatOrchestrationStatus({
-          active: (dashboard?.activeRuns ?? []).length,
-          recent: (dashboard?.recentRuns ?? []).length,
-          reviews: (reviews ?? []).length
-        })}`,
-        formatRunsHubLines(RUNS_HUB_ITEMS),
+      return React.createElement(SemanticSettingsPanel, {
+        integrations: listCuratedIntegrations(),
         listIndex,
+        settingsAction,
+        snapshot,
+        diagnostics,
+        layoutMode,
+        contentFocused,
         colorEnabled,
-        "Choose Active runs, History, Reviews, or New run."
-      );
+        unicode
+      });
+    case ORCHESTRATOR_VIEWS.RUNS:
     case ORCHESTRATOR_VIEWS.ACTIVE_RUNS:
-      return listBlock(
-        "Active runs",
-        formatRunLines(dashboard?.activeRuns ?? [], {
-          emptyMessage: "No runs executing. Governance first — launch only after setup/repairs.",
-          readable: true
-        }),
-        listIndex,
-        colorEnabled,
-        "Enter opens detail · Esc back to Orchestration"
-      );
     case ORCHESTRATOR_VIEWS.RECENT_RUNS:
-      return listBlock(
-        "Run history",
-        formatRunLines(dashboard?.recentRuns ?? [], {
-          emptyMessage: "No completed runs yet.",
-          readable: true
-        }),
-        listIndex,
-        colorEnabled,
-        "Enter opens detail · Esc back to Orchestration"
-      );
     case ORCHESTRATOR_VIEWS.REVIEWS:
-      return listBlock(
-        "Reviews",
-        formatReviewListLines(reviews),
+      return React.createElement(SemanticOrchestrationPanel, {
+        view,
+        dashboard,
+        reviews,
         listIndex,
+        layoutMode,
+        contentFocused,
         colorEnabled,
-        "Receipts are read-only. Launch reviews via kairo review --agent codex|pi."
-      );
+        unicode
+      });
     case ORCHESTRATOR_VIEWS.LAUNCH:
       if (launchableAgents.length === 0) {
         return React.createElement(CockpitEmptyState, {
@@ -223,13 +216,14 @@ export function renderCockpitView({
           .map((line) => React.createElement(Text, { key: line }, line))
       );
     case ORCHESTRATOR_VIEWS.ALERTS:
-      return listBlock(
-        "Alerts",
-        formatAlertListLines(alerts),
+      return React.createElement(SemanticAlertsPanel, {
+        alerts,
         listIndex,
+        layoutMode,
+        contentFocused,
         colorEnabled,
-        "Enter resolves · D dismisses · Esc back · / Alerts"
-      );
+        unicode
+      });
     case ORCHESTRATOR_VIEWS.DIAGNOSTICS:
       return governanceList(
         "System health",
@@ -287,25 +281,4 @@ function formatModuleLines(snapshot) {
   ];
 }
 
-function formatChangeLines(snapshot, changesAction, layoutMode = LAYOUT_MODES.COMPACT, homeDir = null) {
-  return formatChangesActionLines({ snapshot, changesAction, layoutMode, homeDir });
-}
-
-function listBlock(title, lines, listIndex, colorEnabled, emptyHint) {
-  const isEmpty = lines.length === 1 && /no |nothing |empty/i.test(lines[0]);
-  return React.createElement(Box, { flexDirection: "column" },
-    React.createElement(Text, { bold: true }, title),
-    isEmpty
-      ? React.createElement(CockpitEmptyState, {
-        message: lines[0],
-        hint: emptyHint
-      })
-      : lines.map((line, index) => React.createElement(Text, {
-        key: `${index}-${line}`,
-        bold: index === listIndex,
-        color: index === listIndex && colorEnabled ? COCKPIT_COLORS.primary : undefined
-      }, `${index === listIndex ? "› " : "  "}${line}`))
-  );
-}
-
 export { LAUNCH_WIZARD_STEPS };

package/src/global/ink/orchestrator-app.js

@@ -41,7 +41,7 @@ import { handleLaunchInput } from "./launch-input.js";
 import { useTerminalSize } from "./use-terminal-size.js";
 import { useOrchestratorData } from "./use-orchestrator-data.js";
 import { resolveTerminalCapabilities } from "./terminal-capabilities.js";
-import { COCKPIT_COLORS } from "./theme.js";
+import { COCKPIT_COLORS, resolveInkColor } from "./theme.js";
 import { LAYOUT_MODES } from "./layout.js";
 import { CHANGES_PHASE } from "./cockpit-changes.js";
 import { RECOVERY_PHASE, listRecoverySnapshots } from "./cockpit-recovery.js";
@@ -146,6 +146,10 @@ export function OrchestratorApp({
           data.reload().catch(() => {});
           return;
         }
+        if (selected.kind === PALETTE_KINDS.SETUP) {
+          finish({ cancelled: false, action: "setup" });
+          return;
+        }
         dispatch({
           type: "run-palette",
           kind: selected.kind,
@@ -161,6 +165,24 @@ export function OrchestratorApp({
       return;
     }
 
+    if (inputKey === " " && ui.view === ORCHESTRATOR_VIEWS.HOME && !ui.paletteOpen) {
+      dispatch({ type: "toggle-overview-details" });
+      return;
+    }
+
+    if (inputKey === " " && ui.view === ORCHESTRATOR_VIEWS.CHANGES && !ui.paletteOpen) {
+      dispatch({ type: "toggle-governance-details" });
+      return;
+    }
+
+    if (inputKey === " "
+      && ui.view === ORCHESTRATOR_VIEWS.ACTIVITY
+      && !ui.paletteOpen
+      && data.recoveryAction?.preview) {
+      dispatch({ type: "toggle-activity-details" });
+      return;
+    }
+
     if (key.escape) {
       if (ui.view === ORCHESTRATOR_VIEWS.CHANGES
         && data.changesAction?.phase === CHANGES_PHASE.CONFIRMING) {
@@ -262,6 +284,10 @@ export function OrchestratorApp({
           navItem: item,
           ctaDestination: data.snapshot?.cta?.destination ?? null
         });
+        if (intent.kind === "activate-setup") {
+          finish({ cancelled: false, action: "setup" });
+          return;
+        }
         if (intent.kind === "activate-cta") {
           if (openDestination(intent.destination)) return;
         }
@@ -440,14 +466,22 @@ export function OrchestratorApp({
 
   if (data.loading) {
     return React.createElement(Box, { flexDirection: "column" },
-      React.createElement(Text, { bold: true, color: COCKPIT_COLORS.primary }, "KAIRO"),
-      React.createElement(Text, { color: COCKPIT_COLORS.muted }, "Loading cockpit…")
+      React.createElement(Text, {
+        bold: true,
+        color: resolveInkColor(caps.color, COCKPIT_COLORS.brand)
+      }, "KAIRO"),
+      React.createElement(Text, {
+        color: resolveInkColor(caps.color, COCKPIT_COLORS.muted)
+      }, "Loading cockpit…")
     );
   }
 
   if (data.error) {
     return React.createElement(Box, { flexDirection: "column" },
-      React.createElement(Text, { bold: true, color: COCKPIT_COLORS.danger }, "Runtime error"),
+      React.createElement(Text, {
+        bold: true,
+        color: resolveInkColor(caps.color, COCKPIT_COLORS.danger)
+      }, "Runtime error"),
       React.createElement(Text, null, data.error),
       React.createElement(Text, { dimColor: true },
         data.retrying ? "Retrying read-only scan…" : "R Retry · Esc to exit")
@@ -495,6 +529,7 @@ export function OrchestratorApp({
         unicode,
         changesPhase: data.changesAction?.phase ?? null,
         recoveryPhase: data.recoveryAction?.phase ?? null,
+        recoveryHasPreview: Boolean(data.recoveryAction?.preview),
         settingsPhase: data.settingsAction?.phase ?? null,
         columns
       }),
@@ -542,6 +577,11 @@ export function OrchestratorApp({
           : null,
         layoutMode: mode,
         colorEnabled,
+        unicode,
+        overviewDetailsOpen: ui.overviewDetailsOpen,
+        governanceDetailsOpen: ui.governanceDetailsOpen,
+        activityDetailsOpen: ui.activityDetailsOpen,
+        contentFocused: ui.region === COCKPIT_REGIONS.CONTENT,
         homeDir
       })
     )