@chances-ai/client 24.3.0 → 25.0.0

package/dist/web-ui/terminal.js

@@ -0,0 +1,115 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * (7.5 W3) The interactive PTY terminal pane (xterm.js) — opens a real shell on
+ * the agent host over the off-ring `terminal/*` ACP messages. Mounted (lazily) by
+ * `ControlPanel` only when the agent advertises `terminal` (off by default
+ * server-side: `chances serve --terminal`). Privileged — a lease viewer's
+ * open/input is rejected `not_controller` server-side, so output simply never
+ * arrives (read-only by omission).
+ *
+ * xterm + this file are code-split (lazy) so the chat-only bundle never loads
+ * them. Browser-only (xterm needs a real DOM) → not happy-dom-testable; the wire
+ * relay + client-core terminal API ARE tested.
+ *
+ * Patterns borrowed (铁律 2): OpenHands `use-terminal` safe-fit guard +
+ * ResizeObserver→rAF; opencode 100 ms resize throttle.
+ */
+import { useEffect, useRef } from "react";
+import { Terminal as XTerm } from "@xterm/xterm";
+import { FitAddon } from "@xterm/addon-fit";
+import "@xterm/xterm/css/xterm.css";
+const RESIZE_THROTTLE_MS = 100;
+export function TerminalPane({ client, mode }) {
+    const ref = useRef(null);
+    useEffect(() => {
+        const container = ref.current;
+        if (!container)
+            return;
+        let disposed = false;
+        let terminalId = null;
+        let resizeTimer;
+        // xterm renders to a canvas → it needs concrete colours, not CSS vars. Read
+        // the panel's `--ch-*` chrome (set by themeCssVars) off the container, with
+        // sensible dark fallbacks.
+        const cssVar = (name, fallback) => {
+            const v = getComputedStyle(container).getPropertyValue(name).trim();
+            return v || fallback;
+        };
+        const term = new XTerm({
+            fontFamily: "ui-monospace, Menlo, Monaco, 'Courier New', monospace",
+            fontSize: 12,
+            cursorBlink: true,
+            scrollback: 5000,
+            theme: {
+                background: cssVar("--ch-bg", "#1e1e1e"),
+                foreground: cssVar("--ch-fg", "#d4d4d4"),
+                cursor: cssVar("--ch-accent", "#d4d4d4"),
+            },
+        });
+        const fit = new FitAddon();
+        term.loadAddon(fit);
+        term.open(container);
+        // Safe-fit (OpenHands): never fit a hidden / zero-size / unopened terminal.
+        const canFit = () => {
+            if (disposed || !term.element)
+                return false;
+            const cs = window.getComputedStyle(container);
+            return cs.display !== "none" && container.clientWidth > 0 && container.clientHeight > 0;
+        };
+        const fitSafely = () => {
+            if (canFit()) {
+                try {
+                    fit.fit();
+                }
+                catch {
+                    /* layout race — ignore */
+                }
+            }
+        };
+        fitSafely();
+        // Open the PTY at the current dims, then wire IO.
+        void client.openTerminal(term.cols, term.rows).then((id) => {
+            if (disposed) {
+                client.closeTerminal(id);
+                return;
+            }
+            terminalId = id;
+        });
+        const offOutput = client.onTerminalOutput((id, data) => {
+            if (id === terminalId)
+                term.write(data);
+        });
+        const onData = term.onData((data) => {
+            if (terminalId)
+                client.sendTerminalInput(terminalId, data);
+        });
+        const observer = new ResizeObserver(() => {
+            requestAnimationFrame(() => {
+                fitSafely();
+                if (resizeTimer)
+                    return;
+                resizeTimer = setTimeout(() => {
+                    resizeTimer = undefined;
+                    if (terminalId && canFit())
+                        client.resizeTerminal(terminalId, term.cols, term.rows);
+                }, RESIZE_THROTTLE_MS);
+            });
+        });
+        observer.observe(container);
+        return () => {
+            disposed = true;
+            if (resizeTimer)
+                clearTimeout(resizeTimer);
+            observer.disconnect();
+            offOutput();
+            onData.dispose();
+            if (terminalId)
+                client.closeTerminal(terminalId);
+            term.dispose();
+        };
+        // Re-create on mode change so canvas colours track the panel chrome (cheap;
+        // terminal sessions are short-lived).
+    }, [client, mode]);
+    return _jsx("div", { ref: ref, style: { width: "100%", height: "100%", minHeight: 0 } });
+}
+//# sourceMappingURL=terminal.js.map

