profclaw 2.0.0 → 2.4.0

package/dist/cli/ink/components/CostBar.d.ts

@@ -0,0 +1,19 @@
+/**
+ * CostBar Component
+ *
+ * Horizontal progress bar showing budget usage.
+ * - Green when < 50%
+ * - Yellow when 50-80%
+ * - Red when > 80%
+ *
+ * Shows: tokens used / max, estimated cost, and percentage.
+ */
+import React from 'react';
+export interface CostBarProps {
+    tokensUsed: number;
+    tokensMax: number;
+    estimatedCost?: number;
+    width?: number;
+}
+export declare const CostBar: React.FC<CostBarProps>;
+//# sourceMappingURL=CostBar.d.ts.map

package/dist/cli/ink/components/CostBar.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useStdout } from 'ink';
+function formatTokens(count) {
+    if (count >= 1000000)
+        return `${(count / 1000000).toFixed(1)}M`;
+    if (count >= 1000)
+        return `${(count / 1000).toFixed(1)}K`;
+    return count.toString();
+}
+function getBarColor(ratio) {
+    if (ratio > 0.8)
+        return 'red';
+    if (ratio > 0.5)
+        return 'yellow';
+    return 'green';
+}
+function buildBar(filled, total, fillChar = '█', emptyChar = '░') {
+    return fillChar.repeat(filled) + emptyChar.repeat(total - filled);
+}
+export const CostBar = ({ tokensUsed, tokensMax, estimatedCost, width, }) => {
+    const { stdout } = useStdout();
+    const termWidth = width ?? stdout?.columns ?? 80;
+    // Reserve space for labels on each side
+    const barWidth = Math.max(10, termWidth - 40);
+    const ratio = tokensMax > 0 ? Math.min(tokensUsed / tokensMax, 1) : 0;
+    const filledCount = Math.round(ratio * barWidth);
+    const barColor = getBarColor(ratio);
+    const pct = Math.round(ratio * 100);
+    const bar = buildBar(filledCount, barWidth);
+    const costStr = estimatedCost !== undefined && estimatedCost > 0
+        ? ` $${estimatedCost.toFixed(4)}`
+        : '';
+    return (_jsxs(Box, { flexDirection: "row", gap: 1, paddingX: 1, children: [_jsx(Text, { dimColor: true, children: "tokens" }), _jsx(Text, { color: barColor, children: bar }), _jsxs(Text, { dimColor: true, children: [formatTokens(tokensUsed), "/", formatTokens(tokensMax), " (", pct, "%)", costStr] })] }));
+};
+//# sourceMappingURL=CostBar.js.map

package/dist/cli/ink/components/HookStatus.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export interface Hook {
+    name: string;
+    point: string;
+    priority?: number;
+    active: boolean;
+}
+interface HookStatusProps {
+    hooks: Hook[];
+    loading?: boolean;
+    error?: string;
+}
+export declare function HookStatus({ hooks, loading, error }: HookStatusProps): React.ReactElement;
+export {};
+//# sourceMappingURL=HookStatus.d.ts.map

package/dist/cli/ink/components/HookStatus.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+export function HookStatus({ hooks, loading, error }) {
+    const sorted = [...hooks].sort((a, b) => (a.priority ?? 50) - (b.priority ?? 50));
+    return (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, color: "white", children: "Registered Hooks" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [loading && _jsx(Text, { dimColor: true, children: "  Loading hooks..." }), error && _jsxs(Text, { color: "red", children: ["  ", error] }), !loading && !error && sorted.length === 0 && (_jsx(Text, { dimColor: true, children: "  No hooks registered" })), !loading && !error && sorted.length > 0 && (_jsxs(_Fragment, { children: [_jsxs(Box, { gap: 2, marginBottom: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: '  Name'.padEnd(22) }), _jsx(Text, { dimColor: true, bold: true, children: 'Hook point'.padEnd(20) }), _jsx(Text, { dimColor: true, bold: true, children: 'Priority'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: "State" })] }), sorted.map((h, i) => (_jsxs(Box, { gap: 2, children: [_jsx(Text, { children: '  ' + h.name.slice(0, 20).padEnd(20) }), _jsx(Text, { dimColor: true, children: h.point.slice(0, 18).padEnd(18) }), _jsx(Text, { dimColor: true, children: String(h.priority ?? '-').padEnd(8) }), _jsx(Text, { color: h.active ? 'green' : 'gray', children: h.active ? '● active' : '○ inactive' })] }, `${h.name}-${i}`)))] }))] })] }));
+}
+//# sourceMappingURL=HookStatus.js.map

