agentk8 2.2.1 → 2.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli.js +1 -1
- package/dist/components/StatusBar.js +27 -11
- package/dist/components/WelcomeBox.js +14 -1
- package/package.json +1 -1
package/dist/cli.js
CHANGED
|
@@ -11,21 +11,23 @@ const theme = {
|
|
|
11
11
|
active: '#f6e05e',
|
|
12
12
|
done: '#48bb78',
|
|
13
13
|
};
|
|
14
|
-
// Agent icons
|
|
14
|
+
// Agent icons - matching WelcomeBox symbols
|
|
15
15
|
const agentIcons = {
|
|
16
|
-
Orchestrator: '
|
|
17
|
-
Engineer: '
|
|
18
|
-
Tester: '
|
|
19
|
-
Security: '
|
|
20
|
-
Scout: '
|
|
21
|
-
Researcher: '
|
|
22
|
-
'ML Engineer': '
|
|
23
|
-
'Data Engineer': '
|
|
24
|
-
Evaluator: '
|
|
16
|
+
Orchestrator: '*',
|
|
17
|
+
Engineer: '#',
|
|
18
|
+
Tester: '+',
|
|
19
|
+
Security: '!',
|
|
20
|
+
Scout: '@',
|
|
21
|
+
Researcher: '~',
|
|
22
|
+
'ML Engineer': '%',
|
|
23
|
+
'Data Engineer': '&',
|
|
24
|
+
Evaluator: '^',
|
|
25
25
|
};
|
|
26
26
|
export const StatusBar = ({ mode, tokens, startTime, isProcessing = false, activeAgent, completedAgents = [], }) => {
|
|
27
27
|
const [elapsed, setElapsed] = useState('');
|
|
28
28
|
const [spinnerFrame, setSpinnerFrame] = useState(0);
|
|
29
|
+
const [pulseFrame, setPulseFrame] = useState(0);
|
|
30
|
+
const pulseBrackets = ['[', '(', '{', '<', '{', '('];
|
|
29
31
|
useEffect(() => {
|
|
30
32
|
if (!isProcessing) {
|
|
31
33
|
setElapsed('');
|
|
@@ -47,6 +49,15 @@ export const StatusBar = ({ mode, tokens, startTime, isProcessing = false, activ
|
|
|
47
49
|
}, 100);
|
|
48
50
|
return () => clearInterval(interval);
|
|
49
51
|
}, [isProcessing]);
|
|
52
|
+
// Pulse animation for active agent
|
|
53
|
+
useEffect(() => {
|
|
54
|
+
if (!activeAgent)
|
|
55
|
+
return;
|
|
56
|
+
const interval = setInterval(() => {
|
|
57
|
+
setPulseFrame(f => (f + 1) % pulseBrackets.length);
|
|
58
|
+
}, 200);
|
|
59
|
+
return () => clearInterval(interval);
|
|
60
|
+
}, [activeAgent]);
|
|
50
61
|
const formatTokens = (t) => {
|
|
51
62
|
if (t >= 1000000)
|
|
52
63
|
return `${(t / 1000000).toFixed(1)}M`;
|
|
@@ -66,6 +77,11 @@ export const StatusBar = ({ mode, tokens, startTime, isProcessing = false, activ
|
|
|
66
77
|
return theme.done;
|
|
67
78
|
return theme.dim;
|
|
68
79
|
};
|
|
69
|
-
return (_jsxs(Box, { children: [_jsx(Text, { color: theme.dim, children: " " }), _jsx(Text, { color: theme.accent, children: modeLabel }), _jsx(Text, { color: theme.border, children: " \u2502 " }), modeAgents.map((agent, i) =>
|
|
80
|
+
return (_jsxs(Box, { children: [_jsx(Text, { color: theme.dim, children: " " }), _jsx(Text, { color: theme.accent, children: modeLabel }), _jsx(Text, { color: theme.border, children: " \u2502 " }), modeAgents.map((agent, i) => {
|
|
81
|
+
const isActive = activeAgent === agent;
|
|
82
|
+
const leftBracket = isActive ? pulseBrackets[pulseFrame] : '[';
|
|
83
|
+
const rightBracket = isActive ? pulseBrackets[(pulseFrame + 3) % pulseBrackets.length] === '<' ? '>' : pulseBrackets[(pulseFrame + 3) % pulseBrackets.length] === '{' ? '}' : pulseBrackets[(pulseFrame + 3) % pulseBrackets.length] === '(' ? ')' : ']' : ']';
|
|
84
|
+
return (_jsxs(React.Fragment, { children: [_jsx(Text, { color: getAgentColor(agent), children: leftBracket }), _jsx(Text, { color: getAgentColor(agent), children: agentIcons[agent] }), _jsx(Text, { color: getAgentColor(agent), children: rightBracket }), i < modeAgents.length - 1 && _jsx(Text, { color: theme.dim, children: " " })] }, agent));
|
|
85
|
+
}), _jsx(Text, { color: theme.border, children: " \u2502 " }), _jsx(Text, { color: theme.dim, children: "? help" }), isProcessing && (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.border, children: " \u2502 " }), _jsx(Text, { color: theme.highlight, children: icons.spinner[spinnerFrame] })] })), elapsed && (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.border, children: " \u2502 " }), _jsx(Text, { color: theme.dim, children: elapsed })] })), _jsx(Text, { color: theme.dim, children: ' '.repeat(3) }), _jsxs(Text, { color: theme.accent, children: ["\u2191 ", formatTokens(tokens)] }), _jsx(Text, { color: theme.dim, children: " tokens" })] }));
|
|
70
86
|
};
|
|
71
87
|
export default StatusBar;
|
|
@@ -8,6 +8,9 @@ const theme = {
|
|
|
8
8
|
dim: '#718096',
|
|
9
9
|
text: '#e2e8f0',
|
|
10
10
|
title: '#f6e05e',
|
|
11
|
+
koi1: '#f6ad55', // orange koi
|
|
12
|
+
koi2: '#e2e8f0', // white koi
|
|
13
|
+
water: '#4299e1', // blue water
|
|
11
14
|
};
|
|
12
15
|
export const WelcomeBox = ({ version, mode }) => {
|
|
13
16
|
const termWidth = Math.min(process.stdout.columns || 120, 120);
|
|
@@ -15,6 +18,16 @@ export const WelcomeBox = ({ version, mode }) => {
|
|
|
15
18
|
const leftWidth = Math.floor(boxWidth * 0.45);
|
|
16
19
|
const rightWidth = boxWidth - leftWidth - 3;
|
|
17
20
|
const modeLabel = mode === 'dev' ? 'Software Development' : 'ML Research';
|
|
21
|
+
// Agent icons matching StatusBar
|
|
22
|
+
const agentIcons = {
|
|
23
|
+
Orchestrator: '*',
|
|
24
|
+
Engineer: '#',
|
|
25
|
+
Tester: '+',
|
|
26
|
+
Security: '!',
|
|
27
|
+
Researcher: '~',
|
|
28
|
+
'ML Engineer': '%',
|
|
29
|
+
Evaluator: '^',
|
|
30
|
+
};
|
|
18
31
|
const agents = mode === 'dev'
|
|
19
32
|
? ['Orchestrator', 'Engineer', 'Tester', 'Security']
|
|
20
33
|
: ['Orchestrator', 'Researcher', 'ML Engineer', 'Evaluator'];
|
|
@@ -22,6 +35,6 @@ export const WelcomeBox = ({ version, mode }) => {
|
|
|
22
35
|
const titleText = ` AGENT-K v${version} `;
|
|
23
36
|
const titlePadLeft = Math.floor((boxWidth - titleText.length) / 2);
|
|
24
37
|
const titlePadRight = boxWidth - titleText.length - titlePadLeft;
|
|
25
|
-
return (_jsxs(Box, { flexDirection: "column", marginY: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u256D" }), _jsx(Text, { color: theme.border, children: '─'.repeat(titlePadLeft - 1) }), _jsx(Text, { color: theme.title, bold: true, children: titleText }), _jsx(Text, { color: theme.border, children: '─'.repeat(titlePadRight - 1) }), _jsx(Text, { color: theme.border, children: "\u256E" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Text, { children: ' '.repeat(boxWidth) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }),
|
|
38
|
+
return (_jsxs(Box, { flexDirection: "column", marginY: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u256D" }), _jsx(Text, { color: theme.border, children: '─'.repeat(titlePadLeft - 1) }), _jsx(Text, { color: theme.title, bold: true, children: titleText }), _jsx(Text, { color: theme.border, children: '─'.repeat(titlePadRight - 1) }), _jsx(Text, { color: theme.border, children: "\u256E" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Text, { children: ' '.repeat(boxWidth) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsxs(Box, { width: leftWidth, justifyContent: "center", children: [_jsx(Text, { color: theme.water, children: "~" }), _jsxs(Text, { color: theme.koi1, children: [" ><(((", "'", "> "] })] }), _jsx(Text, { color: theme.border, children: "\u2502" }), _jsxs(Box, { width: rightWidth, paddingLeft: 1, children: [_jsx(Text, { color: theme.text, children: "Welcome to " }), _jsx(Text, { color: theme.accent, bold: true, children: "AGENT-K" })] }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Box, { width: leftWidth, justifyContent: "center", children: _jsx(Text, { color: theme.water, children: " ~ ~ " }) }), _jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Box, { width: rightWidth, paddingLeft: 1, children: _jsx(Text, { color: theme.dim, children: "Multi-Agent Intelligence System" }) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsxs(Box, { width: leftWidth, justifyContent: "center", children: [_jsxs(Text, { color: theme.koi2, children: [" <", "'", ")))><"] }), _jsx(Text, { color: theme.water, children: " ~" })] }), _jsx(Text, { color: theme.border, children: "\u2502" }), _jsxs(Box, { width: rightWidth, paddingLeft: 1, children: [_jsx(Text, { color: theme.dim, children: "Mode: " }), _jsx(Text, { color: theme.highlight, children: modeLabel })] }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Text, { children: ' '.repeat(boxWidth) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Box, { width: boxWidth, justifyContent: "center", children: agents.map((agent, i) => (_jsxs(React.Fragment, { children: [_jsxs(Text, { color: theme.accent, children: ["[", agentIcons[agent], "] "] }), _jsx(Text, { color: theme.text, children: agent }), i < agents.length - 1 && _jsx(Text, { color: theme.dim, children: " \u00B7 " })] }, agent))) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Text, { children: ' '.repeat(boxWidth) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2502" }), _jsx(Box, { width: boxWidth, justifyContent: "center", children: _jsx(Text, { color: theme.dim, children: "/help for commands \u00B7 /plan or /auto to set mode \u00B7 Ctrl+C to exit" }) }), _jsx(Text, { color: theme.border, children: "\u2502" })] }), _jsxs(Box, { children: [_jsx(Text, { color: theme.border, children: "\u2570" }), _jsx(Text, { color: theme.border, children: '─'.repeat(boxWidth) }), _jsx(Text, { color: theme.border, children: "\u256F" })] })] }));
|
|
26
39
|
};
|
|
27
40
|
export default WelcomeBox;
|