ai-kanban-terminal 0.2.0

package/dist/assets/index-DCBCU9ry.css

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2014 The xterm.js authors. All rights reserved.
+ * Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
+ * https://github.com/chjj/term.js
+ * @license MIT
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ *
+ * Originally forked from (with the author's permission):
+ *   Fabrice Bellard's javascript vt100 for jslinux:
+ *   http://bellard.org/jslinux/
+ *   Copyright (c) 2011 Fabrice Bellard
+ *   The original design remains. The terminal itself
+ *   has been extended to include xterm CSI codes, among
+ *   other features.
+ */.xterm{cursor:text;position:relative;user-select:none;-ms-user-select:none;-webkit-user-select:none}.xterm.focus,.xterm:focus{outline:none}.xterm .xterm-helpers{position:absolute;top:0;z-index:5}.xterm .xterm-helper-textarea{padding:0;border:0;margin:0;position:absolute;opacity:0;left:-9999em;top:0;width:0;height:0;z-index:-5;white-space:nowrap;overflow:hidden;resize:none}.xterm .composition-view{background:#000;color:#fff;display:none;position:absolute;white-space:nowrap;z-index:1}.xterm .composition-view.active{display:block}.xterm .xterm-viewport{background-color:#000;overflow-y:scroll;cursor:default;position:absolute;right:0;left:0;top:0;bottom:0}.xterm .xterm-screen{position:relative}.xterm .xterm-screen canvas{position:absolute;left:0;top:0}.xterm-char-measure-element{display:inline-block;visibility:hidden;position:absolute;top:0;left:-9999em;line-height:normal}.xterm.enable-mouse-events{cursor:default}.xterm.xterm-cursor-pointer,.xterm .xterm-cursor-pointer{cursor:pointer}.xterm.column-select.focus{cursor:crosshair}.xterm .xterm-accessibility:not(.debug),.xterm .xterm-message{position:absolute;left:0;top:0;bottom:0;right:0;z-index:10;color:transparent;pointer-events:none}.xterm .xterm-accessibility-tree:not(.debug) *::selection{color:transparent}.xterm .xterm-accessibility-tree{font-family:monospace;-webkit-user-select:text;user-select:text;white-space:pre}.xterm .xterm-accessibility-tree>div{transform-origin:left;width:fit-content}.xterm .live-region{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.xterm-dim{opacity:1!important}.xterm-underline-1{text-decoration:underline}.xterm-underline-2{text-decoration:double underline}.xterm-underline-3{text-decoration:wavy underline}.xterm-underline-4{text-decoration:dotted underline}.xterm-underline-5{text-decoration:dashed underline}.xterm-overline{text-decoration:overline}.xterm-overline.xterm-underline-1{text-decoration:overline underline}.xterm-overline.xterm-underline-2{text-decoration:overline double underline}.xterm-overline.xterm-underline-3{text-decoration:overline wavy underline}.xterm-overline.xterm-underline-4{text-decoration:overline dotted underline}.xterm-overline.xterm-underline-5{text-decoration:overline dashed underline}.xterm-strikethrough{text-decoration:line-through}.xterm-screen .xterm-decoration-container .xterm-decoration{z-index:6;position:absolute}.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer{z-index:7}.xterm-decoration-overview-ruler{z-index:8;position:absolute;top:0;right:0;pointer-events:none}.xterm-decoration-top{z-index:2;position:relative}.xterm .xterm-scrollable-element>.scrollbar{cursor:default}.xterm .xterm-scrollable-element>.scrollbar>.scra{cursor:pointer;font-size:11px!important}.xterm .xterm-scrollable-element>.visible{opacity:1;background:#0000;transition:opacity .1s linear;z-index:11}.xterm .xterm-scrollable-element>.invisible{opacity:0;pointer-events:none}.xterm .xterm-scrollable-element>.invisible.fade{transition:opacity .8s linear}.xterm .xterm-scrollable-element>.shadow{position:absolute;display:none}.xterm .xterm-scrollable-element>.shadow.top{display:block;top:0;left:3px;height:3px;width:100%;box-shadow:var(--vscode-scrollbar-shadow, #000) 0 6px 6px -6px inset}.xterm .xterm-scrollable-element>.shadow.left{display:block;top:3px;left:0;height:100%;width:3px;box-shadow:var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset}.xterm .xterm-scrollable-element>.shadow.top-left-corner{display:block;top:0;left:0;height:3px;width:3px}.xterm .xterm-scrollable-element>.shadow.top.left{box-shadow:var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}main{height:100vh;display:flex;flex-direction:column}.terminal-container{display:flex;flex-direction:column;height:100%;background:#1e1e1e;color:#d4d4d4}.terminal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:#252526;border-bottom:1px solid #3e3e42}.terminal-header h1{font-size:1.25rem;font-weight:600;color:#ccc;margin:0}.connection-status{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:#ccc}.status-indicator{width:10px;height:10px;border-radius:50%;transition:background-color .3s ease}.status-indicator.connected{background-color:#0dbc79;box-shadow:0 0 8px #0dbc7980}.status-indicator.disconnected{background-color:#cd3131;box-shadow:0 0 8px #cd313180}.terminal{flex:1;padding:1rem;overflow:hidden;outline:none}.terminal:focus{box-shadow:inset 0 0 0 2px #0078d4}.terminal .xterm{height:100%;width:100%}@media(prefers-contrast:high){.terminal-container{border:2px solid #ffffff}.terminal-header{border-bottom:2px solid #ffffff}.status-indicator.connected,.status-indicator.disconnected{border:2px solid #ffffff}}@media(prefers-reduced-motion:reduce){.status-indicator{transition:none}}@media(max-width:768px){.terminal-header{padding:.75rem 1rem}.terminal-header h1{font-size:1rem}.connection-status{font-size:.75rem}.terminal{padding:.5rem}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}

package/dist/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="Browser-based terminal with bidirectional shell" />
+    <title>AI Kanban Terminal</title>
+    <script type="module" crossorigin src="/assets/index-CMu989wp.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-DCBCU9ry.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "ai-kanban-terminal",
+  "version": "0.2.0",
+  "description": "Browser-based terminal with bidirectional shell using Vite, Express, node-pty, xterm.js, and Socket.IO",
+  "main": "server.js",
+  "type": "commonjs",
+  "bin": {
+    "ai-kanban-terminal": "./server.js"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "start": "NODE_ENV=production node server.js",
+    "postinstall": "npm run build",
+    "prepublishOnly": "npm run build",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "files": [
+    "dist",
+    "server.js",
+    "package.json",
+    "README.md"
+  ],
+  "keywords": [
+    "terminal",
+    "xterm",
+    "node-pty",
+    "socket.io",
+    "vite",
+    "express",
+    "shell",
+    "browser-terminal"
+  ],
+  "author": "kght6123",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/kght6123/ai-kanban-terminal"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "express": "^4.22.1",
+    "node-pty": "^1.1.0",
+    "socket.io": "^4.8.3",
+    "socket.io-client": "^4.8.3"
+  },
+  "devDependencies": {
+    "@types/node": "^25.0.9",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "@xterm/addon-fit": "^0.11.0",
+    "@xterm/xterm": "^6.0.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "typescript": "^5.9.3",
+    "vite": "^6.0.7"
+  }
+}

package/server.js

@@ -0,0 +1,118 @@
+#!/usr/bin/env node
+
+const express = require('express');
+const path = require('path');
+const { createServer } = require('http');
+const { Server } = require('socket.io');
+const pty = require('node-pty');
+const os = require('os');
+
+const hostname = 'localhost';
+const port = parseInt(process.env.PORT || '3000', 10);
+
+const expressApp = express();
+const httpServer = createServer(expressApp);
+const io = new Server(httpServer, {
+  cors: {
+    // NOTE: Wildcard origin is used for development convenience.
+    // For production, replace with specific allowed origins:
+    // origin: process.env.ALLOWED_ORIGINS?.split(',') || 'https://yourdomain.com'
+    origin: '*',
+    methods: ['GET', 'POST']
+  }
+});
+
+// Serve static files from dist directory
+const distPath = path.join(__dirname, 'dist');
+expressApp.use(express.static(distPath));
+
+// Store terminal instances per socket
+const terminals = new Map();
+
+io.on('connection', (socket) => {
+  console.log('Client connected:', socket.id);
+
+  socket.on('create-terminal', ({ cols, rows }) => {
+    console.log('Creating terminal for socket:', socket.id);
+    
+    try {
+      // Determine shell based on OS
+      const shell = os.platform() === 'win32' ? 'powershell.exe' : 'bash';
+      
+      // Create pseudo-terminal
+      // NOTE: Uses HOME directory as working directory for development.
+      // For production or sandboxed environments, consider using a specific
+      // restricted directory: cwd: path.join(process.cwd(), 'workspace')
+      const ptyProcess = pty.spawn(shell, [], {
+        name: 'xterm-color',
+        cols: cols || 80,
+        rows: rows || 24,
+        cwd: process.env.HOME || process.cwd(),
+        env: process.env
+      });
+
+      // Store terminal instance
+      terminals.set(socket.id, ptyProcess);
+
+      // Send data from terminal to client
+      ptyProcess.onData((data) => {
+        socket.emit('terminal-output', data);
+      });
+
+      // Handle terminal exit
+      ptyProcess.onExit(({ exitCode, signal }) => {
+        console.log(`Terminal exited for ${socket.id}:`, exitCode, signal);
+        terminals.delete(socket.id);
+        socket.emit('terminal-exit', { exitCode, signal });
+      });
+
+      socket.emit('terminal-ready');
+    } catch (err) {
+      console.error('Failed to create terminal:', err);
+      socket.emit('terminal-error', { message: "Failed to create terminal" });
+    }
+  });
+
+  // Handle input from client
+  socket.on('terminal-input', (data) => {
+    const terminal = terminals.get(socket.id);
+    if (terminal) {
+      terminal.write(data);
+    }
+  });
+
+  // Handle terminal resize
+  socket.on('terminal-resize', ({ cols, rows }) => {
+    const terminal = terminals.get(socket.id);
+    if (terminal) {
+      terminal.resize(cols, rows);
+    }
+  });
+
+  // Clean up on disconnect
+  socket.on('disconnect', () => {
+    console.log('Client disconnected:', socket.id);
+    const terminal = terminals.get(socket.id);
+    if (terminal) {
+      terminal.kill();
+      terminals.delete(socket.id);
+    }
+  });
+});
+
+// Fallback to serve index.html for client-side routing
+expressApp.get('*', (req, res) => {
+  res.sendFile(path.join(distPath, 'index.html'), (err) => {
+    if (err) {
+      console.error('Failed to serve index.html:', err);
+      res.status(500).send("Build artifacts (dist/index.html) not found. Please run 'npm run build' first.");
+    }
+  });
+});
+
+httpServer.listen(port, () => {
+  console.log(`> ai-kanban-terminal ready on http://${hostname}:${port}`);
+}).on('error', (err) => {
+  console.error('Server failed to start:', err);
+  process.exit(1);
+});