ai-kanban-terminal 0.2.0
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/README.md +120 -0
- package/dist/assets/index-CMu989wp.js +91 -0
- package/dist/assets/index-DCBCU9ry.css +32 -0
- package/dist/index.html +14 -0
- package/package.json +58 -0
- package/server.js +118 -0
package/README.md
ADDED
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
# AI Kanban Terminal
|
|
2
|
+
|
|
3
|
+
A browser-based terminal with bidirectional shell communication using Vite, Express, node-pty, xterm.js, and Socket.IO.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- 🖥️ **Browser-based Terminal**: Full terminal experience in your browser
|
|
8
|
+
- 🔄 **Bidirectional Communication**: Real-time shell input/output via Socket.IO
|
|
9
|
+
- 📐 **Responsive Resizing**: Automatic terminal resizing with Fit addon
|
|
10
|
+
- ♿ **WCAG 2.2 Compliant**: Accessible design with keyboard navigation, ARIA attributes, and high contrast support
|
|
11
|
+
- 🚀 **Quick Start**: Run with a single npx command
|
|
12
|
+
|
|
13
|
+
## Quick Start
|
|
14
|
+
|
|
15
|
+
### Using npx (Recommended)
|
|
16
|
+
|
|
17
|
+
Once published to npm:
|
|
18
|
+
|
|
19
|
+
```bash
|
|
20
|
+
npx ai-kanban-terminal
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
Or from GitHub directly:
|
|
24
|
+
|
|
25
|
+
```bash
|
|
26
|
+
npx github:kght6123/ai-kanban-terminal
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### Local Development
|
|
30
|
+
|
|
31
|
+
#### Option 1: Production-like Mode (Recommended for npx)
|
|
32
|
+
|
|
33
|
+
1. Clone the repository:
|
|
34
|
+
```bash
|
|
35
|
+
git clone https://github.com/kght6123/ai-kanban-terminal.git
|
|
36
|
+
cd ai-kanban-terminal
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
2. Install dependencies:
|
|
40
|
+
```bash
|
|
41
|
+
npm install
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
3. The postinstall script automatically builds the frontend. Start the server:
|
|
45
|
+
```bash
|
|
46
|
+
npm start
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
4. Open your browser and navigate to `http://localhost:3000`
|
|
50
|
+
|
|
51
|
+
#### Option 2: Development Mode (Frontend Development)
|
|
52
|
+
|
|
53
|
+
For frontend-only development with hot reload:
|
|
54
|
+
|
|
55
|
+
1. In one terminal, start the Vite dev server:
|
|
56
|
+
```bash
|
|
57
|
+
npm run dev
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
2. In another terminal, start the Express server:
|
|
61
|
+
```bash
|
|
62
|
+
npm start
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
3. Open your browser to `http://localhost:5173` (Vite dev server)
|
|
66
|
+
|
|
67
|
+
Note: In development mode, you'll need to manually connect Socket.IO to `http://localhost:3000` or update the component accordingly.
|
|
68
|
+
|
|
69
|
+
## Usage
|
|
70
|
+
|
|
71
|
+
Once the application starts, you'll see a terminal interface in your browser. You can:
|
|
72
|
+
|
|
73
|
+
- Type commands as you would in a regular terminal
|
|
74
|
+
- Use keyboard shortcuts (Ctrl+C, Ctrl+D, etc.)
|
|
75
|
+
- Resize the browser window to automatically adjust the terminal size
|
|
76
|
+
- Navigate with keyboard (Tab to focus on the terminal)
|
|
77
|
+
|
|
78
|
+
## Accessibility Features (WCAG 2.2)
|
|
79
|
+
|
|
80
|
+
- **Keyboard Navigation**: Full keyboard support with visible focus indicators
|
|
81
|
+
- **Screen Reader Support**: ARIA labels and roles for assistive technologies
|
|
82
|
+
- **High Contrast**: Minimum 4.5:1 contrast ratio for text
|
|
83
|
+
- **Reduced Motion**: Respects user's motion preferences
|
|
84
|
+
- **Focusable Terminal**: Terminal area is properly focusable and labeled
|
|
85
|
+
|
|
86
|
+
## Technology Stack
|
|
87
|
+
|
|
88
|
+
- **Vite**: Fast build tool and dev server
|
|
89
|
+
- **React**: UI library for the web application
|
|
90
|
+
- **Express**: HTTP server for serving static files
|
|
91
|
+
- **Socket.IO**: Real-time bidirectional communication
|
|
92
|
+
- **node-pty**: Pseudo terminal for spawning shells
|
|
93
|
+
- **xterm.js**: Terminal emulator in the browser
|
|
94
|
+
- **@xterm/addon-fit**: Automatic terminal resizing
|
|
95
|
+
|
|
96
|
+
## Scripts
|
|
97
|
+
|
|
98
|
+
- `npm run dev` - Start Vite development server on port 5173 (frontend only)
|
|
99
|
+
- `npm run build` - Build production bundle with Vite
|
|
100
|
+
- `npm start` - Start Express server on port 3000 (serves built files from dist/)
|
|
101
|
+
- `npm run preview` - Preview production build locally
|
|
102
|
+
|
|
103
|
+
## Publishing to npm
|
|
104
|
+
|
|
105
|
+
This package is configured for automatic deployment to npm. See [NPM_DEPLOY_GUIDE.md](NPM_DEPLOY_GUIDE.md) for detailed instructions in Japanese on:
|
|
106
|
+
|
|
107
|
+
- Setting up npm credentials
|
|
108
|
+
- Configuring GitHub Actions
|
|
109
|
+
- Creating releases
|
|
110
|
+
- Troubleshooting
|
|
111
|
+
|
|
112
|
+
### Quick Release Steps
|
|
113
|
+
|
|
114
|
+
1. Update version in `package.json`
|
|
115
|
+
2. Create a new release on GitHub with a tag (e.g., `v1.0.1`)
|
|
116
|
+
3. The GitHub Actions workflow will automatically build and publish to npm
|
|
117
|
+
|
|
118
|
+
## License
|
|
119
|
+
|
|
120
|
+
ISC
|