package/dist/cli/ink/components/PermissionPrompt.d.ts

@@ -0,0 +1,21 @@
+/**
+ * PermissionPrompt Component
+ *
+ * Interactive dialog asking user to approve/deny a tool action.
+ * Shows: tool name, args, permission level, reason.
+ * Options: [y]es, [n]o, [a]lways allow, [d]eny always.
+ *
+ * Captures keypress and calls onDecision with the result.
+ */
+import React from 'react';
+export type PermissionDecision = 'yes' | 'no' | 'always' | 'deny_always';
+export type PermissionLevel = 'read' | 'write' | 'execute' | 'network' | 'sensitive';
+export interface PermissionPromptProps {
+    toolName: string;
+    args: Record<string, unknown>;
+    permissionLevel: PermissionLevel;
+    reason?: string;
+    onDecision: (decision: PermissionDecision) => void;
+}
+export declare const PermissionPrompt: React.FC<PermissionPromptProps>;
+//# sourceMappingURL=PermissionPrompt.d.ts.map

package/dist/cli/ink/components/PermissionPrompt.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * PermissionPrompt Component
+ *
+ * Interactive dialog asking user to approve/deny a tool action.
+ * Shows: tool name, args, permission level, reason.
+ * Options: [y]es, [n]o, [a]lways allow, [d]eny always.
+ *
+ * Captures keypress and calls onDecision with the result.
+ */
+import { useEffect } from 'react';
+import { Box, Text, useInput } from 'ink';
+const LEVEL_COLORS = {
+    read: 'green',
+    write: 'yellow',
+    execute: 'red',
+    network: 'magenta',
+    sensitive: 'red',
+};
+function argsDisplay(args) {
+    const entries = Object.entries(args).slice(0, 3);
+    return entries
+        .map(([k, v]) => {
+        const val = String(v ?? '');
+        return `${k}: ${val.length > 40 ? val.slice(0, 39) + '…' : val}`;
+    })
+        .join(', ');
+}
+export const PermissionPrompt = ({ toolName, args, permissionLevel, reason, onDecision, }) => {
+    const levelColor = LEVEL_COLORS[permissionLevel];
+    useInput((input, key) => {
+        if (key.escape || input === 'n') {
+            onDecision('no');
+        }
+        else if (input === 'y') {
+            onDecision('yes');
+        }
+        else if (input === 'a') {
+            onDecision('always');
+        }
+        else if (input === 'd') {
+            onDecision('deny_always');
+        }
+    });
+    // Memoize useEffect dependency
+    useEffect(() => {
+        // no-op; key capture is handled by useInput above
+    }, []);
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "yellow", paddingX: 2, paddingY: 1, marginY: 1, children: [_jsx(Text, { bold: true, color: "yellow", children: "Permission Required" }), _jsxs(Box, { marginTop: 1, flexDirection: "row", gap: 1, children: [_jsx(Text, { dimColor: true, children: "Tool:" }), _jsx(Text, { bold: true, color: "cyan", children: toolName }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: levelColor, children: permissionLevel })] }), Object.keys(args).length > 0 && (_jsxs(Box, { marginTop: 0, flexDirection: "row", gap: 1, children: [_jsx(Text, { dimColor: true, children: "Args:" }), _jsx(Text, { color: "gray", children: argsDisplay(args) })] })), reason !== undefined && reason.length > 0 && (_jsxs(Box, { marginTop: 0, flexDirection: "row", gap: 1, children: [_jsx(Text, { dimColor: true, children: "Why:" }), _jsx(Text, { color: "white", children: reason })] })), _jsxs(Box, { marginTop: 1, flexDirection: "row", gap: 2, children: [_jsx(Text, { color: "green", children: "[y] Yes" }), _jsx(Text, { color: "red", children: "[n] No" }), _jsx(Text, { color: "cyan", children: "[a] Always allow" }), _jsx(Text, { color: "magenta", children: "[d] Always deny" })] })] }));
+};
+//# sourceMappingURL=PermissionPrompt.js.map

