npm - castle-web-cli - Versions diffs - 0.4.1 → 0.4.3 - Mend

castle-web-cli 0.4.1 → 0.4.3

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.

Files changed (158) hide show

package/dist/api.d.ts +53 -5
package/dist/api.js +42 -15
package/dist/config.d.ts +2 -0
package/dist/config.js +25 -11
package/dist/get-deck.d.ts +3 -0
package/dist/get-deck.js +64 -0
package/dist/ide-client.d.ts +1 -0
package/dist/ide-client.js +537 -0
package/dist/ide.d.ts +16 -0
package/dist/ide.js +546 -0
package/dist/index.js +36 -41
package/dist/init.d.ts +3 -1
package/dist/init.js +173 -24
package/dist/localPaths.d.ts +6 -0
package/dist/localPaths.js +33 -0
package/dist/login.js +1 -1
package/dist/preview.d.ts +3 -0
package/dist/preview.js +53 -34
package/dist/save-deck.d.ts +2 -0
package/dist/{push.js → save-deck.js} +66 -5
package/dist/serve.d.ts +2 -0
package/dist/serve.js +290 -27
package/kits/basic-2d/.prettierrc +8 -0
package/kits/basic-2d/CLAUDE.md +131 -0
package/kits/basic-2d/behaviors/Camera.jsx +43 -0
package/kits/basic-2d/behaviors/Collider.jsx +71 -0
package/kits/basic-2d/behaviors/Drawing.jsx +139 -0
package/kits/basic-2d/behaviors/Layout.jsx +16 -0
package/kits/basic-2d/drawings/floor.drawing +70 -0
package/kits/basic-2d/editors/App.jsx +152 -0
package/kits/basic-2d/editors/CodeEditor.jsx +112 -0
package/kits/basic-2d/editors/DrawingEditor.jsx +222 -0
package/kits/basic-2d/editors/FileBrowser.jsx +143 -0
package/kits/basic-2d/editors/PlayOnly.jsx +21 -0
package/kits/basic-2d/editors/SceneEditor.jsx +1012 -0
package/kits/basic-2d/editors/behaviorRegistry.js +24 -0
package/kits/basic-2d/editors/editorHistory.js +52 -0
package/kits/basic-2d/engine/ScenePlayer.jsx +83 -0
package/kits/basic-2d/engine/SceneUI.jsx +67 -0
package/kits/basic-2d/engine/TouchControls.jsx +136 -0
package/kits/basic-2d/engine/autoInspector.jsx +51 -0
package/kits/basic-2d/engine/files.js +62 -0
package/kits/basic-2d/engine/scene.js +420 -0
package/kits/basic-2d/engine/ui.jsx +344 -0
package/kits/basic-2d/engine/ui.module.css +928 -0
package/kits/basic-2d/eslint.config.js +50 -0
package/kits/basic-2d/index.html +11 -0
package/kits/basic-2d/main.jsx +10 -0
package/kits/basic-2d/package-lock.json +2706 -0
package/kits/basic-2d/package.json +41 -0
package/kits/basic-2d/scenes/main.scene +108 -0
package/kits/basic-2d/vite.config.js +1 -0
package/kits/basic-2d-frozen/.prettierrc +8 -0
package/kits/basic-2d-frozen/CLAUDE.md +131 -0
package/kits/basic-2d-frozen/behaviors/Camera.jsx +43 -0
package/kits/basic-2d-frozen/behaviors/Collider.jsx +71 -0
package/kits/basic-2d-frozen/behaviors/Drawing.jsx +139 -0
package/kits/basic-2d-frozen/behaviors/Layout.jsx +16 -0
package/kits/basic-2d-frozen/drawings/floor.drawing +70 -0
package/kits/basic-2d-frozen/editors/App.jsx +152 -0
package/kits/basic-2d-frozen/editors/CodeEditor.jsx +112 -0
package/kits/basic-2d-frozen/editors/DrawingEditor.jsx +222 -0
package/kits/basic-2d-frozen/editors/FileBrowser.jsx +143 -0
package/kits/basic-2d-frozen/editors/PlayOnly.jsx +21 -0
package/kits/basic-2d-frozen/editors/SceneEditor.jsx +1012 -0
package/kits/basic-2d-frozen/editors/behaviorRegistry.js +24 -0
package/kits/basic-2d-frozen/editors/editorHistory.js +52 -0
package/kits/basic-2d-frozen/engine/ScenePlayer.jsx +83 -0
package/kits/basic-2d-frozen/engine/SceneUI.jsx +67 -0
package/kits/basic-2d-frozen/engine/TouchControls.jsx +136 -0
package/kits/basic-2d-frozen/engine/autoInspector.jsx +51 -0
package/kits/basic-2d-frozen/engine/files.js +62 -0
package/kits/basic-2d-frozen/engine/scene.js +420 -0
package/kits/basic-2d-frozen/engine/ui.jsx +344 -0
package/kits/basic-2d-frozen/engine/ui.module.css +928 -0
package/kits/basic-2d-frozen/eslint.config.js +50 -0
package/kits/basic-2d-frozen/index.html +11 -0
package/kits/basic-2d-frozen/main.jsx +10 -0
package/kits/basic-2d-frozen/package-lock.json +2706 -0
package/kits/basic-2d-frozen/package.json +41 -0
package/kits/basic-2d-frozen/scenes/main.scene +108 -0
package/kits/basic-2d-frozen/vite.config.js +1 -0
package/kits/rpg-2d/.prettierrc +8 -0
package/kits/rpg-2d/behaviors/Camera.tsx +52 -0
package/kits/rpg-2d/behaviors/Collider.tsx +98 -0
package/kits/rpg-2d/behaviors/Dialog.tsx +184 -0
package/kits/rpg-2d/behaviors/Drawing.tsx +161 -0
package/kits/rpg-2d/behaviors/Friend.tsx +45 -0
package/kits/rpg-2d/behaviors/Layout.tsx +29 -0
package/kits/rpg-2d/behaviors/PlayerController.tsx +255 -0
package/kits/rpg-2d/behaviors/Portal.tsx +60 -0
package/kits/rpg-2d/behaviors/QuestLog.tsx +90 -0
package/kits/rpg-2d/behaviors/SaveMenu.tsx +123 -0
package/kits/rpg-2d/behaviors/Tilemap.tsx +90 -0
package/kits/rpg-2d/drawings/bld-home.drawing +8136 -0
package/kits/rpg-2d/drawings/env-crate.drawing +509 -0
package/kits/rpg-2d/drawings/env-fence.drawing +536 -0
package/kits/rpg-2d/drawings/env-flower-bed.drawing +607 -0
package/kits/rpg-2d/drawings/env-fountain.drawing +2622 -0
package/kits/rpg-2d/drawings/env-hedge.drawing +601 -0
package/kits/rpg-2d/drawings/env-house-blue.drawing +1 -0
package/kits/rpg-2d/drawings/env-house-green.drawing +1 -0
package/kits/rpg-2d/drawings/env-tree-oak.drawing +1540 -0
package/kits/rpg-2d/drawings/env-tree-pine.drawing +1315 -0
package/kits/rpg-2d/drawings/floor.drawing +70 -0
package/kits/rpg-2d/drawings/fx-sparkle.drawing +926 -0
package/kits/rpg-2d/drawings/npc-juno-idle-down.drawing +1099 -0
package/kits/rpg-2d/drawings/npc-juno-walk-down.drawing +4177 -0
package/kits/rpg-2d/drawings/npc-opal-idle-down.drawing +1099 -0
package/kits/rpg-2d/drawings/npc-opal-walk-down.drawing +4177 -0
package/kits/rpg-2d/drawings/player-idle-down.drawing +1070 -0
package/kits/rpg-2d/drawings/player-idle-left.drawing +1070 -0
package/kits/rpg-2d/drawings/player-idle-right.drawing +1070 -0
package/kits/rpg-2d/drawings/player-idle-up.drawing +1070 -0
package/kits/rpg-2d/drawings/player-walk-down.drawing +4148 -0
package/kits/rpg-2d/drawings/player-walk-left.drawing +4148 -0
package/kits/rpg-2d/drawings/player-walk-right.drawing +4148 -0
package/kits/rpg-2d/drawings/player-walk-up.drawing +4148 -0
package/kits/rpg-2d/editors/App.tsx +163 -0
package/kits/rpg-2d/editors/CodeEditor.tsx +120 -0
package/kits/rpg-2d/editors/DrawingEditor.tsx +278 -0
package/kits/rpg-2d/editors/FileBrowser.tsx +191 -0
package/kits/rpg-2d/editors/PlayOnly.tsx +26 -0
package/kits/rpg-2d/editors/SceneEditor.tsx +1093 -0
package/kits/rpg-2d/editors/behaviorRegistry.ts +33 -0
package/kits/rpg-2d/editors/editorHistory.ts +75 -0
package/kits/rpg-2d/editors/editorProps.ts +10 -0
package/kits/rpg-2d/engine/ScenePlayer.tsx +130 -0
package/kits/rpg-2d/engine/SceneUI.tsx +74 -0
package/kits/rpg-2d/engine/TouchControls.tsx +157 -0
package/kits/rpg-2d/engine/autoInspector.tsx +111 -0
package/kits/rpg-2d/engine/drawing.ts +81 -0
package/kits/rpg-2d/engine/files.ts +215 -0
package/kits/rpg-2d/engine/scene.ts +484 -0
package/kits/rpg-2d/engine/ui.module.css +928 -0
package/kits/rpg-2d/engine/ui.tsx +483 -0
package/kits/rpg-2d/eslint.config.js +46 -0
package/kits/rpg-2d/index.html +11 -0
package/kits/rpg-2d/main.tsx +14 -0
package/kits/rpg-2d/package-lock.json +3149 -0
package/kits/rpg-2d/package.json +46 -0
package/kits/rpg-2d/scenes/main.scene +203 -0
package/kits/rpg-2d/tsconfig.json +17 -0
package/kits/rpg-2d/vite-env.d.ts +7 -0
package/kits/rpg-2d/vite.config.js +1 -0
package/package.json +27 -5
package/AGENTS.md +0 -25
package/dist/push.d.ts +0 -1
package/src/api.ts +0 -160
package/src/bundle.ts +0 -28
package/src/config.ts +0 -36
package/src/index.ts +0 -143
package/src/init.ts +0 -71
package/src/login.ts +0 -24
package/src/preview.ts +0 -94
package/src/push.ts +0 -118
package/src/serve.ts +0 -134
package/tsconfig.json +0 -13

