flowmind 1.0.1 → 1.2.2

package/tui/app.jsx

@@ -0,0 +1,69 @@
+const React = require('react');
+const { Box, Text, useApp, useInput } = require('ink');
+const Sidebar = require('./components/Sidebar.jsx');
+const ChatPanel = require('./components/ChatPanel.jsx');
+const ResultPanel = require('./components/ResultPanel.jsx');
+const StatusBar = require('./components/StatusBar.jsx');
+
+function App({ flowmind }) {
+  const [results, setResults] = React.useState([]);
+  const [isProcessing, setIsProcessing] = React.useState(false);
+  const mountedRef = React.useRef(true);
+  const { exit } = useApp();
+
+  React.useEffect(() => {
+    return () => { mountedRef.current = false; };
+  }, []);
+
+  useInput((input, key) => {
+    if (key.ctrl && input === 'c') exit();
+  });
+
+  const handleCommand = React.useCallback(async (input, addResponse) => {
+    setIsProcessing(true);
+    try {
+      const result = await flowmind.process(input);
+      if (!mountedRef.current) return;
+      if (result.type === 'result') {
+        const text = typeof result.data === 'string' ? result.data : JSON.stringify(result.data, null, 2);
+        addResponse(text.substring(0, 200) + (text.length > 200 ? '...' : ''));
+      } else if (result.type === 'learning') {
+        addResponse(result.message || 'Learning recorded');
+      } else if (result.type === 'error') {
+        addResponse('Error: ' + result.message);
+      }
+      setResults(prev => [...prev, result]);
+    } catch (e) {
+      if (mountedRef.current) addResponse('Error: ' + e.message);
+    } finally {
+      if (mountedRef.current) setIsProcessing(false);
+    }
+  }, [flowmind]);
+
+  const handleSkillSelect = React.useCallback((skill) => {
+    try {
+      setResults(prev => [...prev, {
+        type: 'result',
+        data: { name: skill.name, description: skill.definition?.description || 'No description', category: skill.category || 'general', path: skill.path },
+        metadata: { skill: skill.name }
+      }]);
+    } catch (e) {
+      // ignore skill select errors
+    }
+  }, []);
+
+  return (
+    React.createElement(Box, { flexDirection: 'column', width: '100%', height: '100%' },
+      React.createElement(Box, { flexDirection: 'row', flexGrow: 1 },
+        React.createElement(Sidebar, { flowmind: flowmind, width: 30, onSkillSelect: handleSkillSelect }),
+        React.createElement(Box, { flexDirection: 'column', width: '70%', flexGrow: 1 },
+          React.createElement(ChatPanel, { onSubmit: handleCommand, isProcessing: isProcessing, onExit: exit }),
+          React.createElement(ResultPanel, { results: results })
+        )
+      ),
+      React.createElement(StatusBar, { flowmind: flowmind })
+    )
+  );
+}
+
+module.exports = App;

package/tui/components/ChatPanel.jsx

@@ -0,0 +1,72 @@
+const React = require('react');
+const { Box, Text } = require('ink');
+const TextInput = require('ink-text-input').default || require('ink-text-input');
+const Spinner = require('ink-spinner').default || require('ink-spinner');
+
+function ChatPanel({ onSubmit, isProcessing, onExit }) {
+  const [input, setInput] = React.useState('');
+  const [history, setHistory] = React.useState([]);
+  const mountedRef = React.useRef(true);
+
+  React.useEffect(() => {
+    return () => { mountedRef.current = false; };
+  }, []);
+
+  const handleSubmit = (value) => {
+    if (!value.trim()) return;
+    setHistory(prev => [...prev, { role: 'user', text: value }]);
+    setInput('');
+    if (value.toLowerCase() === 'exit' || value.toLowerCase() === 'quit') {
+      if (onExit) onExit();
+      return;
+    }
+    try {
+      onSubmit(value, (response) => {
+        if (mountedRef.current) {
+          setHistory(prev => [...prev, { role: 'flowmind', text: response }]);
+        }
+      });
+    } catch (e) {
+      if (mountedRef.current) {
+        setHistory(prev => [...prev, { role: 'flowmind', text: 'Error: ' + e.message }]);
+      }
+    }
+  };
+
+  const displayHistory = history.slice(-20);
+
+  return (
+    React.createElement(Box, { flexDirection: 'column', borderStyle: 'single', borderColor: 'green', paddingX: 1 },
+      React.createElement(Text, { bold: true, color: 'green' }, 'Command Input'),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1, minHeight: 6 },
+        displayHistory.length === 0 && React.createElement(Text, { color: 'gray' }, 'Type a command to get started. Type "exit" to quit.'),
+        displayHistory.map((msg, i) =>
+          React.createElement(Box, { key: i, flexDirection: 'column' },
+            msg.role === 'user'
+              ? React.createElement(Text, null,
+                  React.createElement(Text, { color: 'green', bold: true }, '> '),
+                  React.createElement(Text, { color: 'white' }, msg.text)
+                )
+              : React.createElement(Text, null,
+                  React.createElement(Text, { color: 'cyan', bold: true }, '< '),
+                  React.createElement(Text, { color: 'cyan' }, msg.text)
+                )
+          )
+        )
+      ),
+      React.createElement(Box, { marginTop: 1 },
+        isProcessing
+          ? React.createElement(Text, { color: 'yellow' },
+              React.createElement(Spinner, { type: 'dots' }),
+              ' Processing...'
+            )
+          : React.createElement(Box, null,
+              React.createElement(Text, { color: 'green', bold: true }, '> '),
+              React.createElement(TextInput, { value: input, onChange: setInput, onSubmit: handleSubmit })
+            )
+      )
+    )
+  );
+}
+
+module.exports = ChatPanel;