package/dist/cli/ink/components/PlanView.d.ts

@@ -0,0 +1,23 @@
+/**
+ * PlanView Component
+ *
+ * Renders a Plan with steps. Each step shows: index, description,
+ * and status (checkbox style).
+ * - Green checkmark for completed
+ * - Yellow circle for in_progress
+ * - Gray dash for pending
+ */
+import React from 'react';
+export type PlanStepStatus = 'pending' | 'in_progress' | 'completed' | 'failed' | 'skipped';
+export interface PlanStep {
+    index: number;
+    description: string;
+    status: PlanStepStatus;
+    detail?: string;
+}
+export interface PlanViewProps {
+    title?: string;
+    steps: PlanStep[];
+}
+export declare const PlanView: React.FC<PlanViewProps>;
+//# sourceMappingURL=PlanView.d.ts.map

package/dist/cli/ink/components/PlanView.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+const STEP_ICON = {
+    pending: '○',
+    in_progress: '◐',
+    completed: '✓',
+    failed: '✗',
+    skipped: '—',
+};
+const STEP_COLOR = {
+    pending: 'gray',
+    in_progress: 'yellow',
+    completed: 'green',
+    failed: 'red',
+    skipped: 'gray',
+};
+const PlanStepRow = ({ step }) => {
+    const icon = STEP_ICON[step.status];
+    const color = STEP_COLOR[step.status];
+    const isActive = step.status === 'in_progress';
+    return (_jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: color, children: icon }), _jsxs(Text, { color: isActive ? 'white' : 'gray', bold: isActive, children: [step.index + 1, "."] }), _jsx(Text, { color: isActive ? 'white' : 'gray', children: step.description })] }), step.detail !== undefined && step.detail.length > 0 && (_jsx(Box, { paddingLeft: 4, children: _jsx(Text, { dimColor: true, children: step.detail }) }))] }));
+};
+export const PlanView = ({ title, steps }) => {
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, marginY: 1, children: [title !== undefined && title.length > 0 && (_jsx(Text, { bold: true, color: "cyan", children: title })), steps.map((step) => (_jsx(PlanStepRow, { step: step }, step.index)))] }));
+};
+//# sourceMappingURL=PlanView.js.map

package/dist/cli/ink/components/ProviderList.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+export interface Provider {
+    type: string;
+    healthy: boolean;
+    latencyMs?: number;
+    modelCount?: number;
+    priority?: number;
+}
+interface ProviderListProps {
+    providers: Provider[];
+    loading?: boolean;
+    error?: string;
+}
+export declare function ProviderList({ providers, loading, error }: ProviderListProps): React.ReactElement;
+export {};
+//# sourceMappingURL=ProviderList.d.ts.map