package/dist/ide.js ADDED Viewed

@@ -0,0 +1,546 @@
+// IDE panel for `castle-web serve --ide`: a desktop split view with the deck
+// in an iframe on the left and an xterm.js terminal on the right. The terminal
+// attaches to a PTY (a login shell) running in the deck directory, so an agent
+// CLI can be driven right next to the live deck.
+//
+// Backend pattern ported from castle-cli's `ide` branch: @lydell/node-pty for
+// the PTY, an @xterm/headless screen + @xterm/addon-serialize so a reconnecting
+// client gets a full replay of the current screen + scrollback.
+import * as fs from 'fs';
+import * as path from 'path';
+import { createRequire } from 'module';
+import { fileURLToPath } from 'url';
+import { spawn as spawnPty } from '@lydell/node-pty';
+import headlessPkg from '@xterm/headless';
+import { SerializeAddon } from '@xterm/addon-serialize';
+import { WebSocketServer } from 'ws';
+const HeadlessTerminal = headlessPkg.Terminal;
+const require_ = createRequire(import.meta.url);
+const DIST_DIR = path.dirname(fileURLToPath(import.meta.url));
+const PTY_TERM = 'xterm-256color';
+const INITIAL_COLS = 80;
+const INITIAL_ROWS = 24;
+const SCROLLBACK = 4000;
+// The split-view shell is served at the deck root `/` (the deck itself moves
+// into the iframe at `/index.html`); `/__castle/ide/<asset>` are the shell's
+// static assets; `/__castle/pty` is the PTY WebSocket (handled via a direct
+// upgrade handler on Vite's HTTP server).
+export const IDE_ASSET_PREFIX = '/__castle/ide/';
+export const PTY_WS_PATH = '/__castle/pty';
+// Injected into every served deck's <head>. When the deck runs embedded in the
+// IDE shell iframe, Ctrl+T moves keyboard focus out to the terminal -- but
+// while the iframe holds focus the parent sees no keydowns, so the deck page
+// has to forward Ctrl+T to the parent itself. No-op for a standalone deck.
+export const DECK_FOCUS_SCRIPT = `<script>(function(){if(window.parent===window)return;` +
+    `document.addEventListener('keydown',function(e){` +
+    `if(e.ctrlKey&&!e.metaKey&&!e.altKey&&!e.shiftKey&&(e.key==='t'||e.key==='T')){` +
+    `e.preventDefault();try{parent.postMessage({type:'castle-ide-toggle-focus'},'*');}catch(_){}}` +
+    `},true);})();</script>`;
+function defaultShell() {
+    if (process.platform === 'win32') {
+        return { command: process.env.COMSPEC ?? 'cmd.exe', args: [] };
+    }
+    return { command: process.env.SHELL ?? '/bin/zsh', args: ['-l'] };
+}
+function ptyEnv() {
+    const env = {
+        ...process.env,
+        TERM: PTY_TERM,
+        COLORTERM: 'truecolor',
+        CLICOLOR: '1',
+        CLICOLOR_FORCE: '1',
+        FORCE_COLOR: process.env.FORCE_COLOR === '0' ? '3' : process.env.FORCE_COLOR ?? '3',
+        TERM_PROGRAM: 'castle-web-ide',
+    };
+    delete env.NO_COLOR;
+    delete env.NODE_DISABLE_COLORS;
+    return env;
+}
+function clampSize(value, fallback) {
+    const n = Number(value);
+    if (!Number.isFinite(n) || n <= 0)
+        return fallback;
+    return Math.max(2, Math.min(1000, Math.floor(n)));
+}
+function rawDataToString(data) {
+    if (Array.isArray(data))
+        return Buffer.concat(data).toString('utf8');
+    if (Buffer.isBuffer(data))
+        return data.toString('utf8');
+    return Buffer.from(new Uint8Array(data)).toString('utf8');
+}
+function send(socket, body) {
+    if (socket.readyState === socket.OPEN)
+        socket.send(JSON.stringify(body));
+}
+// `screen.write` is async; chain writes/resizes through a single queue so the
+// serialized replay never races a partial write. Mirrors castle-cli + threads.
+function queueScreenOp(session, op) {
+    session.renderQueue = session.renderQueue
+        .catch(() => undefined)
+        .then(op)
+        .catch((err) => console.error('[ide] screen render failed', err));
+}
+async function waitForStableScreen(session) {
+    while (true) {
+        const queue = session.renderQueue;
+        await queue.catch(() => undefined);
+        if (session.renderQueue === queue)
+            return;
+    }
+}
+function broadcast(session, body) {
+    for (const socket of session.clients)
+        send(socket, body);
+}
+// Returns a handler for the IDE page + assets + the PTY WebSocket upgrade. The
+// PTY runs a login shell in `deckDir`; it spawns lazily on first connection.
+export function createIdeServer(opts) {
+    const { deckDir, deckLabel } = opts;
+    let session = null;
+    function spawnSession() {
+        const { command, args } = defaultShell();
+        const screen = new HeadlessTerminal({
+            allowProposedApi: true,
+            cols: INITIAL_COLS,
+            rows: INITIAL_ROWS,
+            convertEol: false,
+            scrollback: SCROLLBACK,
+        });
+        const serializeAddon = new SerializeAddon();
+        screen.loadAddon(serializeAddon);
+        const pty = spawnPty(command, args, {
+            name: PTY_TERM,
+            cols: INITIAL_COLS,
+            rows: INITIAL_ROWS,
+            cwd: deckDir,
+            env: ptyEnv(),
+        });
+        const s = {
+            pty,
+            screen,
+            serializeAddon,
+            renderQueue: Promise.resolve(),
+            clients: new Set(),
+            cols: INITIAL_COLS,
+            rows: INITIAL_ROWS,
+            exited: null,
+        };
+        pty.onData((data) => {
+            queueScreenOp(s, () => new Promise((done) => s.screen.write(data, done)));
+            broadcast(s, { type: 'output', data });
+        });
+        pty.onExit(({ exitCode, signal }) => {
+            s.exited = { exitCode, signal };
+            broadcast(s, { type: 'exit', exitCode, signal });
+            // Clients get the `exit` message above (which disables their reconnect),
+            // then we close the sockets so they don't sit half-open.
+            for (const socket of s.clients) {
+                try {
+                    socket.close(1000, 'shell exited');
+                }
+                catch {
+                    /* ignore */
+                }
+            }
+        });
+        return s;
+    }
+    function ensureSession() {
+        if (!session || session.exited)
+            session = spawnSession();
+        return session;
+    }
+    function resizeSession(s, cols, rows) {
+        const c = clampSize(cols, s.cols);
+        const r = clampSize(rows, s.rows);
+        if (c === s.cols && r === s.rows)
+            return;
+        s.cols = c;
+        s.rows = r;
+        try {
+            s.pty.resize(c, r);
+        }
+        catch {
+            /* pty may have exited */
+        }
+        queueScreenOp(s, () => {
+            s.screen.resize(c, r);
+        });
+    }
+    function attachClient(socket) {
+        const s = ensureSession();
+        void (async () => {
+            try {
+                await waitForStableScreen(s);
+                if (socket.readyState !== socket.OPEN)
+                    return;
+                send(socket, {
+                    type: 'replay',
+                    data: s.serializeAddon.serialize({ scrollback: SCROLLBACK }),
+                });
+                if (s.exited) {
+                    send(socket, { type: 'exit', exitCode: s.exited.exitCode, signal: s.exited.signal });
+                }
+            }
+            catch (err) {
+                send(socket, {
+                    type: 'error',
+                    error: err instanceof Error ? err.message : 'could not restore screen',
+                });
+            }
+            finally {
+                if (socket.readyState === socket.OPEN)
+                    s.clients.add(socket);
+            }
+        })();
+        socket.on('message', (raw) => {
+            let msg;
+            try {
+                msg = JSON.parse(rawDataToString(raw));
+            }
+            catch {
+                return;
+            }
+            if (msg.type === 'input' && typeof msg.data === 'string') {
+                if (!s.exited)
+                    s.pty.write(msg.data);
+            }
+            else if (msg.type === 'resize') {
+                resizeSession(s, Number(msg.cols), Number(msg.rows));
+            }
+        });
+        socket.on('close', () => {
+            s.clients.delete(socket);
+        });
+    }
+    const wss = new WebSocketServer({ noServer: true });
+    function handleUpgrade(req, socket, head) {
+        const url = new URL(req.url ?? '/', 'http://localhost');
+        if (url.pathname !== PTY_WS_PATH)
+            return false;
+        wss.handleUpgrade(req, socket, head, (ws) => attachClient(ws));
+        return true;
+    }
+    function handleHttpRequest(_req, res, reqPath) {
+        if (reqPath === '/') {
+            const html = renderIdePage(deckLabel);
+            res.writeHead(200, { 'content-type': 'text/html; charset=utf-8', 'cache-control': 'no-store' });
+            res.end(html);
+            return true;
+        }
+        if (reqPath.startsWith(IDE_ASSET_PREFIX)) {
+            const asset = reqPath.slice(IDE_ASSET_PREFIX.length);
+            const resolved = resolveIdeAsset(asset);
+            if (!resolved) {
+                res.writeHead(404).end();
+                return true;
+            }
+            res.writeHead(200, {
+                'content-type': resolved.contentType,
+                'cache-control': 'no-store',
+            });
+            fs.createReadStream(resolved.filePath).pipe(res);
+            return true;
+        }
+        return false;
+    }
+    function shutdown() {
+        if (session) {
+            try {
+                session.pty.kill();
+            }
+            catch {
+                /* already gone */
+            }
+            for (const socket of session.clients) {
+                try {
+                    socket.close(1001, 'serve shutting down');
+                }
+                catch {
+                    /* ignore */
+                }
+            }
+        }
+        wss.close();
+    }
+    return { handleHttpRequest, handleUpgrade, shutdown };
+}
+// Map an IDE asset name to a file on disk. xterm + addon-fit come straight from
+// node_modules (UMD builds); the terminal client is compiled alongside this
+// file by tsc into the same dist directory.
+function resolveIdeAsset(asset) {
+    const assets = {
+        'xterm.js': { spec: '@xterm/xterm/lib/xterm.js', contentType: 'text/javascript; charset=utf-8' },
+        'xterm.css': { spec: '@xterm/xterm/css/xterm.css', contentType: 'text/css; charset=utf-8' },
+        'addon-fit.js': {
+            spec: '@xterm/addon-fit/lib/addon-fit.js',
+            contentType: 'text/javascript; charset=utf-8',
+        },
+    };
+    const fromModule = assets[asset];
+    if (fromModule) {
+        try {
+            return { filePath: require_.resolve(fromModule.spec), contentType: fromModule.contentType };
+        }
+        catch {
+            return null;
+        }
+    }
+    if (asset === 'ide-client.js') {
+        const filePath = path.join(DIST_DIR, 'ide-client.js');
+        return fs.existsSync(filePath)
+            ? { filePath, contentType: 'text/javascript; charset=utf-8' }
+            : null;
+    }
+    return null;
+}
+// Lucide glyphs; currentColor so the button :hover styles drive them.
+const TERMINAL_ICON_SVG = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="4 17 10 11 4 5" /><line x1="12" y1="19" x2="20" y2="19" /></svg>`;
+const COG_ICON_SVG = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z" /><circle cx="12" cy="12" r="3" /></svg>`;
+const IDE_STYLES = `
+  :root { color-scheme: light; }
+  * { box-sizing: border-box; }
+  html, body { height: 100%; margin: 0; }
+  body {
+    /* Header-strip height. The deck's editor header is 48px, but drops to the
+       52px responsive variant once the deck iframe is below 860px wide -- which
+       it is whenever the terminal is open at a viewport under 1360px. Track
+       that so the terminal header strip and its buttons line up with the deck's
+       editor header beside it. */
+    --term-header-h: 48px;
+    background: #ffffff;
+    color: #1f2328;
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
+    display: flex;
+    overflow: hidden;
+  }
+  @media (max-width: 1360px) {
+    body.term-open { --term-header-h: 52px; }
+  }
+  #deck {
+    flex: 1 1 0;
+    min-width: 0;
+    background: #f5f5f5;
+    border-right: 1px solid #e1e4e8;
+  }
+  #deck iframe { width: 100%; height: 100%; border: 0; display: block; }
+  /* The terminal panel is a flex column: a fixed-height header strip on top,
+     and the xterm host taking exactly the leftover height below it. */
+  #term {
+    flex: 1 1 500px;
+    max-width: 500px;
+    min-width: 320px;
+    background: #ffffff;
+    display: flex;
+    flex-direction: column;
+  }
+  body.term-dark #term { background: #1a1b26; }
+  /* xterm host: takes whatever height is left after the header. min-height:0
+     lets it shrink within the flex column instead of overflowing. */
+  #term-host {
+    flex: 1 1 0;
+    min-height: 0;
+    width: 100%;
+    padding: 6px;
+    overscroll-behavior: contain;
+  }
+  /* Header strip for the terminal panel -- mirrors the deck's editor header
+     (same height, 1px bottom border, white background, 16px title). A real
+     flex item at the top of the panel; only shown while the terminal is open
+     (when closed the panel is hidden and the deck is full width). */
+  #term-header {
+    flex: 0 0 var(--term-header-h);
+    height: var(--term-header-h);
+    display: none;
+    align-items: center;
+    gap: 8px;
+    padding: 10px 12px;
+    background: #ffffff;
+    border-bottom: 1px solid #cccccc;
+  }
+  body.term-open #term-header { display: flex; }
+  body.term-dark #term-header { background: #1a1b26; border-bottom-color: #2a2c3d; }
+  #term-header .term-header-title {
+    font-size: 16px;
+    line-height: 1;
+    letter-spacing: 0.01em;
+    color: #222222;
+  }
+  body.term-dark #term-header .term-header-title { color: #c0caf5; }
+  /* Terminal hidden: the panel stays mounted at its full 500px size (so xterm
+     keeps its measured layout) -- just lifted out of flow and made invisible,
+     and the deck takes the whole width. */
+  body:not(.term-open) #deck { border-right: 0; }
+  body:not(.term-open) #term {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 500px;
+    height: 100%;
+    visibility: hidden;
+  }
+  /* Toggle button: always pinned top-right above both the deck and the
+     terminal. Styling is copied from the editor-demo header icon buttons
+     (34px square, 1px solid #000, 4px radius, drop shadow) so it reads as a
+     header button when it overlays a header bar. Vertically centered in the
+     header strip -- (header-h - 34) / 2 -- which tracks the deck's editor
+     header height, so it sits centered whether the terminal is open or not. */
+  #term-toggle {
+    position: fixed;
+    top: calc((var(--term-header-h) - 34px) / 2);
+    right: 7px;
+    z-index: 2147483000;
+    width: 34px;
+    height: 34px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #ffffff;
+    color: #222222;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+    cursor: pointer;
+  }
+  #term-toggle:hover { background: #eeeeee; }
+  #term-toggle svg { width: 16px; height: 16px; display: block; }
+  /* Settings cog: same button style, sits just left of the toggle. Only
+     present while the terminal is open. */
+  #term-settings {
+    position: fixed;
+    top: calc((var(--term-header-h) - 34px) / 2);
+    right: 47px;
+    z-index: 2147483000;
+    width: 34px;
+    height: 34px;
+    padding: 0;
+    display: none;
+    align-items: center;
+    justify-content: center;
+    background: #ffffff;
+    color: #222222;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+    cursor: pointer;
+  }
+  body.term-open #term-settings { display: flex; }
+  #term-settings:hover { background: #eeeeee; }
+  #term-settings svg { width: 16px; height: 16px; display: block; }
+  /* Settings popover: flat, opaque, anchored under the buttons. */
+  #term-settings-panel {
+    position: fixed;
+    top: var(--term-header-h);
+    right: 7px;
+    z-index: 2147483000;
+    display: none;
+    width: 190px;
+    padding: 8px 10px;
+    background: #ffffff;
+    color: #222222;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+    font-size: 12px;
+  }
+  body.term-settings-open #term-settings-panel { display: block; }
+  #term-settings-panel .row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 10px;
+  }
+  #term-settings-panel .seg {
+    display: flex;
+    border: 1px solid #000000;
+    border-radius: 4px;
+    overflow: hidden;
+  }
+  #term-settings-panel .seg button {
+    padding: 3px 9px;
+    font: inherit;
+    background: #ffffff;
+    color: #222222;
+    border: 0;
+    cursor: pointer;
+  }
+  #term-settings-panel .seg button + button { border-left: 1px solid #000000; }
+  #term-settings-panel .seg button.active { background: #222222; color: #ffffff; }
+  /* Let the xterm light theme show through, and hide every scrollbar xterm
+     can draw -- the native viewport one AND the renderer overlay one. */
+  .xterm, .xterm-viewport, .xterm-screen, .xterm-helpers {
+    background-color: transparent !important;
+  }
+  .xterm { overscroll-behavior: contain; }
+  .xterm-viewport {
+    overscroll-behavior: contain;
+    scrollbar-width: none;
+    -ms-overflow-style: none;
+  }
+  .xterm-viewport::-webkit-scrollbar { width: 0; height: 0; }
+  .xterm .xterm-scrollable-element > .scrollbar,
+  .xterm .xterm-scrollable-element > .scrollbar.visible,
+  .xterm .xterm-scrollable-element > .visible.scrollbar,
+  .xterm .xterm-scrollable-element > .invisible.scrollbar,
+  .xterm .xterm-scrollable-element > .xterm-scrollbar {
+    display: none !important;
+    width: 0 !important;
+    height: 0 !important;
+    min-width: 0 !important;
+    min-height: 0 !important;
+    opacity: 0 !important;
+    pointer-events: none !important;
+  }
+  .xterm .xterm-scrollable-element > .scrollbar > .slider,
+  .xterm .xterm-scrollable-element > .scrollbar > .scra,
+  .xterm .xterm-scrollable-element > .xterm-scrollbar > .xterm-slider {
+    display: none !important;
+    width: 0 !important;
+    height: 0 !important;
+  }
+  .xterm .xterm-scrollable-element > .shadow { display: none !important; }
+`;
+const IDE_BODY = `
+<button id="term-settings" type="button" tabindex="-1" title="terminal settings" aria-label="terminal settings">${COG_ICON_SVG}</button>
+<button id="term-toggle" type="button" tabindex="-1" title="toggle terminal" aria-label="toggle terminal">${TERMINAL_ICON_SVG}</button>
+<div id="term-settings-panel">
+  <div class="row">
+    <span>theme</span>
+    <div class="seg" id="term-theme-seg">
+      <button type="button" tabindex="-1" data-theme="light">light</button>
+      <button type="button" tabindex="-1" data-theme="dark">dark</button>
+    </div>
+  </div>
+</div>
+<div id="deck"><iframe id="deck-frame" src="/index.html" title="deck" allow="autoplay; clipboard-read; clipboard-write; fullscreen; gamepad"></iframe></div>
+<div id="term"><div id="term-header"><span class="term-header-title">Terminal</span></div><div id="term-host"></div></div>
+<script src="${IDE_ASSET_PREFIX}xterm.js"></script>
+<script src="${IDE_ASSET_PREFIX}addon-fit.js"></script>
+<script type="module" src="${IDE_ASSET_PREFIX}ide-client.js"></script>
+`;
+function renderIdePage(deckLabel) {
+    const title = `${deckLabel} -- Castle Editor`;
+    return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<title>${escapeHtml(title)}</title>
+<link rel="stylesheet" href="${IDE_ASSET_PREFIX}xterm.css" />
+<style>${IDE_STYLES}</style>
+</head>
+<body>${IDE_BODY}</body>
+</html>
+`;
+}
+function escapeHtml(value) {
+    return value.replace(/[&<>"]/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' })[c] ?? c);
+}

package/dist/index.js CHANGED Viewed

@@ -3,12 +3,13 @@ import * as fs from 'fs';
 import * as path from 'path';
 import { login } from './login.js';
 import { serve } from './serve.js';
-import { push } from './push.js';
+import { saveDeck } from './save-deck.js';
+import { getDeck } from './get-deck.js';
 import { init } from './init.js';
-import { savePreviewImage, savePreviewIfNeeded } from './preview.js';
+import { connectWS, savePreviewImage, savePreviewIfNeeded, takeScreenshot } from './preview.js';
 const args = process.argv.slice(2);
 const command = args[0];
-const FLAGS_WITH_VALUES = new Set(['--port', '--out']);
+const FLAGS_WITH_VALUES = new Set(['--port', '--out', '--host', '--kit', '--deck-id']);
 function findPositionalDir() {
     for (let i = 1; i < args.length; i++) {
         if (args[i].startsWith('--')) {
@@ -44,40 +45,54 @@ function getWsPort(dir) {
 }
 function usage() {
     console.log(`Usage:
-  castle-web init <dir>
-  castle-web serve [dir] [--port PORT] [--open]
+  castle-web init <dir> [--kit NAME]   (kits: basic-2d (default), rpg-2d, none)
+  castle-web serve [dir] [--port PORT] [--host HOST] [--open] [--detach]
   castle-web restart [--port PORT]
   castle-web screenshot [--out FILE] [--port PORT]
   castle-web save-preview-image [dir] [--port PORT] [--no-restart]
-  castle-web push [dir]
+  castle-web save-deck [dir]
+  castle-web get-deck <dir> [--deck-id ID]
   castle-web login`);
     process.exit(1);
 }
 async function main() {
     switch (command) {
         case 'init': {
-            const dir = args[1];
-            if (!dir) {
-                console.error('Usage: castle-web init <dir>');
+            const dir = findPositionalDir();
+            if (dir === '.') {
+                console.error('Usage: castle-web init <dir> [--kit NAME]');
                 process.exit(1);
             }
-            init(dir);
+            const kit = getFlagValue('--kit');
+            init(dir, { kit });
             break;
         }
         case 'serve': {
             const dir = findPositionalDir();
             const port = getFlagValue('--port');
+            const host = getFlagValue('--host');
             const open = args.includes('--open');
-            await serve(dir, { port, open });
+            const detach = args.includes('--detach');
+            await serve(dir, { port, host, open, detach });
             break;
         }
-        case 'push': {
+        case 'save-deck': {
             const dir = findPositionalDir();
-            await push(dir);
+            await saveDeck(dir);
             const wsPort = getWsPort(dir);
             await savePreviewIfNeeded(dir, wsPort);
             break;
         }
+        case 'get-deck': {
+            const dir = findPositionalDir();
+            if (dir === '.') {
+                console.error('Usage: castle-web get-deck <dir> [--deck-id ID]');
+                process.exit(1);
+            }
+            const deckId = getFlagValue('--deck-id');
+            await getDeck(dir, { deckId });
+            break;
+        }
         case 'restart': {
             const dir = findPositionalDir();
             const wsPort = getWsPort(dir);
@@ -94,39 +109,19 @@ async function main() {
             const dir = findPositionalDir();
             const outFile = getFlagValue('--out') ?? 'screenshot.png';
             const wsPort = getWsPort(dir);
-            const requestId = Math.random().toString(36).slice(2);
-            const { default: WS } = await import('ws');
-            const ws = new WS(`ws://localhost:${wsPort}`);
-            ws.on('open', () => {
-                ws.send(JSON.stringify({ type: 'screenshot_request', requestId }));
-            });
-            const timeout = setTimeout(() => {
-                console.error('Screenshot timed out. Is castle-web serve running?');
-                ws.close();
-                process.exit(1);
-            }, 3000);
-            ws.on('message', (raw) => {
-                try {
-                    const msg = JSON.parse(raw.toString());
-                    if (msg.type === 'screenshot_response' && msg.requestId === requestId) {
-                        clearTimeout(timeout);
-                        const base64 = msg.data.replace(/^data:image\/png;base64,/, '');
-                        fs.writeFileSync(outFile, Buffer.from(base64, 'base64'));
-                        console.log(`Saved ${outFile}`);
-                        ws.close();
-                        process.exit(0);
-                    }
-                }
-                catch { }
-            });
-            break;
+            const ws = await connectWS(wsPort);
+            const base64 = await takeScreenshot(ws);
+            ws.close();
+            fs.writeFileSync(outFile, Buffer.from(base64, 'base64'));
+            console.log(`Saved ${outFile}`);
+            return;
         }
         case 'save-preview-image': {
             const dir = findPositionalDir();
             const wsPort = getWsPort(dir);
             const noRestart = args.includes('--no-restart');
             await savePreviewImage(dir, wsPort, noRestart);
-            process.exit(0);
+            return;
         }
         case 'login':
             await login();
@@ -136,6 +131,6 @@ async function main() {
     }
 }
 main().catch((e) => {
-    console.error(e.message ?? e);
+    console.error(e instanceof Error ? e.message : String(e));
     process.exit(1);
 });

package/dist/init.d.ts CHANGED Viewed

@@ -1 +1,3 @@
-export declare function init(dir: string): Promise<void>;
+export declare function init(dir: string, opts?: {
+    kit?: string;
+}): void;