@blorkfield/overlay-core 0.11.2 → 0.11.3

package/dist/index.d.cts

@@ -609,6 +609,14 @@ declare class OverlayScene {
     private handleMouseUp;
     /** Handle canvas clicks for click-to-fall behavior */
     private handleCanvasClick;
+    /** Shared tap logic for mouse click and touch tap */
+    private handleTap;
+    /** Handle touch start — single finger grabs, multi-finger passes through for scroll/zoom */
+    private handleTouchStart;
+    /** Handle touch move — only tracks if something is grabbed */
+    private handleTouchMove;
+    /** Handle touch end/cancel — release grab; if it was a tap (no grab), trigger click-to-fall */
+    private handleTouchEnd;
     /**
      * Handler for Matter.js beforeRender event.
      * Draws base background layers (color + image) before physics objects.

package/dist/index.d.ts

@@ -609,6 +609,14 @@ declare class OverlayScene {
     private handleMouseUp;
     /** Handle canvas clicks for click-to-fall behavior */
     private handleCanvasClick;
+    /** Shared tap logic for mouse click and touch tap */
+    private handleTap;
+    /** Handle touch start — single finger grabs, multi-finger passes through for scroll/zoom */
+    private handleTouchStart;
+    /** Handle touch move — only tracks if something is grabbed */
+    private handleTouchMove;
+    /** Handle touch end/cancel — release grab; if it was a tap (no grab), trigger click-to-fall */
+    private handleTouchEnd;
     /**
      * Handler for Matter.js beforeRender event.
      * Draws base background layers (color + image) before physics objects.

package/dist/index.js

@@ -1470,6 +1470,10 @@ var OverlayScene = class {
       const rect = this.canvas.getBoundingClientRect();
       const x = event.clientX - rect.left;
       const y = event.clientY - rect.top;
+      this.handleTap(x, y);
+    };
+    /** Shared tap logic for mouse click and touch tap */
+    this.handleTap = (x, y) => {
       const bodies = Matter5.Query.point(
         Matter5.Composite.allBodies(this.engine.world),
         { x, y }
@@ -1487,6 +1491,42 @@ var OverlayScene = class {
         }
       }
     };
+    /** Handle touch start — single finger grabs, multi-finger passes through for scroll/zoom */
+    this.handleTouchStart = (event) => {
+      if (event.touches.length >= 2) return;
+      const touch = event.touches[0];
+      const rect = this.canvas.getBoundingClientRect();
+      const x = touch.clientX - rect.left;
+      const y = touch.clientY - rect.top;
+      this.followTargets.set("mouse", { x, y });
+      const grabbed = this.startGrab();
+      if (grabbed) event.preventDefault();
+    };
+    /** Handle touch move — only tracks if something is grabbed */
+    this.handleTouchMove = (event) => {
+      if (event.touches.length >= 2) return;
+      if (!this.grabbedObjectId) return;
+      event.preventDefault();
+      const touch = event.touches[0];
+      const rect = this.canvas.getBoundingClientRect();
+      const x = touch.clientX - rect.left;
+      const y = touch.clientY - rect.top;
+      this.followTargets.set("mouse", { x, y });
+    };
+    /** Handle touch end/cancel — release grab; if it was a tap (no grab), trigger click-to-fall */
+    this.handleTouchEnd = (event) => {
+      const wasGrabbed = this.grabbedObjectId !== null;
+      this.endGrab();
+      if (wasGrabbed) {
+        event.preventDefault();
+        return;
+      }
+      if (event.changedTouches.length > 0) {
+        const touch = event.changedTouches[0];
+        const rect = this.canvas.getBoundingClientRect();
+        this.handleTap(touch.clientX - rect.left, touch.clientY - rect.top);
+      }
+    };
     /**
      * Handler for Matter.js beforeRender event.
      * Draws base background layers (color + image) before physics objects.
@@ -1639,6 +1679,10 @@ var OverlayScene = class {
     canvas.addEventListener("mousemove", this.handleMouseMove);
     canvas.addEventListener("mouseup", this.handleMouseUp);
     canvas.addEventListener("click", this.handleCanvasClick);
+    canvas.addEventListener("touchstart", this.handleTouchStart, { passive: false });
+    canvas.addEventListener("touchmove", this.handleTouchMove, { passive: false });
+    canvas.addEventListener("touchend", this.handleTouchEnd, { passive: false });
+    canvas.addEventListener("touchcancel", this.handleTouchEnd, { passive: false });
     this.effectManager = new EffectManager(
       this.config.bounds,
       (cfg) => this.spawnObjectAsync(cfg),
@@ -2063,6 +2107,10 @@ var OverlayScene = class {
     this.canvas.removeEventListener("mousemove", this.handleMouseMove);
     this.canvas.removeEventListener("mouseup", this.handleMouseUp);
     this.canvas.removeEventListener("click", this.handleCanvasClick);
+    this.canvas.removeEventListener("touchstart", this.handleTouchStart);
+    this.canvas.removeEventListener("touchmove", this.handleTouchMove);
+    this.canvas.removeEventListener("touchend", this.handleTouchEnd);
+    this.canvas.removeEventListener("touchcancel", this.handleTouchEnd);
     Matter5.Events.off(this.render, "beforeRender", this.handleBeforeRender);
     Matter5.Events.off(this.render, "afterRender", this.handleAfterRender);
     Matter5.Events.off(this.engine, "collisionStart", this.handleCollisionStart);