package/dist/cli/ink/components/ProviderList.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+function StatusDot({ healthy }) {
+    return (_jsx(Text, { color: healthy ? 'green' : 'red', children: healthy ? '●' : '●' }));
+}
+function LatencyLabel({ ms }) {
+    if (ms == null)
+        return _jsx(Text, { dimColor: true, children: "-" });
+    const color = ms < 500 ? 'green' : ms < 1500 ? 'yellow' : 'red';
+    return _jsxs(Text, { color: color, children: [ms, "ms"] });
+}
+export function ProviderList({ providers, loading, error }) {
+    const sorted = [...providers].sort((a, b) => (a.priority ?? 99) - (b.priority ?? 99));
+    return (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, color: "white", children: "AI Providers" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [loading && _jsx(Text, { dimColor: true, children: "  Loading providers..." }), error && _jsxs(Text, { color: "red", children: ["  ", error] }), !loading && !error && sorted.length === 0 && (_jsx(Text, { dimColor: true, children: "  No providers configured" })), !loading && !error && sorted.length > 0 && (_jsxs(_Fragment, { children: [_jsxs(Box, { gap: 2, marginBottom: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: '  Provider'.padEnd(16) }), _jsx(Text, { dimColor: true, bold: true, children: 'Status'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: 'Latency'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: "Models" })] }), sorted.filter((p) => p.type).map((p) => (_jsxs(Box, { gap: 2, children: [_jsx(Text, { children: '  ' + (p.type ?? '').padEnd(14) }), _jsxs(Box, { width: 10, gap: 1, children: [_jsx(StatusDot, { healthy: p.healthy }), _jsx(Text, { color: p.healthy ? 'green' : 'red', children: p.healthy ? 'online' : 'offline' })] }), _jsx(Box, { width: 10, children: _jsx(LatencyLabel, { ms: p.latencyMs }) }), _jsx(Text, { dimColor: true, children: p.modelCount != null ? String(p.modelCount) : '-' })] }, p.type)))] }))] })] }));
+}
+//# sourceMappingURL=ProviderList.js.map

package/dist/cli/ink/components/SessionHeader.d.ts

@@ -0,0 +1,15 @@
+/**
+ * SessionHeader Component
+ *
+ * Compact one-line display showing session info:
+ * model name, provider, session ID, and mode (pico/mini/pro).
+ */
+import React from 'react';
+export interface SessionHeaderProps {
+    model: string;
+    provider: string;
+    sessionId: string;
+    mode: 'pico' | 'mini' | 'pro' | 'chat' | 'agentic';
+}
+export declare const SessionHeader: React.FC<SessionHeaderProps>;
+//# sourceMappingURL=SessionHeader.d.ts.map

package/dist/cli/ink/components/SessionHeader.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+const MODE_COLORS = {
+    pico: 'cyan',
+    mini: 'green',
+    pro: 'magenta',
+    chat: 'cyan',
+    agentic: 'yellow',
+};
+export const SessionHeader = ({ model, provider, sessionId, mode, }) => {
+    const modeColor = MODE_COLORS[mode] ?? 'white';
+    const shortId = sessionId.slice(0, 8);
+    return (_jsxs(Box, { flexDirection: "row", gap: 2, borderStyle: "single", borderColor: "gray", paddingX: 1, children: [_jsx(Text, { color: "cyan", bold: true, children: "profClaw" }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: "white", children: model }), _jsx(Text, { dimColor: true, children: "via" }), _jsx(Text, { color: "blue", children: provider }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { color: modeColor, children: mode }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: ["#", shortId] })] }));
+};
+//# sourceMappingURL=SessionHeader.js.map

package/dist/cli/ink/components/StreamingMessage.d.ts

@@ -0,0 +1,20 @@
+/**
+ * StreamingMessage Component
+ *
+ * Renders streaming or complete LLM output with full markdown formatting.
+ * Delegates to renderMarkdown() in markdown-renderer.tsx for consistent,
+ * rich rendering: bold, italic, code blocks with syntax highlighting,
+ * headings, blockquotes, lists, links, strikethrough, and horizontal rules.
+ *
+ * For streaming, pass isStreaming=true and update `content` as tokens arrive.
+ * A blinking cursor is shown at the end of the partial line while streaming.
+ */
+import React from 'react';
+export interface StreamingMessageProps {
+    role: 'user' | 'assistant';
+    content: string;
+    isStreaming?: boolean;
+    model?: string;
+}
+export declare const StreamingMessage: React.FC<StreamingMessageProps>;
+//# sourceMappingURL=StreamingMessage.d.ts.map

