project-compass 3.4.3 → 3.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-compass",
-  "version": "3.4.3",
+  "version": "3.5.0",
   "description": "Futuristic project navigator and runner for Node, Python, Rust, and Go",
   "main": "src/cli.js",
   "bin": {

package/src/cli.js

@@ -399,7 +399,6 @@ function Compass({rootPath, initialView = 'navigator'}) {
     }
 
     if (mainView === 'registry' || mainView === 'architect') {
-      // Inputs handled inside components
       return;
     }
 
@@ -438,11 +437,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
       setViewMode((prev) => (prev === 'detail' ? 'list' : 'detail'));
       return;
     }
-    if (shiftCombo('q')) {
-      if (hasRunningTasks) setQuitConfirm(true); else exit();
-      return;
-    }
-    if (isCtrlC) {
+    if (shiftCombo('q') || isCtrlC) {
       if (hasRunningTasks) setQuitConfirm(true); else exit();
       return;
     }
@@ -455,10 +450,12 @@ function Compass({rootPath, initialView = 'navigator'}) {
       return;
     }
     if (viewMode === 'detail' && normalizedInput && detailShortcutMap.has(normalizedInput)) {
-      if (key.shift) {
+      if (!isNaN(parseInt(normalizedInput))) {
         runProjectCommand(detailShortcutMap.get(normalizedInput), selectedProject);
         return;
-      } else if (!isNaN(parseInt(normalizedInput))) {
+      }
+      const reserved = ['a', 'p', 'n', 'x', 'e', 'd', 'b', 't', 'q', 'h', 's', 'l', 'c'];
+      if (key.shift && !reserved.includes(normalizedInput)) {
         runProjectCommand(detailShortcutMap.get(normalizedInput), selectedProject);
         return;
       }
@@ -540,6 +537,12 @@ function Compass({rootPath, initialView = 'navigator'}) {
     create(Text, {dimColor: true}, tile.subtext)
   )), [projectCountLabel, rootPath, selectedProject, tasks.length, running]);
 
+  const helpCards = useMemo(() => [
+    {label: 'Navigation', color: 'magenta', body: ['↑ / ↓ move focus, Enter: details', 'Shift+↑ / ↓ scroll output', 'Shift+H toggle help cards', 'Shift+D detach from task']},
+    {label: 'Management', color: 'cyan', body: ['Shift+P Package Registry', 'Shift+N Project Architect', 'Shift+X clear / Shift+E export']},
+    {label: 'Orbit & Studio', color: 'yellow', body: ['Shift+T task manager', 'Shift+A studio / Shift+B art board', 'Shift+S structure / Shift+Q quit']}
+  ], []);
+
   if (quitConfirm) {
     return create(Box, {flexDirection: 'column', borderStyle: 'round', borderColor: 'red', padding: 1}, create(Text, {bold: true, color: 'red'}, '⚠️ Confirm Exit'), create(Text, null, `There are ${tasks.filter(t=>t.status==='running').length} tasks still running in the background.`), create(Text, null, 'Are you sure you want to quit and stop all processes?'), create(Text, {marginTop: 1}, kleur.bold('Y') + ' to Quit, ' + kleur.bold('N') + ' to Cancel'));
   }
@@ -547,7 +550,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
   if (mainView === 'studio') return create(Studio);
   if (mainView === 'tasks') return create(TaskManager, {tasks, activeTaskId, setActiveTaskId, renameMode, renameInput, renameCursor, CursorText});
   if (mainView === 'registry') return create(PackageRegistry, {selectedProject, onRunCommand: runProjectCommand, CursorText});
-  if (mainView === 'architect') return create(ProjectArchitect, {onRunCommand: runProjectCommand, CursorText});
+  if (mainView === 'architect') return create(ProjectArchitect, {rootPath, onRunCommand: runProjectCommand, CursorText, onReturn: () => setMainView('navigator')});
 
   return create(Box, {flexDirection: 'column', padding: 1},
     create(Box, {justifyContent: 'space-between'},
@@ -570,13 +573,9 @@ function Compass({rootPath, initialView = 'navigator'}) {
       create(Box, {flexDirection: 'row', justifyContent: 'space-between'}, create(Text, {bold: true, color: 'yellow'}, `Output: ${activeTask?.name || 'None'}`), create(Text, {dimColor: true}, logOffset ? `Scrolled ${logOffset} lines` : 'Live log view')),
       create(OutputPanel, {activeTask, logOffset}),
       create(Box, {marginTop: 1, flexDirection: 'row', justifyContent: 'space-between'}, create(Text, {dimColor: true}, running ? 'Type to feed stdin; Enter: submit.' : 'Run a command or press Shift+T to switch tasks.'), create(Text, {dimColor: true}, `${toggleHint}, Shift+S: Structure Guide`)),
-      create(Box, {marginTop: 1, flexDirection: 'row', borderStyle: 'round', borderColor: running ? 'green' : 'gray', paddingX: 1}, create(Text, {bold: true, color: 'green'}, running ? ' Stdin buffer ' : ' Input ready '), create(Box, {marginLeft: 1}, create(CursorText, {value: stdinBuffer || (running ? '' : 'Start a command to feed stdin'), cursorIndex: stdinCursor, active: running})))
+      create(Box, {marginTop: 1, flexDirection: 'row', borderStyle: 'round', borderColor: running ? 'green' : 'gray', paddingX: 1}, create(Text, {bold: true, color: running ? 'green' : 'white'}, running ? ' Stdin buffer ' : ' Input ready '), create(Box, {marginLeft: 1}, create(CursorText, {value: stdinBuffer || (running ? '' : 'Start a command to feed stdin'), cursorIndex: stdinCursor, active: running})))
     ),
-    config.showHelpCards && create(Box, {marginTop: 1, flexDirection: 'row', justifyContent: 'space-between', flexWrap: 'wrap'}, [
-      {label: 'Navigation', color: 'magenta', body: ['↑ / ↓ move focus, Enter: details', 'Shift+↑ / ↓ scroll output', 'Shift+H toggle help cards', 'Shift+D detach from task']},
-      {label: 'Management', color: 'cyan', body: ['Shift+P Package Registry', 'Shift+N Project Architect', 'Shift+X clear / Shift+E export']},
-      {label: 'Orbit & Studio', color: 'yellow', body: ['Shift+T task manager', 'Shift+A studio / Shift+B art board', 'Shift+S structure / Shift+Q quit']}
-    ].map((card, idx) => create(Box, {key: card.label, flexGrow: 1, flexBasis: 0, minWidth: HELP_CARD_MIN_WIDTH, marginRight: idx < 2 ? 1 : 0, marginBottom: 1, borderStyle: 'round', borderColor: card.color, padding: 1, flexDirection: 'column'}, create(Text, {color: card.color, bold: true, marginBottom: 1}, card.label), ...card.body.map((line, lidx) => create(Text, {key: lidx, dimColor: card.color === 'yellow'}, line))))),
+    config.showHelpCards && create(Box, {marginTop: 1, flexDirection: 'row', justifyContent: 'space-between', flexWrap: 'wrap'}, helpCards.map((card, idx) => create(Box, {key: card.label, flexGrow: 1, flexBasis: 0, minWidth: HELP_CARD_MIN_WIDTH, marginRight: idx < 2 ? 1 : 0, marginBottom: 1, borderStyle: 'round', borderColor: card.color, padding: 1, flexDirection: 'column'}, create(Text, {color: card.color, bold: true, marginBottom: 1}, card.label), ...card.body.map((line, lidx) => create(Text, {key: lidx, dimColor: card.color === 'yellow'}, line))))),
     config.showStructureGuide && create(Box, {flexDirection: 'column', borderStyle: 'round', borderColor: 'blue', marginTop: 1, padding: 1}, create(Text, {color: 'cyan', bold: true}, 'Structure guide · press Shift+S to hide'), ...SCHEMA_GUIDE.map(e => create(Text, {key: e.type, dimColor: true}, `• ${e.icon} ${e.label}: ${e.files.join(', ')}`))),
     showHelp && create(Box, {flexDirection: 'column', borderStyle: 'double', borderColor: 'cyan', marginTop: 1, padding: 1}, create(Text, {color: 'cyan', bold: true}, 'Help overlay'), create(Text, null, 'Shift+↑/↓ scrolls logs; Shift+X clears; Shift+E exports; Shift+A Studio; Shift+T Tasks; Shift+D Detach; Shift+B Toggle Art Board; Shift+P Packages; Shift+N Creator.'))
   );

package/src/components/ProjectArchitect.js

@@ -1,52 +1,69 @@
 import React, {useState, memo} from 'react';
 import {Box, Text, useInput} from 'ink';
+import path from 'path';
 
 const create = React.createElement;
 
-const ProjectArchitect = memo(({onRunCommand, CursorText}) => {
-  const [step, setStep] = useState('framework'); // framework | name
+const ProjectArchitect = memo(({rootPath, onRunCommand, CursorText, onReturn}) => {
+  const [step, setStep] = useState('framework'); // framework | path | name
   const [selectedIdx, setSelectedIdx] = useState(0);
+  const [targetPath, setTargetPath] = useState(rootPath);
   const [name, setName] = useState('');
   const [cursor, setCursor] = useState(0);
 
   const frameworks = [
-    {name: 'Next.js', cmd: (n) => ['npx', 'create-next-app@latest', n]},
-    {name: 'React (Vite)', cmd: (n) => ['npm', 'create', 'vite@latest', n, '--', '--template', 'react']},
-    {name: 'Vue (Vite)', cmd: (n) => ['npm', 'create', 'vite@latest', n, '--', '--template', 'vue']},
-    {name: 'Rust (Binary)', cmd: (n) => ['cargo', 'new', n]},
-    {name: 'Python (Basic)', cmd: (n) => ['mkdir', n]},
-    {name: 'Go Module', cmd: (n) => ['mkdir', n, '&&', 'cd', n, '&&', 'go', 'mod', 'init', n]}
+    {name: 'Next.js', cmd: (p, n) => ['npx', 'create-next-app@latest', path.join(p, n)]},
+    {name: 'React (Vite)', cmd: (p, n) => ['npm', 'create', 'vite@latest', path.join(p, n), '--', '--template', 'react']},
+    {name: 'Vue (Vite)', cmd: (p, n) => ['npm', 'create', 'vite@latest', path.join(p, n), '--', '--template', 'vue']},
+    {name: 'Rust (Binary)', cmd: (p, n) => ['cargo', 'new', path.join(p, n)]},
+    {name: 'Python (Basic)', cmd: (p, n) => ['mkdir', '-p', path.join(p, n)]},
+    {name: 'Go Module', cmd: (p, n) => ['mkdir', '-p', path.join(p, n), '&&', 'cd', path.join(p, n), '&&', 'go', 'mod', 'init', n]}
   ];
 
   useInput((inputStr, key) => {
     if (step === 'framework') {
       if (key.upArrow) setSelectedIdx(prev => (prev - 1 + frameworks.length) % frameworks.length);
       if (key.downArrow) setSelectedIdx(prev => (prev + 1) % frameworks.length);
-      if (key.return) setStep('name');
+      if (key.return) setStep('path');
       return;
     }
 
-    if (step === 'name') {
+    if (step === 'path' || step === 'name') {
       if (key.return) {
-        if (name.trim()) {
+        if (step === 'path') {
+          setStep('name');
+          setCursor(0);
+        } else if (name.trim()) {
           const f = frameworks[selectedIdx];
-          onRunCommand({label: `Create ${f.name} project: ${name}`, command: f.cmd(name.trim())});
+          onRunCommand({
+            label: `Scaffold ${f.name}: ${name}`,
+            command: f.cmd(targetPath, name.trim())
+          });
+          onReturn();
         }
-        setStep('framework'); setName(''); setCursor(0);
         return;
       }
-      if (key.escape) { setStep('framework'); setName(''); setCursor(0); return; }
+      if (key.escape) {
+        if (step === 'name') setStep('path');
+        else setStep('framework');
+        setCursor(0);
+        return;
+      }
+      
+      const val = step === 'path' ? targetPath : name;
+      const setVal = step === 'path' ? setTargetPath : setName;
+
       if (key.backspace || key.delete) {
         if (cursor > 0) {
-          setName(prev => prev.slice(0, cursor - 1) + prev.slice(cursor));
+          setVal(prev => prev.slice(0, cursor - 1) + prev.slice(cursor));
           setCursor(c => Math.max(0, c - 1));
         }
         return;
       }
       if (key.leftArrow) { setCursor(c => Math.max(0, c - 1)); return; }
-      if (key.rightArrow) { setCursor(c => Math.min(name.length, c + 1)); return; }
+      if (key.rightArrow) { setCursor(c => Math.min(val.length, c + 1)); return; }
       if (inputStr) {
-        setName(prev => prev.slice(0, cursor) + inputStr + prev.slice(cursor));
+        setVal(prev => prev.slice(0, cursor) + inputStr + prev.slice(cursor));
         setCursor(c => c + inputStr.length);
       }
     }
@@ -54,29 +71,39 @@ const ProjectArchitect = memo(({onRunCommand, CursorText}) => {
 
   return create(
     Box,
-    {flexDirection: 'column', borderStyle: 'round', borderColor: 'cyan', padding: 1},
-    create(Text, {bold: true, color: 'cyan'}, '🏗️ Project Architect | Generator'),
-    create(Text, {dimColor: true, marginBottom: 1}, 'Create new projects from industry-standard templates.'),
-    step === 'framework'
-      ? create(
-          Box,
-          {flexDirection: 'column'},
-          create(Text, {bold: true}, 'Select Framework:'),
-          ...frameworks.map((f, i) => create(Text, {key: f.name, color: i === selectedIdx ? 'cyan' : 'white'}, `${i === selectedIdx ? '→' : ' '} ${f.name}`)),
-          create(Text, {dimColor: true, marginTop: 1}, 'Enter: Pick Framework, Shift+N: Return to Navigator.')
-        )
-      : create(
-          Box,
-          {flexDirection: 'column'},
-          create(Text, {bold: true, color: 'cyan'}, 'PROJECT NAME'),
-          create(
-            Box,
-            {flexDirection: 'row'},
-            create(Text, null, 'Enter name: '),
-            create(CursorText, {value: name, cursorIndex: cursor})
-          ),
-          create(Text, {dimColor: true, marginTop: 1}, 'Enter: Create Project, Esc: Back to Frameworks')
-        )
+    {flexDirection: 'column', borderStyle: 'round', borderColor: 'cyan', padding: 1, width: '100%'},
+    create(Text, {bold: true, color: 'cyan'}, '🏗️ Project Architect | Scaffold New Workspace'),
+    create(Text, {dimColor: true, marginBottom: 1}, 'Generator will run in the background via Orbit.'),
+
+    step === 'framework' && create(
+      Box,
+      {flexDirection: 'column'},
+      create(Text, {bold: true, marginBottom: 1}, 'Step 1: Select Template'),
+      ...frameworks.map((f, i) => create(Text, {key: f.name, color: i === selectedIdx ? 'cyan' : 'white'}, `${i === selectedIdx ? '→' : ' '} ${f.name}`)),
+      create(Text, {dimColor: true, marginTop: 1}, 'Enter: Confirm Template, Shift+N: Exit')
+    ),
+
+    step === 'path' && create(
+      Box,
+      {flexDirection: 'column'},
+      create(Text, {bold: true, color: 'yellow', marginBottom: 1}, `Step 2: Target Directory [${frameworks[selectedIdx].name}]`),
+      create(Box, {flexDirection: 'row'},
+        create(Text, null, 'Root Path: '),
+        create(CursorText, {value: targetPath, cursorIndex: cursor})
+      ),
+      create(Text, {dimColor: true, marginTop: 1}, 'Enter: Confirm Path, Esc: Back')
+    ),
+
+    step === 'name' && create(
+      Box,
+      {flexDirection: 'column'},
+      create(Text, {bold: true, color: 'green', marginBottom: 1}, `Step 3: Project Name`),
+      create(Box, {flexDirection: 'row'},
+        create(Text, null, 'Name: '),
+        create(CursorText, {value: name, cursorIndex: cursor})
+      ),
+      create(Text, {dimColor: true, marginTop: 1}, 'Enter: Create Project, Esc: Back')
+    )
   );
 });
 

package/src/components/Studio.js

@@ -42,7 +42,7 @@ const Studio = memo(() => {
 
   return create(
     Box,
-    {flexDirection: 'column', borderStyle: 'double', borderColor: 'blue', padding: 1},
+    {flexDirection: 'column', borderStyle: 'double', borderColor: 'blue', padding: 1, width: '100%'},
     create(Text, {bold: true, color: 'blue'}, '💎 Omni-Studio | Environment Intelligence'),
     create(Text, {dimColor: true, marginBottom: 1}, 'Overview of installed languages and build tools.'),
     loading
@@ -56,8 +56,7 @@ const Studio = memo(() => {
             create(Text, {width: 20, color: r.status === 'ok' ? 'green' : 'red'}, `${r.status === 'ok' ? '✓' : '✗'} ${r.name}`),
             create(Text, {dimColor: r.status !== 'ok'}, `:  ${r.version}`)
           )),
-          create(Text, {marginTop: 1, color: 'yellow'}, '🛠️ Interactive Project Creator coming soon in v3.0'),
-          create(Text, {dimColor: true}, 'Press Shift+A to return to Navigator.')
+          create(Text, {marginTop: 1, dimColor: true}, 'Press Shift+A to return to Navigator.')
         )
   );
 });