fix: resolve ESM module not found error for kiro-sdk (GH-11)

.github/workflows/deploy.yml

@@ -0,0 +1,75 @@
+name: Deploy Claude Code UI to Mac Mini
+
+on:
+  push:
+    branches: [main]
+    paths-ignore: ['**.md']
+  workflow_dispatch:
+
+concurrency:
+  group: deploy-${{ github.ref }}
+  cancel-in-progress: false
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Deploy via SSH
+        uses: appleboy/ssh-action@v1
+        with:
+          host: ${{ secrets.MAC_MINI_HOST }}
+          username: ${{ secrets.MAC_MINI_USER }}
+          key: ${{ secrets.MAC_MINI_SSH_KEY }}
+          command_timeout: 10m
+          script: |
+            set -e
+            export PATH="/opt/homebrew/bin:/usr/local/bin:$HOME/.nvm/versions/node/$(ls $HOME/.nvm/versions/node 2>/dev/null | tail -1)/bin:$PATH"
+
+            PROD_DIR="/Users/xuzhi/prod/claudecodeui"
+            GATEWAY_DIR="/Users/xuzhi/prod/gateway"
+
+            # Clone or pull
+            if [ ! -d "$PROD_DIR/.git" ]; then
+              # Handle existing non-git directory (legacy copy)
+              if [ -d "$PROD_DIR" ]; then
+                BACKUP="/Users/xuzhi/prod/claudecodeui.bak.$(date +%s)"
+                mv "$PROD_DIR" "$BACKUP"
+              fi
+              git clone https://github.com/GeorgeZhiXu/claudecodeui.git "$PROD_DIR"
+            else
+              cd "$PROD_DIR"
+              git fetch origin main
+              git reset --hard origin/main
+            fi
+            cd "$PROD_DIR"
+
+            # Install kiro-sdk locally (not published to npm)
+            if [ ! -d "$PROD_DIR/kiro-sdk/.git" ]; then
+              rm -rf "$PROD_DIR/kiro-sdk"
+              git clone https://github.com/GeorgeZhiXu/kiro-sdk.git "$PROD_DIR/kiro-sdk"
+            else
+              cd "$PROD_DIR/kiro-sdk"
+              git fetch origin && git reset --hard origin/master
+            fi
+            cd "$PROD_DIR/kiro-sdk"
+            npm install && npm run build
+            cd "$PROD_DIR"
+
+            # Install dependencies (kiro-sdk resolved via file: link)
+            npm install --production=false
+
+            # Build frontend (VITE_BASE_PATH must be set at build time for correct asset paths)
+            VITE_BASE_PATH=/claudeui/ VITE_IS_PLATFORM=true npm run build
+
+            # Restart PM2 process
+            pm2 delete claude-code-ui 2>/dev/null || true
+            pm2 start "$GATEWAY_DIR/pm2.d/claude-code-ui.config.js"
+            pm2 save
+
+            # Health check
+            sleep 3
+            curl -sf -o /dev/null http://127.0.0.1:8040/api/health && echo "Claude Code UI healthy" || echo "Health check failed (may need a moment to start)"

.github/workflows/sync-upstream.yml

@@ -0,0 +1,75 @@
+name: Sync Upstream
+
+on:
+  schedule:
+    - cron: '17 */6 * * *'
+  workflow_dispatch:
+
+concurrency:
+  group: sync-upstream-main
+  cancel-in-progress: false
+
+permissions:
+  contents: write
+  pull-requests: write
+
+jobs:
+  sync:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout fork
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Configure git
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+
+      - name: Add upstream remote
+        run: |
+          git remote remove upstream 2>/dev/null || true
+          git remote add upstream https://github.com/siteboon/claudecodeui.git
+
+      - name: Fetch fork and upstream
+        run: |
+          git fetch origin main
+          git fetch upstream main
+
+      - name: Merge upstream/main into main
+        id: merge
+        continue-on-error: true
+        run: |
+          git checkout -B main origin/main
+          git merge --no-edit upstream/main
+
+      - name: Push merged main (no conflicts)
+        if: steps.merge.outcome == 'success'
+        run: git push origin main
+
+      - name: Resolve conflicts with Claude Code
+        if: steps.merge.outcome == 'failure'
+        env:
+          CLAUDE_CODE_USE_BEDROCK: "1"
+          AWS_BEARER_TOKEN_BEDROCK: ${{ secrets.AWS_BEARER_TOKEN_BEDROCK }}
+        run: |
+          curl -fsSL https://claude.ai/install.sh | bash
+          export PATH="$HOME/.claude/local/bin:$PATH"
+          claude -p "There are git merge conflicts from merging upstream/main into this fork's main branch. Resolve all conflicts by keeping changes from both sides when possible. For package.json, preserve both upstream additions and fork-specific customizations (like build:sdk). After resolving, stage all files with 'git add .' and commit with 'git commit --no-edit'." --allowedTools "Bash(git*)" "Bash(cat*)" "Bash(grep*)" "Edit" "Read"
+
+      - name: Create PR with resolved conflicts
+        if: steps.merge.outcome == 'failure'
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          BRANCH="auto-sync-upstream-$(date +%Y%m%d%H%M%S)"
+          git checkout -b "$BRANCH"
+          git push origin "$BRANCH"
+          gh pr create \
+            --repo GeorgeZhiXu/claudecodeui \
+            --title "Auto-sync upstream (conflicts resolved by Claude Code)" \
+            --body "Automated merge from \`upstream/main\` had conflicts that were resolved by Claude Code. Please review the resolutions before merging." \
+            --base main \
+            --head "$BRANCH"