package/dist/cli/ink/components/StreamingMessage.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * StreamingMessage Component
+ *
+ * Renders streaming or complete LLM output with full markdown formatting.
+ * Delegates to renderMarkdown() in markdown-renderer.tsx for consistent,
+ * rich rendering: bold, italic, code blocks with syntax highlighting,
+ * headings, blockquotes, lists, links, strikethrough, and horizontal rules.
+ *
+ * For streaming, pass isStreaming=true and update `content` as tokens arrive.
+ * A blinking cursor is shown at the end of the partial line while streaming.
+ */
+import { useMemo } from 'react';
+import { Box, Text } from 'ink';
+import { renderMarkdown } from '../markdown-renderer.js';
+export const StreamingMessage = ({ role, content, isStreaming = false, model, }) => {
+    const isUser = role === 'user';
+    // For streaming, append the cursor character to the raw content so
+    // renderMarkdown sees it as part of the last text run.
+    const displayContent = isStreaming ? content + '▌' : content;
+    // Memoize rendered output so renderMarkdown is only called when content changes
+    const rendered = useMemo(() => {
+        return renderMarkdown(displayContent, { syntaxHighlight: true, linkStyle: 'inline' });
+    }, [displayContent]);
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, marginY: 0, borderLeft: !isUser, borderTop: false, borderBottom: false, borderRight: false, borderLeftColor: !isUser ? 'cyan' : undefined, borderStyle: "single", children: [_jsxs(Box, { flexDirection: "row", gap: 1, marginBottom: 0, children: [_jsx(Text, { bold: true, color: isUser ? 'green' : 'cyan', children: isUser ? 'You' : 'profClaw' }), model !== undefined && !isUser && (_jsxs(Text, { dimColor: true, children: ["(", model, ")"] }))] }), _jsx(Box, { flexDirection: "column", paddingLeft: isUser ? 0 : 1, children: rendered })] }));
+};
+//# sourceMappingURL=StreamingMessage.js.map

package/dist/cli/ink/components/SuggestionBar.d.ts

@@ -0,0 +1,15 @@
+/**
+ * SuggestionBar
+ *
+ * Renders 2-3 dimmed follow-up prompt suggestions below the last assistant
+ * response. The user can press 1, 2, or 3 to select a suggestion.
+ */
+import React from 'react';
+import type { Suggestion } from '../../../agents/prompt-suggestions.js';
+export interface SuggestionBarProps {
+    suggestions: Suggestion[];
+    isActive: boolean;
+    onSelect: (text: string) => void;
+}
+export declare const SuggestionBar: React.FC<SuggestionBarProps>;
+//# sourceMappingURL=SuggestionBar.d.ts.map

package/dist/cli/ink/components/SuggestionBar.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useInput } from 'ink';
+// ── Category colors ───────────────────────────────────────────────────────────
+function categoryColor(category) {
+    switch (category) {
+        case 'action': return 'yellow';
+        case 'deeper': return 'cyan';
+        case 'related': return 'magenta';
+        case 'follow-up':
+        default: return 'white';
+    }
+}
+// ── Component ─────────────────────────────────────────────────────────────────
+export const SuggestionBar = ({ suggestions, isActive, onSelect, }) => {
+    useInput((input) => {
+        const digit = parseInt(input, 10);
+        if (!isNaN(digit) && digit >= 1 && digit <= suggestions.length) {
+            const suggestion = suggestions[digit - 1];
+            if (suggestion) {
+                onSelect(suggestion.text);
+            }
+        }
+    }, { isActive });
+    if (suggestions.length === 0)
+        return null;
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 0, marginTop: 0, children: [_jsx(Text, { dimColor: true, children: "  \u254C suggestions \u254C" }), suggestions.map((s, i) => (_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: `  ${i + 1}.` }), _jsx(Text, { dimColor: true, color: categoryColor(s.category), children: s.text })] }, i))), _jsxs(Text, { dimColor: true, children: ["     press 1\u2013", suggestions.length, " to use"] })] }));
+};
+//# sourceMappingURL=SuggestionBar.js.map