package/tui/components/DragonTotem.jsx

@@ -0,0 +1,108 @@
+const React = require('react');
+const { Box, Text } = require('ink');
+
+const DRAGON_ARTS = {
+  0: [
+    '        ╭─────╮        ',
+    '       ╱  ╭─╮  ╲       ',
+    '      │  │   │  │      ',
+    '      │  │ ◎ │  │      ',
+    '      │   ╰─╯   │      ',
+    '       ╲       ╱       ',
+    '        ╰─────╯        ',
+  ],
+  1: [
+    '           ╭──╮            ',
+    '      ╭────╯  ╰───╮        ',
+    '     ╱  ◎    ╰─╯   ╲      ',
+    '    ╱    ▽           ╲     ',
+    '    ╲    ╱╲   ╱╲     ╱     ',
+    '     ╲╱╱  ╲╱╱  ╲╱╲╱       ',
+  ],
+  2: [
+    '        ╭─╮  ╭─╮             ',
+    '   ╭────╯ ╰──╯ ╰───╮         ',
+    '  ╱  ◎      ╰──╯     ╲       ',
+    ' ╱      ╭────────╮     ╲     ',
+    ' ╲     ╱ ╱╱╱╱╱╱╱╱ ╲    ╱     ',
+    '  ╲───╯ ╱╱╱╱╱╱╱╱╱╱ ╰──╱      ',
+    '   ╰─╯            ╰─╯       ',
+  ],
+  3: [
+    '      ╭───╮  ╭───╮               ',
+    '  ╭───╯   ╰──╯   ╰───╮           ',
+    ' ╱  ◎        ╰───╯     ╲         ',
+    '│     ╭──────────╮      │        ',
+    '│    ╱ ╱╱╱╱╱╱╱╱╱╱ ╲     │        ',
+    ' ╲──╯ ╱╱╱╱╱╱╱╱╱╱╱╱ ╰───╯        ',
+    '  ╲  ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱  ╱         ',
+    '   ╲╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱          ',
+    '    ╰───╯       ╰───╯            ',
+  ],
+  4: [
+    '    ╭───╮      ╭───╮                 ',
+    '╭───╯   ╰──────╯   ╰───╮             ',
+    '│  ◎           ╰───╯     │           ',
+    '│      ╭────────────╮    │           ',
+    '│     ╱ ╱╱╱╱╱╱╱╱╱╱╱╱ ╲   │           ',
+    ' ╲───╯ ╱╱╱╱╱╱╱╱╱╱╱╱╱╱ ╰──╯          ',
+    '  ╲   ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱  ╲          ',
+    '   ╲─╯╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╰─╲         ',
+    '    ╲╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱         ',
+    '     ╰───╯         ╰───╯             ',
+  ],
+  5: [
+    '  ★  ╭───╮          ╭───╮  ★           ',
+    '╭─╯   ╰──╯          ╰──╯   ╰─╮         ',
+    '│  ◎            ╰───╯         │         ',
+    '│       ╭──────────────╮      │         ',
+    '│      ╱ ★╱╱╱╱╱╱╱╱╱╱★╱╱ ╲     │         ',
+    ' ╲────╯ ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱ ╰───╯         ',
+    '  ╲    ╱╱╱╱★╱╱╱╱╱╱╱╱★╱╱╱╱╱  ╲          ',
+    '   ╲──╯╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╰──╲         ',
+    '    ╲─╯╱╱╱★╱╱╱╱╱╱╱╱★╱╱╱╱╱╰──╲         ',
+    '  ★  ╲╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱  ★       ',
+    '       ╰───╯           ╰───╯            ',
+  ],
+};
+
+const LEVEL_NAMES = ['Egg', 'Hatchling', 'Juvenile', 'Adult', 'Elder', 'Ascended'];
+const LEVEL_STATES = ['dormant', 'awakening', 'growing', 'soaring', 'wise', 'transcendent'];
+const LEVEL_COLORS = ['gray', 'cyan', 'cyan', 'cyanBright', 'cyanBright', 'cyanBright'];
+
+function DragonTotem({ honorData, compact }) {
+  const points = honorData?.points || 0;
+  const level = honorData?.level || 0;
+  const art = DRAGON_ARTS[level] || DRAGON_ARTS[0];
+  const color = LEVEL_COLORS[level] || 'gray';
+  const levelName = LEVEL_NAMES[level] || 'Unknown';
+  const state = LEVEL_STATES[level] || 'unknown';
+  const nextLevelPoints = [1, 10, 30, 60, 100];
+  const nextPoints = nextLevelPoints[level] || null;
+  const pointsToNext = nextPoints !== null ? nextPoints - points : 0;
+  const lines = compact ? art.slice(0, 4) : art;
+
+  return (
+    React.createElement(Box, { flexDirection: 'column', paddingX: 1 },
+      React.createElement(Text, { bold: true, color: 'cyan' }, 'Dragon Totem'),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+        lines.map((line, i) => React.createElement(Text, { key: i, color: color }, line))
+      ),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+        React.createElement(Text, null,
+          React.createElement(Text, { color: 'yellow' }, 'Lv' + level),
+          React.createElement(Text, { color: 'white' }, ' ' + levelName),
+          React.createElement(Text, { color: 'gray' }, ' (' + state + ')')
+        ),
+        React.createElement(Text, null,
+          React.createElement(Text, { color: 'yellow' }, '' + points),
+          React.createElement(Text, { color: 'gray' }, ' pts')
+        ),
+        pointsToNext > 0 && React.createElement(Text, { color: 'gray' }, pointsToNext + ' pts to ' + LEVEL_NAMES[level + 1]),
+        pointsToNext <= 0 && level >= 5 && React.createElement(Text, { color: 'yellow' }, 'Max level!')
+      )
+    )
+  );
+}
+
+module.exports = DragonTotem;

