replicas-computer 0.3.4 → 0.3.5

package/README.md

@@ -10,6 +10,7 @@ The versioned computer-use runtime for Replicas workspace images.
 - `src/pacer.ts` owns the per-viewer send budget: fresh media, NACK repairs and protective copies share one token bucket.
 - `src/rtp.ts` owns RTP continuity, keyframe detection, and frame reassembly for the socket fallback.
 - `src/stream-viewer.ts` owns the browser side: WebRTC playback, input routing, the WebSocket fallback, diagnostics and reconnects.
+- `src/input-bridge.ts` converts takeover input into desktop events, accumulating small trackpad movements while preserving full mouse-wheel steps.
 - `src/viewer.ts` owns the optional noVNC fallback.
 - `assets/desktop/start-services.sh` owns the X11 and stream process lifecycle.
 - `xsettingsd` broadcasts theme changes to running GTK apps and Chrome. Chrome follows the dashboard theme without reopening tabs; launch it without a `GTK_THEME` override.

package/dist/index.js

@@ -2937,7 +2937,7 @@ async function computerStatusCommand() {
 }
 
 // src/version.ts
-var COMPUTER_USE_VERSION = "0.3.4";
+var COMPUTER_USE_VERSION = "0.3.5";
 var COMPUTER_USE_PROTOCOL_VERSION = 1;
 
 // src/program.ts
@@ -3556,6 +3556,7 @@ function superviseEncoder(options) {
 
 // src/input-bridge.ts
 import { spawn as spawn4 } from "child_process";
+var scrollPixelsPerStep = 80;
 var namedKeys = {
   AltLeft: "Alt_L",
   AltRight: "Alt_R",
@@ -3615,6 +3616,8 @@ var InputBridge = class {
   pointerFlush;
   positionSequence = -1;
   actionId = 0;
+  scrollRemainder = 0;
+  scrollButton = 0;
   latestPosition;
   pressedButtons = /* @__PURE__ */ new Set();
   pressedKeys = /* @__PURE__ */ new Set();
@@ -3673,13 +3676,23 @@ var InputBridge = class {
     if (message.type === "wheel") {
       this.pointer = this.coordinates(message.x, message.y);
       this.flushPointer(true);
-      const vertical = Math.min(4, Math.max(1, Math.round(Math.abs(message.deltaY) / 80)));
-      const horizontal = Math.min(4, Math.max(1, Math.round(Math.abs(message.deltaX) / 80)));
-      if (Math.abs(message.deltaY) >= Math.abs(message.deltaX) && message.deltaY) {
-        for (let index = 0; index < vertical; index += 1) this.write(`mouseclick ${message.deltaY < 0 ? 4 : 5}`);
-      } else if (message.deltaX) {
-        for (let index = 0; index < horizontal; index += 1) this.write(`mouseclick ${message.deltaX < 0 ? 6 : 7}`);
+      const vertical = Math.abs(message.deltaY) >= Math.abs(message.deltaX);
+      const delta = vertical ? message.deltaY : message.deltaX;
+      if (!delta) return;
+      const button = vertical ? delta < 0 ? 4 : 5 : delta < 0 ? 6 : 7;
+      if (button !== this.scrollButton) this.scrollRemainder = 0;
+      this.scrollButton = button;
+      const distance = Math.abs(delta);
+      let steps;
+      if (distance >= scrollPixelsPerStep) {
+        steps = Math.min(4, Math.round(distance / scrollPixelsPerStep));
+        this.scrollRemainder = 0;
+      } else {
+        this.scrollRemainder += distance;
+        steps = Math.floor(this.scrollRemainder / scrollPixelsPerStep);
+        this.scrollRemainder %= scrollPixelsPerStep;
       }
+      for (let index = 0; index < steps; index += 1) this.write(`mouseclick ${button}`);
       return;
     }
     if (message.type === "key") {
@@ -3701,6 +3714,8 @@ var InputBridge = class {
     if (this.pointerFlush) clearImmediate(this.pointerFlush);
     this.pointerFlush = void 0;
     this.pointer = void 0;
+    this.scrollRemainder = 0;
+    this.scrollButton = 0;
     for (const button of this.pressedButtons) this.write(`mouseup ${button}`);
     for (const key of this.pressedKeys) this.write(`keyup ${key}`);
     this.pressedButtons.clear();

package/dist/stream-viewer.js

@@ -30,6 +30,12 @@ function validServerMessage(value) {
   }
 }
 
+// src/wheel.ts
+function wheelDeltaPixels(event, pageHeight) {
+  const scale = event.deltaMode === WheelEvent.DOM_DELTA_LINE ? 32 : event.deltaMode === WheelEvent.DOM_DELTA_PAGE ? pageHeight : 1;
+  return { deltaX: event.deltaX * scale, deltaY: event.deltaY * scale };
+}
+
 // ../shared/src/desktop-stream.ts
 var DEFAULT_STREAM_REQUEST = {
   transport: "webrtc",
@@ -611,7 +617,7 @@ screen.addEventListener("pointerup", (event) => {
 screen.addEventListener("pointercancel", () => send({ type: "release" }));
 screen.addEventListener("wheel", (event) => {
   event.preventDefault();
-  send({ type: "wheel", ...normalizedPointer(event), deltaX: event.deltaX, deltaY: event.deltaY });
+  send({ type: "wheel", ...normalizedPointer(event), ...wheelDeltaPixels(event, screen.clientHeight) });
 }, { passive: false });
 screen.addEventListener("contextmenu", (event) => event.preventDefault());
 window.addEventListener("keydown", (event) => {

package/dist/viewer.js

@@ -1,6 +1,14 @@
 // src/viewer.ts
 import RFB from "./core/rfb.js";
 import { encodings } from "./core/encodings.js";
+
+// src/wheel.ts
+function wheelDeltaPixels(event, pageHeight) {
+  const scale = event.deltaMode === WheelEvent.DOM_DELTA_LINE ? 32 : event.deltaMode === WheelEvent.DOM_DELTA_PAGE ? pageHeight : 1;
+  return { deltaX: event.deltaX * scale, deltaY: event.deltaY * scale };
+}
+
+// src/viewer.ts
 var screen = document.querySelector("#screen");
 var status = document.querySelector("#status");
 var statusText = document.querySelector("#status-text");
@@ -145,9 +153,9 @@ var shiftCanvasForWheel = (event) => {
   const canvas = screen.querySelector("canvas");
   const context = canvas?.getContext("2d");
   if (!canvas || !context || !canvas.width || !canvas.height) return;
-  const scale = event.deltaMode === WheelEvent.DOM_DELTA_LINE ? 32 : event.deltaMode === WheelEvent.DOM_DELTA_PAGE ? canvas.height : 1;
+  const { deltaY } = wheelDeltaPixels(event, canvas.height);
   const limit = Math.max(0, Math.min(optimisticScrollMax, canvas.height - 1));
-  const offset = Math.trunc(Math.max(-limit, Math.min(limit, event.deltaY * scale)));
+  const offset = Math.trunc(Math.max(-limit, Math.min(limit, deltaY)));
   if (offset > 0) {
     context.drawImage(canvas, 0, offset, canvas.width, canvas.height - offset, 0, 0, canvas.width, canvas.height - offset);
     context.drawImage(canvas, 0, canvas.height - offset - 1, canvas.width, 1, 0, canvas.height - offset, canvas.width, offset);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "replicas-computer",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "description": "Replicas workspace computer-use runtime",
   "type": "module",
   "main": "dist/index.js",