@number10/jsx-phaser 5.0.0

package/dist/gestures/gesture-manager.js

@@ -0,0 +1,773 @@
+import "phaser";
+import { DEFAULT_GESTURE_CONFIG } from "./gesture-types.js";
+class GestureManager {
+  scene;
+  containers = /* @__PURE__ */ new Map();
+  // Track pointer positions for delta calculation
+  lastPointerPositions = /* @__PURE__ */ new Map();
+  // Track active pointer down for touch detection
+  activePointerDown = null;
+  // Track which containers were hit during pointer down (for move event filtering)
+  activeContainersForMove = /* @__PURE__ */ new Map();
+  // Track hover state for each container (desktop/mouse only)
+  hoveredContainers = /* @__PURE__ */ new Map();
+  // Track pending setTimeout timers for cleanup
+  pendingTimeouts = /* @__PURE__ */ new Set();
+  isInitialized = false;
+  isDestroyed = false;
+  constructor(scene) {
+    this.scene = scene;
+  }
+  /**
+   * Initialize global event listeners (called once per scene)
+   */
+  initialize() {
+    if (this.isInitialized) return;
+    this.isInitialized = true;
+    this.scene.input.on("pointerdown", this.handlePointerDown, this);
+    this.scene.input.on("pointerup", this.handlePointerUp, this);
+    this.scene.input.on("pointermove", this.handlePointerMove, this);
+    this.handleGlobalPointerUp = this.handleGlobalPointerUp.bind(this);
+    window.addEventListener("mouseup", this.handleGlobalPointerUp);
+    window.addEventListener("touchend", this.handleGlobalPointerUp);
+    this.handleWheel = this.handleWheel.bind(this);
+    window.addEventListener("wheel", this.handleWheel, { passive: false });
+    this.scene.events.once("shutdown", this.destroy, this);
+  }
+  /**
+   * Register a container for gesture tracking
+   * @param container - Container to track
+   * @param callbacks - Gesture event callbacks
+   * @param hitArea - Interactive hit area
+   * @param config - Gesture configuration
+   */
+  registerContainer(container, callbacks, hitArea, config = {}) {
+    this.initialize();
+    const state = {
+      container,
+      callbacks,
+      config: { ...DEFAULT_GESTURE_CONFIG, ...config },
+      hitArea
+    };
+    this.containers.set(container, state);
+    container.once("destroy", () => {
+      this.unregisterContainer(container);
+    });
+  }
+  /**
+   * Unregister a container
+   * @param container - Container to remove
+   */
+  unregisterContainer(container) {
+    const state = this.containers.get(container);
+    if (!state) return;
+    if (state.longPressTimer) {
+      clearTimeout(state.longPressTimer);
+    }
+    this.containers.delete(container);
+    if (this.activePointerDown?.container === container) {
+      this.activePointerDown = null;
+    }
+    this.hoveredContainers.delete(container);
+    for (const hitContainers of this.activeContainersForMove.values()) {
+      hitContainers.delete(container);
+    }
+  }
+  /**
+   * Check if a container is registered
+   * @param container - Container to check
+   * @returns True if container is registered
+   */
+  hasContainer(container) {
+    return this.containers.has(container);
+  }
+  /**
+   * Create a gesture event data object with propagation control
+   * @param pointer - Phaser pointer
+   * @param localX - Local X coordinate
+   * @param localY - Local Y coordinate
+   * @param width - Hit area width
+   * @param height - Hit area height
+   * @param options - Optional additional data (dx, dy, isInside, state)
+   * @returns Event data with stopPropagation support
+   */
+  createEventData(pointer, localX, localY, width, height, options = {}) {
+    let propagationStopped = false;
+    return {
+      pointer,
+      localX,
+      localY,
+      width,
+      height,
+      ...options,
+      stopPropagation() {
+        propagationStopped = true;
+      },
+      isPropagationStopped() {
+        return propagationStopped;
+      }
+    };
+  }
+  /**
+   * Get effective depth considering entire parent hierarchy
+   * @param container - Container to calculate depth for
+   * @returns Accumulated depth from container and all parents
+   */
+  getEffectiveDepth(container) {
+    let depth = container.depth;
+    let parent = container.parentContainer;
+    while (parent) {
+      depth += parent.depth;
+      parent = parent.parentContainer;
+    }
+    return depth;
+  }
+  /**
+   * Get surface zIndex from container hierarchy.
+   * Walks up to find the topmost container with __surfaceZIndex.
+   * The topmost marker wins so portal roots can lift all descendants above scene roots.
+   *
+   * @param container - Container to check
+   * @returns Surface zIndex or 0 if none found
+   */
+  getSurfaceZIndex(container) {
+    let current = container;
+    let zIndex = 0;
+    while (current) {
+      const surfaceZIndex = current.__surfaceZIndex;
+      if (surfaceZIndex !== void 0) {
+        zIndex = surfaceZIndex;
+      }
+      current = current.parentContainer;
+    }
+    return zIndex;
+  }
+  isAncestorOf(ancestor, descendant) {
+    let current = descendant.parentContainer;
+    while (current) {
+      if (current === ancestor) {
+        return true;
+      }
+      current = current.parentContainer;
+    }
+    return false;
+  }
+  compareContainers(a, b) {
+    const containerA = a.state.container;
+    const containerB = b.state.container;
+    const rootZIndexA = this.getSurfaceZIndex(containerA);
+    const rootZIndexB = this.getSurfaceZIndex(containerB);
+    if (rootZIndexA !== rootZIndexB) {
+      return rootZIndexB - rootZIndexA;
+    }
+    const depthA = this.getEffectiveDepth(containerA);
+    const depthB = this.getEffectiveDepth(containerB);
+    if (depthA !== depthB) {
+      return depthB - depthA;
+    }
+    if (this.isAncestorOf(containerA, containerB)) {
+      return 1;
+    }
+    if (this.isAncestorOf(containerB, containerA)) {
+      return -1;
+    }
+    if (containerA.parentContainer === containerB.parentContainer && containerA.parentContainer) {
+      const indexA = containerA.parentContainer.getIndex(containerA);
+      const indexB = containerA.parentContainer.getIndex(containerB);
+      const diff = indexB - indexA;
+      if (diff !== 0) return diff;
+    }
+    return b.originalIndex - a.originalIndex;
+  }
+  /**
+   * Bubble an event through overlapping containers
+   * Iterates all containers at pointer position and calls handler until stopPropagation
+   * Sorts containers by their actual display list order (z-index) to respect visual stacking
+   * @param pointer - The pointer that triggered the event
+   * @param eventType - Type of event for filtering callbacks
+   * @param handler - Function to call for each container, returns true if propagation stopped
+   * @param filterSet - Optional set of containers to limit bubbling to (for move events)
+   * @param skipContainerCheck - Skip the isPointerInContainer check (for final move events)
+   */
+  bubbleEvent(pointer, eventType, handler, filterSet, skipContainerCheck = false) {
+    const containersArray = Array.from(this.containers.values()).map((state, originalIndex) => ({
+      state,
+      originalIndex
+    }));
+    containersArray.sort((a, b) => this.compareContainers(a, b));
+    for (const { state } of containersArray) {
+      if (!state.callbacks[eventType]) continue;
+      if (filterSet && !filterSet.has(state.container)) continue;
+      if (!skipContainerCheck && !this.isPointerInContainer(pointer, state)) continue;
+      const localPos = this.getLocalPosition(pointer, state.container);
+      const stopped = handler(state, localPos);
+      if (stopped) break;
+    }
+  }
+  /**
+   * Update hit area for a container
+   * @param container - Container to update
+   * @param hitArea - New hit area
+   */
+  updateHitArea(container, hitArea) {
+    const state = this.containers.get(container);
+    if (state) {
+      state.hitArea = hitArea;
+    }
+  }
+  /**
+   * Update callbacks for a container
+   * @param container - Container to update
+   * @param callbacks - New callbacks
+   */
+  updateCallbacks(container, callbacks) {
+    const state = this.containers.get(container);
+    if (state) {
+      state.callbacks = callbacks;
+    }
+  }
+  /**
+   * Handle global pointer down event
+   * Registers all containers that were hit for move event tracking
+   * Only the topmost gets touch/long-press callbacks
+   */
+  handlePointerDown(pointer) {
+    const hitContainers = /* @__PURE__ */ new Set();
+    const containersArray = Array.from(this.containers.values()).map((state, originalIndex) => ({
+      state,
+      originalIndex
+    }));
+    containersArray.sort((a, b) => this.compareContainers(a, b));
+    let isFirstHit = true;
+    let topmostTouchContainer;
+    let topmostLongPressContainer;
+    let topmostDoubleTapContainer;
+    const pointerDownTime = Date.now();
+    for (const { state } of containersArray) {
+      const isHit = this.isPointerInContainer(pointer, state);
+      if (isHit) {
+        hitContainers.add(state.container);
+        if (!topmostTouchContainer && state.callbacks.onTouch) {
+          topmostTouchContainer = state.container;
+          state.pointerDownTime = pointerDownTime;
+          state.longPressTriggered = false;
+        }
+        if (!topmostLongPressContainer && state.callbacks.onLongPress) {
+          topmostLongPressContainer = state.container;
+          state.pointerDownTime = pointerDownTime;
+          state.longPressTriggered = false;
+        }
+        if (!topmostDoubleTapContainer && state.callbacks.onDoubleTap) {
+          topmostDoubleTapContainer = state.container;
+          state.pointerDownTime = pointerDownTime;
+          state.longPressTriggered = false;
+        }
+        if (isFirstHit) {
+          isFirstHit = false;
+          this.activePointerDown = {
+            pointerId: pointer.id,
+            container: state.container,
+            startX: pointer.worldX,
+            startY: pointer.worldY
+          };
+          if (topmostTouchContainer) {
+            this.activePointerDown.touchContainer = topmostTouchContainer;
+          }
+          if (topmostLongPressContainer) {
+            this.activePointerDown.longPressContainer = topmostLongPressContainer;
+          }
+          if (topmostDoubleTapContainer) {
+            this.activePointerDown.doubleTapContainer = topmostDoubleTapContainer;
+          }
+          state.pointerDownPosition = { x: pointer.worldX, y: pointer.worldY };
+        }
+      }
+    }
+    if (this.activePointerDown) {
+      if (topmostTouchContainer) {
+        this.activePointerDown.touchContainer = topmostTouchContainer;
+      }
+      if (topmostLongPressContainer) {
+        this.activePointerDown.longPressContainer = topmostLongPressContainer;
+      }
+      if (topmostDoubleTapContainer) {
+        this.activePointerDown.doubleTapContainer = topmostDoubleTapContainer;
+      }
+    }
+    if (topmostLongPressContainer) {
+      const longPressState = this.containers.get(topmostLongPressContainer);
+      if (longPressState?.callbacks.onLongPress) {
+        const localPos = this.getLocalPosition(pointer, longPressState.container);
+        longPressState.longPressTimer = setTimeout(() => {
+          if (this.activePointerDown?.longPressContainer === longPressState.container) {
+            const isInside = this.isPointerInContainer(pointer, longPressState);
+            const data = this.createEventData(
+              pointer,
+              localPos.x,
+              localPos.y,
+              longPressState.hitArea.width,
+              longPressState.hitArea.height,
+              { isInside }
+            );
+            longPressState.callbacks.onLongPress?.(data);
+            longPressState.longPressTriggered = true;
+          }
+        }, longPressState.config.longPressDuration);
+      }
+    }
+    if (hitContainers.size > 0) {
+      this.activeContainersForMove.set(pointer.id, hitContainers);
+      this.bubbleEvent(
+        pointer,
+        "onTouchMove",
+        (targetState, targetLocalPos) => {
+          const isInside = this.isPointerInContainer(pointer, targetState);
+          const data = this.createEventData(
+            pointer,
+            targetLocalPos.x,
+            targetLocalPos.y,
+            targetState.hitArea.width,
+            targetState.hitArea.height,
+            { dx: 0, dy: 0, isInside, state: "start" }
+          );
+          targetState.callbacks.onTouchMove?.(data);
+          targetState.isFirstMove = false;
+          return data.isPropagationStopped();
+        },
+        hitContainers
+      );
+    }
+  }
+  /**
+   * Handle global pointer up event
+   */
+  handlePointerUp(pointer) {
+    if (!this.activePointerDown || this.activePointerDown.pointerId !== pointer.id) {
+      return;
+    }
+    const activeState = this.containers.get(this.activePointerDown.container);
+    if (!activeState) {
+      this.activePointerDown = null;
+      return;
+    }
+    const touchState = this.activePointerDown.touchContainer && this.containers.get(this.activePointerDown.touchContainer) || activeState;
+    const longPressState = this.activePointerDown.longPressContainer && this.containers.get(this.activePointerDown.longPressContainer);
+    const doubleTapState = this.activePointerDown.doubleTapContainer && this.containers.get(this.activePointerDown.doubleTapContainer);
+    if (longPressState?.longPressTimer) {
+      clearTimeout(longPressState.longPressTimer);
+      longPressState.longPressTimer = void 0;
+    }
+    const now = Date.now();
+    const touchDuration = touchState.pointerDownTime ? now - touchState.pointerDownTime : 0;
+    const isTouchTooLong = touchDuration > touchState.config.maxTouchDuration;
+    const longPressWasTriggered = !!touchState.longPressTriggered || !!longPressState?.longPressTriggered;
+    const last = this.lastPointerPositions.get(pointer.id);
+    const dx = last ? pointer.worldX - last.x : 0;
+    const dy = last ? pointer.worldY - last.y : 0;
+    const hitContainers = this.activeContainersForMove.get(pointer.id);
+    this.bubbleEvent(
+      pointer,
+      "onTouchMove",
+      (targetState, targetLocalPos) => {
+        const isInside = this.isPointerInContainer(pointer, targetState);
+        const finalMoveData = this.createEventData(
+          pointer,
+          targetLocalPos.x,
+          targetLocalPos.y,
+          targetState.hitArea.width,
+          targetState.hitArea.height,
+          { dx, dy, isInside, state: "end" }
+        );
+        targetState.callbacks.onTouchMove?.(finalMoveData);
+        targetState.isFirstMove = void 0;
+        return finalMoveData.isPropagationStopped();
+      },
+      hitContainers,
+      true
+      // Skip container check for final move event
+    );
+    const isInsideTouchTarget = this.isPointerInContainer(pointer, touchState);
+    if (isInsideTouchTarget) {
+      const shouldFireTouch = !longPressWasTriggered && !isTouchTooLong;
+      if (touchState.callbacks.onTouch && shouldFireTouch) {
+        this.bubbleEvent(pointer, "onTouch", (targetState, targetLocalPos) => {
+          const isInside = this.isPointerInContainer(pointer, targetState);
+          const data = this.createEventData(
+            pointer,
+            targetLocalPos.x,
+            targetLocalPos.y,
+            targetState.hitArea.width,
+            targetState.hitArea.height,
+            { isInside }
+          );
+          targetState.callbacks.onTouch?.(data);
+          return data.isPropagationStopped();
+        });
+      }
+      if (doubleTapState && shouldFireTouch && this.isPointerInContainer(pointer, doubleTapState)) {
+        const timeSinceLastTap = doubleTapState.lastTapTime ? now - doubleTapState.lastTapTime : Infinity;
+        if (timeSinceLastTap <= doubleTapState.config.doubleTapDelay) {
+          this.bubbleEvent(pointer, "onDoubleTap", (targetState, targetLocalPos) => {
+            const isInside = this.isPointerInContainer(pointer, targetState);
+            const data = this.createEventData(
+              pointer,
+              targetLocalPos.x,
+              targetLocalPos.y,
+              targetState.hitArea.width,
+              targetState.hitArea.height,
+              { isInside }
+            );
+            targetState.callbacks.onDoubleTap?.(data);
+            return data.isPropagationStopped();
+          });
+          doubleTapState.lastTapTime = void 0;
+        } else {
+          doubleTapState.lastTapTime = now;
+        }
+      }
+    }
+    for (const [container, containerState] of this.containers) {
+      if (!containerState.callbacks.onTouchOutside) continue;
+      const isInsideContainer = this.isPointerInContainer(pointer, containerState);
+      if (isInsideContainer) continue;
+      const localPos = this.getLocalPosition(pointer, container);
+      const data = this.createEventData(
+        pointer,
+        localPos.x,
+        localPos.y,
+        containerState.hitArea.width,
+        containerState.hitArea.height,
+        { isInside: false }
+      );
+      containerState.callbacks.onTouchOutside(data);
+    }
+    touchState.longPressTriggered = false;
+    touchState.pointerDownTime = void 0;
+    if (longPressState && longPressState !== touchState) {
+      longPressState.longPressTriggered = false;
+      longPressState.pointerDownTime = void 0;
+    }
+    if (doubleTapState && doubleTapState !== touchState && doubleTapState !== longPressState) {
+      doubleTapState.longPressTriggered = false;
+      doubleTapState.pointerDownTime = void 0;
+    }
+    this.activePointerDown = null;
+    activeState.pointerDownPosition = void 0;
+    this.activeContainersForMove.delete(pointer.id);
+  }
+  /**
+   * Handle pointer up outside canvas (global window events)
+   * Ensures touch move 'end' state is sent even when pointer released outside
+   * Also handles onTouchOutside for ALL containers
+   */
+  handleGlobalPointerUp(_event) {
+    const timerId = window.setTimeout(() => {
+      this.pendingTimeouts.delete(timerId);
+      if (this.isDestroyed || !this.scene || !this.scene.input) {
+        return;
+      }
+      let pointer = null;
+      try {
+        pointer = this.scene.input.activePointer;
+      } catch (error) {
+        return;
+      }
+      if (!pointer) {
+        return;
+      }
+      for (const state2 of this.containers.values()) {
+        if (!state2.callbacks.onTouchOutside) continue;
+        const isInside = this.isPointerInContainer(pointer, state2);
+        if (isInside) continue;
+        const touchDuration = state2.pointerDownTime ? Date.now() - state2.pointerDownTime : 0;
+        const isTouchTooLong = touchDuration > state2.config.maxTouchDuration;
+        const shouldFire = !state2.longPressTriggered && !isTouchTooLong;
+        if (shouldFire) {
+          const localPos = this.getLocalPosition(pointer, state2.container);
+          const data = this.createEventData(
+            pointer,
+            localPos.x,
+            localPos.y,
+            state2.hitArea.width,
+            state2.hitArea.height,
+            { isInside: false }
+          );
+          state2.callbacks.onTouchOutside?.(data);
+        }
+      }
+      if (!this.activePointerDown) return;
+      const state = this.containers.get(this.activePointerDown.container);
+      if (!state) {
+        this.activePointerDown = null;
+        return;
+      }
+      if (state.longPressTimer) {
+        clearTimeout(state.longPressTimer);
+        state.longPressTimer = void 0;
+      }
+      const last = this.lastPointerPositions.get(pointer.id);
+      const dx = last ? pointer.worldX - last.x : 0;
+      const dy = last ? pointer.worldY - last.y : 0;
+      const hitContainers = this.activeContainersForMove.get(pointer.id);
+      this.bubbleEvent(
+        pointer,
+        "onTouchMove",
+        (targetState, targetLocalPos) => {
+          const finalMoveData = this.createEventData(
+            pointer,
+            targetLocalPos.x,
+            targetLocalPos.y,
+            targetState.hitArea.width,
+            targetState.hitArea.height,
+            { dx, dy, isInside: false, state: "end" }
+          );
+          targetState.callbacks.onTouchMove?.(finalMoveData);
+          targetState.isFirstMove = void 0;
+          return finalMoveData.isPropagationStopped();
+        },
+        hitContainers,
+        true
+        // Skip container check for final move event
+      );
+      state.longPressTriggered = false;
+      state.pointerDownTime = void 0;
+      this.activePointerDown = null;
+      state.pointerDownPosition = void 0;
+      this.activeContainersForMove.delete(pointer.id);
+    }, 0);
+    this.pendingTimeouts.add(timerId);
+  }
+  /**
+   * Handle global pointer move event
+   * Detects hover state changes and notifies containers with onHoverStart/onHoverEnd
+   * Only notifies containers that were hit during pointer down for onTouchMove
+   * Bubbles through them until stopPropagation() is called
+   */
+  handlePointerMove(pointer) {
+    const last = this.lastPointerPositions.get(pointer.id);
+    const dx = last ? pointer.worldX - last.x : 0;
+    const dy = last ? pointer.worldY - last.y : 0;
+    this.lastPointerPositions.set(pointer.id, { x: pointer.worldX, y: pointer.worldY });
+    this.detectHoverChanges(pointer);
+    if (!this.activePointerDown || pointer.id !== this.activePointerDown.pointerId) {
+      return;
+    }
+    const hitContainers = this.activeContainersForMove.get(pointer.id);
+    if (!hitContainers) return;
+    const containersArray = Array.from(this.containers.values()).map((state, originalIndex) => ({
+      state,
+      originalIndex
+    }));
+    containersArray.sort((a, b) => this.compareContainers(a, b));
+    for (const { state } of containersArray) {
+      if (!state.callbacks.onTouchMove) continue;
+      if (!hitContainers.has(state.container)) continue;
+      const localPos = this.getLocalPosition(pointer, state.container);
+      const isInside = this.isPointerInContainer(pointer, state);
+      const moveState = state.isFirstMove === void 0 ? "start" : "move";
+      if (state.isFirstMove === void 0) {
+        state.isFirstMove = false;
+      }
+      const data = this.createEventData(
+        pointer,
+        localPos.x,
+        localPos.y,
+        state.hitArea.width,
+        state.hitArea.height,
+        { dx, dy, isInside, state: moveState }
+      );
+      state.callbacks.onTouchMove(data);
+      if (data.isPropagationStopped()) break;
+    }
+  }
+  /**
+   * Check if pointer is within a container's hit area
+   * Also checks parent visibility chain to handle collapsed accordions,
+   * and ancestor overflow clip regions to prevent clipped-out children
+   * from consuming pointer events outside their visible area.
+   */
+  isPointerInContainer(pointer, state) {
+    const container = state.container;
+    if (!container.visible || container.alpha === 0) return false;
+    let parent = container.parentContainer;
+    while (parent) {
+      if (!parent.visible || parent.alpha === 0) return false;
+      parent = parent.parentContainer;
+    }
+    let clipAncestor = container.parentContainer;
+    while (clipAncestor) {
+      const ext = clipAncestor;
+      if (ext.__layoutProps?.overflow === "hidden" && ext.__getLayoutSize) {
+        const clipSize = ext.__getLayoutSize();
+        const clipLocal = this.getLocalPosition(pointer, clipAncestor);
+        if (clipLocal.x < 0 || clipLocal.y < 0 || clipLocal.x > clipSize.width || clipLocal.y > clipSize.height) {
+          return false;
+        }
+      }
+      clipAncestor = clipAncestor.parentContainer;
+    }
+    const localPos = this.getLocalPosition(pointer, container);
+    return state.hitArea.contains(localPos.x, localPos.y);
+  }
+  /**
+   * Convert global pointer position to container local coordinates
+   */
+  getLocalPosition(pointer, container) {
+    const matrix = container.getWorldTransformMatrix();
+    const inverseMatrix = matrix.invert();
+    const localPos = inverseMatrix.transformPoint(pointer.worldX, pointer.worldY);
+    return { x: localPos.x, y: localPos.y };
+  }
+  /**
+   * Detect hover state changes for all containers (desktop/mouse only)
+   * Called on every pointer move to update hover state
+   */
+  detectHoverChanges(pointer) {
+    for (const [container, state] of this.containers) {
+      if (!state.callbacks.onHoverStart && !state.callbacks.onHoverEnd) {
+        continue;
+      }
+      if (!container.active) continue;
+      const isInside = this.isPointerInContainer(pointer, state);
+      const wasInside = this.hoveredContainers.get(container) ?? false;
+      if (isInside && !wasInside) {
+        this.hoveredContainers.set(container, true);
+        if (state.callbacks.onHoverStart) {
+          const eventData = this.createHoverEventData(pointer, container, state.hitArea);
+          state.callbacks.onHoverStart(eventData);
+        }
+      }
+      if (!isInside && wasInside) {
+        this.hoveredContainers.set(container, false);
+        if (state.callbacks.onHoverEnd) {
+          const eventData = this.createHoverEventData(pointer, container, state.hitArea);
+          state.callbacks.onHoverEnd(eventData);
+        }
+      }
+    }
+  }
+  /**
+   * Create hover event data
+   */
+  createHoverEventData(pointer, container, hitArea) {
+    const localPos = this.getLocalPosition(pointer, container);
+    let propagationStopped = false;
+    return {
+      pointer,
+      localX: localPos.x,
+      localY: localPos.y,
+      width: hitArea.width,
+      height: hitArea.height,
+      stopPropagation: () => {
+        propagationStopped = true;
+      },
+      isPropagationStopped: () => propagationStopped
+    };
+  }
+  /**
+   * Handle mouse wheel event
+   * Bubbles to all containers under the pointer
+   */
+  handleWheel(event) {
+    if (this.isDestroyed || !this.scene || !this.scene.input) {
+      return;
+    }
+    let pointer = null;
+    try {
+      pointer = this.scene.input.activePointer;
+    } catch (error) {
+      return;
+    }
+    if (!pointer) return;
+    const canvas = this.scene.game.canvas;
+    const rect = canvas.getBoundingClientRect();
+    const scaleX = canvas.width / rect.width;
+    const scaleY = canvas.height / rect.height;
+    pointer.x = (event.clientX - rect.left) * scaleX;
+    pointer.y = (event.clientY - rect.top) * scaleY;
+    pointer.updateWorldPoint(pointer.camera ?? this.scene.cameras.main);
+    const containersUnderPointer = [];
+    Array.from(this.containers.values()).forEach((state, originalIndex) => {
+      if (!state.callbacks.onWheel) return;
+      const isInside = this.isPointerInContainer(pointer, state);
+      if (isInside) {
+        containersUnderPointer.push({ state, originalIndex });
+      }
+    });
+    containersUnderPointer.sort((a, b) => this.compareContainers(a, b));
+    for (const { state } of containersUnderPointer) {
+      const localPos = this.getLocalPosition(pointer, state.container);
+      let propagationStopped = false;
+      const wheelData = {
+        pointer,
+        localX: localPos.x,
+        localY: localPos.y,
+        deltaX: event.deltaX,
+        deltaY: event.deltaY,
+        deltaZ: event.deltaZ,
+        deltaMode: event.deltaMode,
+        width: state.hitArea.width,
+        height: state.hitArea.height,
+        originalEvent: event,
+        stopPropagation: () => {
+          propagationStopped = true;
+        },
+        isPropagationStopped: () => propagationStopped,
+        preventDefault: () => {
+          event.preventDefault();
+        }
+      };
+      state.callbacks.onWheel?.(wheelData);
+      if (propagationStopped) break;
+    }
+  }
+  /**
+   * Cleanup all resources
+   */
+  destroy() {
+    console.log("[GestureManager] destroy() called", {
+      pendingTimeouts: this.pendingTimeouts.size,
+      containers: this.containers.size
+    });
+    this.isDestroyed = true;
+    for (const timerId of this.pendingTimeouts) {
+      clearTimeout(timerId);
+    }
+    this.pendingTimeouts.clear();
+    for (const state of this.containers.values()) {
+      if (state.longPressTimer) {
+        clearTimeout(state.longPressTimer);
+      }
+    }
+    this.containers.clear();
+    this.lastPointerPositions.clear();
+    this.activePointerDown = null;
+    this.hoveredContainers.clear();
+    if (this.isInitialized) {
+      this.scene.input.off("pointerdown", this.handlePointerDown, this);
+      this.scene.input.off("pointerup", this.handlePointerUp, this);
+      this.scene.input.off("pointermove", this.handlePointerMove, this);
+      window.removeEventListener("mouseup", this.handleGlobalPointerUp);
+      window.removeEventListener("touchend", this.handleGlobalPointerUp);
+      window.removeEventListener("wheel", this.handleWheel);
+    }
+    this.isInitialized = false;
+  }
+}
+function getGestureManager(scene) {
+  if (!scene || !scene.data) {
+    throw new Error("getGestureManager: Invalid scene or scene.data is undefined");
+  }
+  const key = "__gestureManager__";
+  let manager = scene.data.get(key);
+  if (!manager) {
+    manager = new GestureManager(scene);
+    scene.data.set(key, manager);
+  }
+  return manager;
+}
+export {
+  GestureManager,
+  getGestureManager
+};
+//# sourceMappingURL=gesture-manager.js.map