package/tui/components/ResultPanel.jsx

@@ -0,0 +1,33 @@
+const React = require('react');
+const { Box, Text } = require('ink');
+
+function ResultPanel({ results }) {
+  const displayResults = results.slice(-30);
+
+  return (
+    React.createElement(Box, { flexDirection: 'column', borderStyle: 'single', borderColor: 'yellow', paddingX: 1, flexGrow: 1 },
+      React.createElement(Text, { bold: true, color: 'yellow' }, 'Results'),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1, overflow: 'hidden' },
+        displayResults.length === 0 && React.createElement(Text, { color: 'gray' }, 'No results yet. Execute a command to see output here.'),
+        displayResults.map((result, i) =>
+          React.createElement(Box, { key: i, flexDirection: 'column', marginBottom: 1 },
+            result.type === 'result' && React.createElement(React.Fragment, null,
+              result.metadata?.skill && React.createElement(Text, null,
+                React.createElement(Text, { color: 'gray' }, 'Skill: '),
+                React.createElement(Text, { color: 'green' }, result.metadata.skill),
+                result.metadata?.duration && React.createElement(Text, { color: 'gray' }, ' (' + result.metadata.duration + 'ms)')
+              ),
+              React.createElement(Text, { color: 'white' },
+                typeof result.data === 'string' ? result.data : JSON.stringify(result.data, null, 2)
+              )
+            ),
+            result.type === 'learning' && React.createElement(Text, { color: 'cyan' }, result.message),
+            result.type === 'error' && React.createElement(Text, { color: 'red' }, 'Error: ' + result.message)
+          )
+        )
+      )
+    )
+  );
+}
+
+module.exports = ResultPanel;

package/tui/components/Sidebar.jsx