package/dist/cli/ink/components/SystemHealth.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export interface SystemMetrics {
+    version?: string;
+    uptime?: number;
+    mode?: string;
+    healthy?: boolean;
+    memoryUsedMb?: number;
+    memoryTotalMb?: number;
+    cpuPercent?: number;
+    queueBackend?: 'redis' | 'memory';
+    degraded?: boolean;
+}
+interface SystemHealthProps {
+    metrics: SystemMetrics;
+    loading?: boolean;
+    error?: string;
+}
+export declare function SystemHealth({ metrics, loading, error }: SystemHealthProps): React.ReactElement;
+export {};
+//# sourceMappingURL=SystemHealth.d.ts.map

package/dist/cli/ink/components/SystemHealth.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+function formatUptime(seconds) {
+    const d = Math.floor(seconds / 86400);
+    const h = Math.floor((seconds % 86400) / 3600);
+    const m = Math.floor((seconds % 3600) / 60);
+    const parts = [];
+    if (d > 0)
+        parts.push(`${d}d`);
+    if (h > 0)
+        parts.push(`${h}h`);
+    parts.push(`${m}m`);
+    return parts.join(' ');
+}
+function HealthRow({ label, value, color = 'white', dimColor = false }) {
+    return (_jsxs(Box, { gap: 0, children: [_jsx(Text, { dimColor: true, children: '  ' + label.padEnd(16) }), _jsx(Text, { color: dimColor ? undefined : color, dimColor: dimColor, children: value })] }));
+}
+export function SystemHealth({ metrics, loading, error }) {
+    if (loading) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: "white", children: "System Health" }), _jsx(Text, { dimColor: true, children: "  Loading..." })] }));
+    }
+    if (error) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: "white", children: "System Health" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: "red", children: "  Unable to connect to profClaw server." }), _jsx(Text, { dimColor: true, children: "  Is it running? Try: profclaw serve" })] })] }));
+    }
+    const healthColor = metrics.healthy ? 'green' : 'red';
+    const healthLabel = metrics.healthy
+        ? '● healthy'
+        : metrics.degraded
+            ? '● degraded'
+            : '● unhealthy';
+    const memUsage = metrics.memoryUsedMb != null && metrics.memoryTotalMb != null
+        ? `${metrics.memoryUsedMb}MB / ${metrics.memoryTotalMb}MB`
+        : undefined;
+    const cpuColor = (metrics.cpuPercent ?? 0) > 80 ? 'red'
+        : (metrics.cpuPercent ?? 0) > 50 ? 'yellow'
+            : 'green';
+    return (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsxs(Box, { gap: 2, children: [_jsx(Text, { bold: true, color: "white", children: "System Health" }), metrics.degraded && (_jsx(Text, { color: "yellow", bold: true, children: "\u26A0 DEGRADED" }))] }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [metrics.version && (_jsx(HealthRow, { label: "Version", value: metrics.version, dimColor: true })), _jsx(HealthRow, { label: "Status", value: healthLabel, color: healthColor }), _jsx(HealthRow, { label: "Mode", value: metrics.mode ?? 'mini', color: "cyan" }), metrics.uptime != null && (_jsx(HealthRow, { label: "Uptime", value: formatUptime(metrics.uptime), dimColor: true })), memUsage && (_jsx(HealthRow, { label: "Memory", value: memUsage, dimColor: true })), metrics.cpuPercent != null && (_jsx(HealthRow, { label: "CPU", value: `${metrics.cpuPercent.toFixed(1)}%`, color: cpuColor })), _jsx(HealthRow, { label: "Queue backend", value: metrics.queueBackend ?? 'memory', color: metrics.queueBackend === 'redis' ? 'green' : 'yellow' })] })] }));
+}
+//# sourceMappingURL=SystemHealth.js.map

package/dist/cli/ink/components/TaskList.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+export type TaskStatus = 'pending' | 'running' | 'completed' | 'failed' | 'cancelled';
+export interface Task {
+    id: string;
+    title: string;
+    status: TaskStatus;
+    createdAt: string;
+    durationMs?: number;
+}
+interface TaskListProps {
+    tasks: Task[];
+    loading?: boolean;
+    error?: string;
+}
+export declare function TaskList({ tasks, loading, error }: TaskListProps): React.ReactElement;
+export {};
+//# sourceMappingURL=TaskList.d.ts.map