package/dist/web-ui/terminal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"terminal.js","sourceRoot":"","sources":["../../src/web-ui/terminal.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,QAAQ,IAAI,KAAK,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,4BAA4B,CAAC;AAIpC,MAAM,kBAAkB,GAAG,GAAG,CAAC;AAQ/B,MAAM,UAAU,YAAY,CAAC,EAAE,MAAM,EAAE,IAAI,EAAqB;IAC9D,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEzC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC;QAC9B,IAAI,CAAC,SAAS;YAAE,OAAO;QACvB,IAAI,QAAQ,GAAG,KAAK,CAAC;QACrB,IAAI,UAAU,GAAkB,IAAI,CAAC;QACrC,IAAI,WAAsD,CAAC;QAE3D,4EAA4E;QAC5E,4EAA4E;QAC5E,2BAA2B;QAC3B,MAAM,MAAM,GAAG,CAAC,IAAY,EAAE,QAAgB,EAAU,EAAE;YACxD,MAAM,CAAC,GAAG,gBAAgB,CAAC,SAAS,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC;YACpE,OAAO,CAAC,IAAI,QAAQ,CAAC;QACvB,CAAC,CAAC;QACF,MAAM,IAAI,GAAG,IAAI,KAAK,CAAC;YACrB,UAAU,EAAE,uDAAuD;YACnE,QAAQ,EAAE,EAAE;YACZ,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI;YAChB,KAAK,EAAE;gBACL,UAAU,EAAE,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC;gBACxC,UAAU,EAAE,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC;gBACxC,MAAM,EAAE,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC;aACzC;SACF,CAAC,CAAC;QACH,MAAM,GAAG,GAAG,IAAI,QAAQ,EAAE,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;QACpB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAErB,4EAA4E;QAC5E,MAAM,MAAM,GAAG,GAAY,EAAE;YAC3B,IAAI,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;gBAAE,OAAO,KAAK,CAAC;YAC5C,MAAM,EAAE,GAAG,MAAM,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC;YAC9C,OAAO,EAAE,CAAC,OAAO,KAAK,MAAM,IAAI,SAAS,CAAC,WAAW,GAAG,CAAC,IAAI,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC;QAC1F,CAAC,CAAC;QACF,MAAM,SAAS,GAAG,GAAS,EAAE;YAC3B,IAAI,MAAM,EAAE,EAAE,CAAC;gBACb,IAAI,CAAC;oBACH,GAAG,CAAC,GAAG,EAAE,CAAC;gBACZ,CAAC;gBAAC,MAAM,CAAC;oBACP,0BAA0B;gBAC5B,CAAC;YACH,CAAC;QACH,CAAC,CAAC;QACF,SAAS,EAAE,CAAC;QAEZ,kDAAkD;QAClD,KAAK,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE;YACzD,IAAI,QAAQ,EAAE,CAAC;gBACb,MAAM,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;gBACzB,OAAO;YACT,CAAC;YACD,UAAU,GAAG,EAAE,CAAC;QAClB,CAAC,CAAC,CAAC;QAEH,MAAM,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE;YACrD,IAAI,EAAE,KAAK,UAAU;gBAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC1C,CAAC,CAAC,CAAC;QACH,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,IAAY,EAAE,EAAE;YAC1C,IAAI,UAAU;gBAAE,MAAM,CAAC,iBAAiB,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;YACvC,qBAAqB,CAAC,GAAG,EAAE;gBACzB,SAAS,EAAE,CAAC;gBACZ,IAAI,WAAW;oBAAE,OAAO;gBACxB,WAAW,GAAG,UAAU,CAAC,GAAG,EAAE;oBAC5B,WAAW,GAAG,SAAS,CAAC;oBACxB,IAAI,UAAU,IAAI,MAAM,EAAE;wBAAE,MAAM,CAAC,cAAc,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;gBACtF,CAAC,EAAE,kBAAkB,CAAC,CAAC;YACzB,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAE5B,OAAO,GAAG,EAAE;YACV,QAAQ,GAAG,IAAI,CAAC;YAChB,IAAI,WAAW;gBAAE,YAAY,CAAC,WAAW,CAAC,CAAC;YAC3C,QAAQ,CAAC,UAAU,EAAE,CAAC;YACtB,SAAS,EAAE,CAAC;YACZ,MAAM,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,UAAU;gBAAE,MAAM,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;YACjD,IAAI,CAAC,OAAO,EAAE,CAAC;QACjB,CAAC,CAAC;QACF,4EAA4E;QAC5E,sCAAsC;IACxC,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC;IAEnB,OAAO,cAAK,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,GAAI,CAAC;AACnF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chances-ai/client",
-  "version": "24.3.0",
+  "version": "25.0.0",
   "type": "module",
   "main": "./dist/client-core/index.js",
   "types": "./dist/client-core/index.d.ts",
@@ -18,14 +18,18 @@
     "dist"
   ],
   "dependencies": {
-    "@chances-ai/design-system": "24.3.0",
-    "@chances-ai/wire": "24.3.0",
-    "@chances-ai/runtime": "24.3.0",
-    "@chances-ai/ui-core": "24.3.0",
+    "@chances-ai/design-system": "25.0.0",
+    "@chances-ai/wire": "25.0.0",
+    "@chances-ai/runtime": "25.0.0",
+    "@chances-ai/ui-core": "25.0.0",
     "zustand": "^5.0.0"
   },
   "peerDependencies": {
     "@heroui/react": "^3.1.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@xterm/addon-fit": "^0.10.0",
+    "@xterm/xterm": "^5.5.0",
+    "monaco-editor": "^0.52.2",
     "react": "^19.2",
     "react-dom": "^19.2"
   },
@@ -33,6 +37,18 @@
     "@heroui/react": {
       "optional": true
     },
+    "@monaco-editor/react": {
+      "optional": true
+    },
+    "@xterm/addon-fit": {
+      "optional": true
+    },
+    "@xterm/xterm": {
+      "optional": true
+    },
+    "monaco-editor": {
+      "optional": true
+    },
     "react": {
       "optional": true
     },
@@ -43,9 +59,13 @@
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.9.0",
     "@heroui/react": "^3.1.0",
+    "@monaco-editor/react": "^4.7.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
+    "@xterm/addon-fit": "^0.10.0",
+    "@xterm/xterm": "^5.5.0",
+    "monaco-editor": "^0.52.2",
     "react": "^19.2",
     "react-dom": "^19.2"
   },