@@ -0,0 +1,70 @@
+const React = require('react');
+const { Box, Text, useInput } = require('ink');
+const DragonTotem = require('./DragonTotem.jsx');
+
+function Sidebar({ flowmind, width, onSkillSelect }) {
+  const [selectedIndex, setSelectedIndex] = React.useState(0);
+  const [skills, setSkills] = React.useState([]);
+  const [honorData, setHonorData] = React.useState({ points: 0, level: 0, stats: {} });
+
+  React.useEffect(() => {
+    if (flowmind) {
+      try {
+        const list = flowmind.skills.list() || [];
+        setSkills(list);
+      } catch (e) {
+        setSkills([]);
+      }
+      try {
+        setHonorData(flowmind.getHonorData());
+      } catch (e) {
+        // keep default honorData
+      }
+    }
+  }, [flowmind]);
+
+  useInput((input, key) => {
+    if (key.upArrow) setSelectedIndex(prev => Math.max(0, prev - 1));
+    else if (key.downArrow) setSelectedIndex(prev => Math.min(skills.length - 1, prev + 1));
+    else if (key.return && skills[selectedIndex] && onSkillSelect) onSkillSelect(skills[selectedIndex]);
+  });
+
+  const barWidth = Math.max(10, width - 4);
+  const progress = honorData.points > 0 ? Math.min(1, honorData.points / 100) : 0;
+  const filled = Math.round(progress * barWidth);
+  const progressBar = '\u2588'.repeat(filled) + '\u2591'.repeat(barWidth - filled);
+
+  return (
+    React.createElement(Box, { flexDirection: 'column', width: width, borderStyle: 'single', borderColor: 'cyan', paddingX: 1 },
+      React.createElement(DragonTotem, { honorData: honorData, compact: true }),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+        React.createElement(Text, { bold: true, color: 'cyan' }, 'Progress'),
+        React.createElement(Text, { color: 'green' }, progressBar),
+        React.createElement(Text, { color: 'gray' }, honorData.points + '/100 pts')
+      ),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+        React.createElement(Text, { bold: true, color: 'cyan' }, 'Skills (' + skills.length + ')'),
+        React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+          skills.length === 0 && React.createElement(Text, { color: 'gray' }, 'No skills loaded'),
+          skills.map((skill, i) => {
+            const isSelected = i === selectedIndex;
+            const category = skill.category || 'general';
+            const prefix = isSelected ? '\u25B6 ' : '  ';
+            return React.createElement(Text, { key: skill.name },
+              React.createElement(Text, { color: isSelected ? 'green' : 'white' }, prefix + skill.name),
+              React.createElement(Text, { color: 'gray' }, ' [' + category + ']')
+            );
+          })
+        )
+      ),
+      React.createElement(Box, { flexDirection: 'column', marginTop: 1 },
+        React.createElement(Text, { bold: true, color: 'cyan' }, 'Stats'),
+        React.createElement(Text, { color: 'gray' }, 'Skills used: ' + (honorData.stats?.skillUseCount || 0)),
+        React.createElement(Text, { color: 'gray' }, 'Learnings: ' + (honorData.stats?.learningCount || 0)),
+        React.createElement(Text, { color: 'gray' }, 'New skills: ' + (honorData.stats?.newSkillCount || 0))
+      )
+    )
+  );
+}
+
+module.exports = Sidebar;

package/tui/components/StatusBar.jsx

@@ -0,0 +1,49 @@
+const React = require('react');
+const { Box, Text } = require('ink');
+
+const LEVEL_NAMES = ['Egg', 'Hatchling', 'Juvenile', 'Adult', 'Elder', 'Ascended'];
+
+function StatusBar({ flowmind }) {
+  const [aiStatus, setAiStatus] = React.useState(null);
+  const [componentStatus, setComponentStatus] = React.useState(null);
+  const [honorData, setHonorData] = React.useState(null);
+
+  React.useEffect(() => {
+    if (flowmind) {
+      try {
+        setAiStatus(flowmind.getAIStatus());
+        setComponentStatus(flowmind.getComponentStatus());
+        setHonorData(flowmind.getHonorData());
+      } catch (e) { /* Non-blocking */ }
+    }
+  }, [flowmind]);
+
+  const aiName = aiStatus?.defaultProvider || 'none';
+  const aiOk = aiStatus?.initialized || false;
+  const componentCount = componentStatus ? Object.keys(componentStatus).length : 0;
+  const activeCount = componentStatus ? Object.values(componentStatus).filter(c => c.active).length : 0;
+  const level = honorData?.level || 0;
+  const points = honorData?.points || 0;
+
+  return (
+    React.createElement(Box, { borderStyle: 'single', borderColor: 'gray', paddingX: 1, justifyContent: 'space-between' },
+      React.createElement(Text, null,
+        React.createElement(Text, { color: 'gray' }, 'AI: '),
+        React.createElement(Text, { color: aiOk ? 'green' : 'red' }, aiName),
+        React.createElement(Text, { color: aiOk ? 'green' : 'red' }, aiOk ? ' \u25CF' : ' \u25CB')
+      ),
+      React.createElement(Text, null,
+        React.createElement(Text, { color: 'gray' }, 'Components: '),
+        React.createElement(Text, { color: 'white' }, activeCount + '/' + componentCount),
+        React.createElement(Text, { color: 'green' }, ' active')
+      ),
+      React.createElement(Text, null,
+        React.createElement(Text, { color: 'gray' }, 'Honor: '),
+        React.createElement(Text, { color: 'yellow' }, LEVEL_NAMES[level]),
+        React.createElement(Text, { color: 'gray' }, ' (' + points + ' pts)')
+      )
+    )
+  );
+}
+
+module.exports = StatusBar;