package/dist/cli/ink/components/TaskList.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+function statusColor(status) {
+    const map = {
+        pending: 'gray',
+        running: 'yellow',
+        completed: 'green',
+        failed: 'red',
+        cancelled: 'gray',
+    };
+    return map[status];
+}
+function statusLabel(status) {
+    const map = {
+        pending: 'pending',
+        running: 'running',
+        completed: 'done',
+        failed: 'failed',
+        cancelled: 'cancel',
+    };
+    return map[status];
+}
+function formatDuration(ms) {
+    if (ms == null)
+        return '-';
+    if (ms < 1000)
+        return `${ms}ms`;
+    if (ms < 60000)
+        return `${(ms / 1000).toFixed(1)}s`;
+    return `${Math.floor(ms / 60000)}m${Math.floor((ms % 60000) / 1000)}s`;
+}
+function formatRelative(iso) {
+    const diff = Date.now() - new Date(iso).getTime();
+    const s = Math.floor(diff / 1000);
+    if (s < 60)
+        return `${s}s ago`;
+    const m = Math.floor(s / 60);
+    if (m < 60)
+        return `${m}m ago`;
+    const h = Math.floor(m / 60);
+    if (h < 24)
+        return `${h}h ago`;
+    return `${Math.floor(h / 24)}d ago`;
+}
+function truncateId(id) {
+    if (!id)
+        return '—';
+    return id.length > 8 ? id.slice(0, 8) : id;
+}
+function truncateTitle(title, max = 30) {
+    if (!title)
+        return '(untitled)';
+    return title.length > max ? title.slice(0, max - 1) + '…' : title;
+}
+export function TaskList({ tasks, loading, error }) {
+    const sorted = [...tasks].sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
+    return (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, color: "white", children: "Recent Tasks" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [loading && _jsx(Text, { dimColor: true, children: "  Loading tasks..." }), error && _jsxs(Text, { color: "red", children: ["  ", error] }), !loading && !error && sorted.length === 0 && (_jsx(Text, { dimColor: true, children: "  No tasks yet" })), !loading && !error && sorted.length > 0 && (_jsxs(_Fragment, { children: [_jsxs(Box, { gap: 2, marginBottom: 1, children: [_jsx(Text, { dimColor: true, bold: true, children: '  ID'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: 'Title'.padEnd(32) }), _jsx(Text, { dimColor: true, bold: true, children: 'Status'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: 'Created'.padEnd(10) }), _jsx(Text, { dimColor: true, bold: true, children: "Duration" })] }), sorted.map((t) => (_jsxs(Box, { gap: 2, children: [_jsx(Text, { dimColor: true, children: '  ' + truncateId(t.id).padEnd(8) }), _jsx(Text, { children: truncateTitle(t.title).padEnd(31) }), _jsx(Box, { width: 10, children: _jsx(Text, { color: statusColor(t.status), children: statusLabel(t.status).padEnd(8) }) }), _jsx(Text, { dimColor: true, children: formatRelative(t.createdAt).padEnd(10) }), _jsx(Text, { dimColor: true, children: formatDuration(t.durationMs) })] }, t.id)))] }))] })] }));
+}
+//# sourceMappingURL=TaskList.js.map

package/dist/cli/ink/components/ToolCall.d.ts

@@ -0,0 +1,17 @@
+/**
+ * ToolCall Component
+ *
+ * Renders a single tool call with name, args preview, result, and duration.
+ * Color-coded: green for success, red for error, yellow for timeout/pending.
+ */
+import React from 'react';
+export type ToolCallStatus = 'pending' | 'running' | 'success' | 'error' | 'timeout';
+export interface ToolCallProps {
+    name: string;
+    args: Record<string, unknown>;
+    result?: unknown;
+    status: ToolCallStatus;
+    durationMs?: number;
+}
+export declare const ToolCall: React.FC<ToolCallProps>;
+//# sourceMappingURL=ToolCall.d.ts.map