.gitignore

@@ -140,3 +140,8 @@ tasks/
 
 # Git worktrees
 .worktrees/
+
+# Local SDK clones (separate repos)
+kiro-sdk/*
+!kiro-sdk/package.json
+kiro-sdk-python/

README.md

@@ -105,6 +105,47 @@ npx @cloudcli-ai/cloudcli@latest sandbox ~/my-project
 
 Supports Claude Code, Codex, and Gemini CLI. See the [sandbox docs](docker/) for setup and advanced options.
 
+### Deployment Notes
+
+- `VITE_BASE_PATH` controls the frontend base path for subpath deployments. Leave it unset for local/root deployments, or set it to a subpath such as `/cloudcli/` when building and running behind a gateway.
+- `DATABASE_PATH` controls where the auth database is stored. By default CloudCLI uses `~/.cloudcli/auth.db`.
+
+Examples:
+
+```bash
+# Local development or root deployment
+npm run build
+npm run server
+```
+
+```bash
+# Deployment behind a gateway subpath
+VITE_BASE_PATH=/cloudcli/ npm run build
+VITE_BASE_PATH=/cloudcli/ npm run server
+```
+
+### Fork Maintenance
+
+- Forks can automatically merge updates from `siteboon/claudecodeui` by enabling the GitHub Actions workflow in `.github/workflows/sync-upstream.yml`.
+- The workflow fetches `upstream/main`, merges it into your fork's `main`, and pushes only when the merge succeeds. If upstream introduces conflicts, Claude Code automatically resolves them and opens a PR for review.
+
+### Fork Development Setup
+
+This fork uses `kiro-sdk` and `kiro-sdk-python` as separate repos. To set up for local development:
+
+```bash
+git clone https://github.com/GeorgeZhiXu/claudecodeui.git
+cd claudecodeui
+
+# Clone the SDK (required — not published to npm)
+git clone https://github.com/GeorgeZhiXu/kiro-sdk.git
+cd kiro-sdk && npm install && npm run build && cd ..
+
+# Install dependencies and start
+npm install
+npm run start
+```
+
 
 ---
 

index.html

@@ -5,7 +5,9 @@
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <link rel="icon" type="image/png" href="/favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover" />
-    <title>CloudCLI UI</title>
+    <title>Claude Code UI</title>
+    <!-- Gateway integration: set router basename from env -->
+    <script>window.__ROUTER_BASENAME__ = '%BASE_URL%'.replace(/\/$/, '') || '';</script>
 
     <!-- PWA Manifest -->
     <link rel="manifest" href="/manifest.json" crossorigin="use-credentials"  />
@@ -29,20 +31,5 @@
   <body>
     <div id="root"></div>
     <script type="module" src="/src/main.jsx"></script>
-
-    <!-- Service Worker Registration -->
-    <script>
-      if ('serviceWorker' in navigator) {
-        window.addEventListener('load', () => {
-          navigator.serviceWorker.register('/sw.js')
-            .then(registration => {
-              console.log('SW registered: ', registration);
-            })
-            .catch(registrationError => {
-              console.log('SW registration failed: ', registrationError);
-            });
-        });
-      }
-    </script>
   </body>
 </html>

kiro-sdk/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "kiro-sdk",
+  "version": "0.1.0",
+  "description": "SDK for communicating with kiro-cli via the ACP (Agent Communication Protocol)",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./index.js": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "devDependencies": {
+    "@types/node": "^25.6.0",
+    "typescript": "^5.4.0",
+    "vitest": "^4.1.2"
+  },
+  "license": "MIT"
+}