package/dist/cli/ink/components/ToolCall.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+function argsPreview(args, maxLen = 60) {
+    const entries = Object.entries(args);
+    if (entries.length === 0)
+        return '{}';
+    const [, firstVal] = entries[0];
+    const preview = String(firstVal ?? '');
+    return preview.length > maxLen ? preview.slice(0, maxLen - 1) + '…' : preview;
+}
+function resultPreview(result, maxLen = 80) {
+    if (result === undefined || result === null)
+        return '';
+    const str = typeof result === 'string' ? result : JSON.stringify(result);
+    return str.length > maxLen ? str.slice(0, maxLen - 1) + '…' : str;
+}
+const STATUS_COLOR = {
+    pending: 'gray',
+    running: 'yellow',
+    success: 'green',
+    error: 'red',
+    timeout: 'yellow',
+};
+const STATUS_ICON = {
+    pending: '○',
+    running: '◎',
+    success: '✓',
+    error: '✗',
+    timeout: '⏱',
+};
+function formatDuration(ms) {
+    if (ms < 1000)
+        return `${ms}ms`;
+    return `${(ms / 1000).toFixed(1)}s`;
+}
+export const ToolCall = ({ name, args, result, status, durationMs, }) => {
+    const color = STATUS_COLOR[status];
+    const icon = STATUS_ICON[status];
+    const preview = argsPreview(args);
+    const res = result !== undefined ? resultPreview(result) : undefined;
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, marginY: 0, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Text, { color: color, children: icon }), _jsx(Text, { color: "yellow", bold: true, children: name }), preview.length > 0 && _jsx(Text, { dimColor: true, children: preview }), durationMs !== undefined && (_jsxs(Text, { dimColor: true, children: ["(", formatDuration(durationMs), ")"] }))] }), res !== undefined && res.length > 0 && (_jsx(Box, { paddingLeft: 3, children: _jsx(Text, { color: status === 'error' ? 'red' : 'gray', children: res }) }))] }));
+};
+//# sourceMappingURL=ToolCall.js.map

package/dist/cli/ink/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Ink TUI — Barrel exports
+ *
+ * All public components and types for the Ink-based TUI layer.
+ */
+export { App } from './App.js';
+export { ChatApp } from './ChatApp.js';
+export type { ChatAppProps, PendingPermission, PickerOption } from './ChatApp.js';
+export { AgentStatus } from './components/AgentStatus.js';
+export type { AgentStatusProps, AgentStatusState } from './components/AgentStatus.js';
+export { CostBar } from './components/CostBar.js';
+export type { CostBarProps } from './components/CostBar.js';
+export { PermissionPrompt } from './components/PermissionPrompt.js';
+export type { PermissionPromptProps, PermissionDecision, PermissionLevel, } from './components/PermissionPrompt.js';
+export { PlanView } from './components/PlanView.js';
+export type { PlanViewProps, PlanStep, PlanStepStatus } from './components/PlanView.js';
+export { SessionHeader } from './components/SessionHeader.js';
+export type { SessionHeaderProps } from './components/SessionHeader.js';
+export { StreamingMessage } from './components/StreamingMessage.js';
+export type { StreamingMessageProps } from './components/StreamingMessage.js';
+export { ToolCall } from './components/ToolCall.js';
+export type { ToolCallProps, ToolCallStatus } from './components/ToolCall.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/cli/ink/index.js

@@ -0,0 +1,15 @@
+/**
+ * Ink TUI — Barrel exports
+ *
+ * All public components and types for the Ink-based TUI layer.
+ */
+export { App } from './App.js';
+export { ChatApp } from './ChatApp.js';
+export { AgentStatus } from './components/AgentStatus.js';
+export { CostBar } from './components/CostBar.js';
+export { PermissionPrompt } from './components/PermissionPrompt.js';
+export { PlanView } from './components/PlanView.js';
+export { SessionHeader } from './components/SessionHeader.js';
+export { StreamingMessage } from './components/StreamingMessage.js';
+export { ToolCall } from './components/ToolCall.js';
+//# sourceMappingURL=index.js.map