@omnipad/core 0.1.1-alpha.1 → 0.2.0-alpha.3

package/dist/index.mjs

@@ -117,7 +117,7 @@ var STANDARD_KEYS = {
 var KEYS = STANDARD_KEYS;
 
 // src/types/index.ts
-var TYPES = {
+var CMP_TYPES = {
   // --- Zones ---
   /** Area responsible for capturing touches and spawning dynamic widgets */
   INPUT_ZONE: "input-zone",
@@ -252,14 +252,17 @@ var applyAxialDeadzone = (v, threshold, max) => {
 };
 
 // src/utils/dom.ts
-var getDeepElement = (x, y) => {
-  let el = document.elementFromPoint(x, y);
-  while (el && el.shadowRoot) {
-    const nested = el.shadowRoot.elementFromPoint(x, y);
-    if (!nested || nested === el) break;
-    el = nested;
-  }
-  return el;
+var getDeepElement = (x, y, ignoreClass = "omnipad-target-zone") => {
+  const elements = document.elementsFromPoint(x, y);
+  let target = elements.find((el) => !el.classList.contains(ignoreClass));
+  if (!target) return null;
+  while (target && target.shadowRoot) {
+    const nestedElements = target.shadowRoot.elementsFromPoint(x, y);
+    const nestedTarget = nestedElements.find((el) => !el.classList.contains(ignoreClass));
+    if (!nestedTarget || nestedTarget === target) break;
+    target = nestedTarget;
+  }
+  return target;
 };
 var getDeepActiveElement = () => {
   let el = document.activeElement;
@@ -303,7 +306,7 @@ var dispatchPointerEventAtPos = (type, x, y, opts = {}) => {
     target.dispatchEvent(
       new PointerEvent(type, {
         isPrimary: true,
-        pointerId: 1,
+        pointerId: 9999,
         pointerType: "mouse",
         // Emulate mouse behavior for Flash MouseOver/Down logic
         ...commonProps
@@ -635,12 +638,32 @@ var SimpleEmitter = class {
   }
 };
 
+// src/utils/performance.ts
+function createRafThrottler(callback) {
+  let ticking = false;
+  let latestPayload = null;
+  return function(payload) {
+    latestPayload = payload;
+    if (!ticking) {
+      ticking = true;
+      window.requestAnimationFrame(() => {
+        if (latestPayload !== null) {
+          callback(latestPayload);
+        }
+        ticking = false;
+      });
+    }
+  };
+}
+
 // src/imputManager/index.ts
 var INPUT_MANAGER_KEY = /* @__PURE__ */ Symbol.for("omnipad.input_manager.instance");
 var InputManager = class _InputManager {
   constructor() {
     /** Internal flag to prevent multiple event registrations */
     __publicField(this, "_isListening", false);
+    /** A throttled version of the reset logic */
+    __publicField(this, "throttledReset");
     /**
      * Manually triggers a system-wide input reset via Registry.
      */
@@ -650,6 +673,20 @@ var InputManager = class _InputManager {
       }
       Registry.getInstance().resetAll();
     });
+    __publicField(this, "handleResizeReset", () => {
+      this.throttledReset(null);
+    });
+    __publicField(this, "handleBlurReset", () => {
+      this.handleGlobalReset();
+    });
+    __publicField(this, "handleVisibilityChangeReset", () => {
+      if (document.visibilityState === "hidden") {
+        this.handleGlobalReset();
+      }
+    });
+    this.throttledReset = createRafThrottler(() => {
+      this.handleGlobalReset();
+    });
   }
   /**
    * Retrieves the global instance of the InputManager.
@@ -668,8 +705,9 @@ var InputManager = class _InputManager {
    */
   init() {
     if (this._isListening) return;
-    window.addEventListener("resize", this.handleGlobalReset);
-    window.addEventListener("blur", this.handleGlobalReset);
+    window.addEventListener("resize", this.handleResizeReset);
+    window.addEventListener("blur", this.handleBlurReset);
+    document.addEventListener("visibilitychange", this.handleVisibilityChangeReset);
     this._isListening = true;
     if (import.meta.env?.DEV) {
       console.log("[OmniPad-Core] Global InputManager monitoring started.");
@@ -703,8 +741,9 @@ var InputManager = class _InputManager {
    * Detaches all global listeners.
    */
   destroy() {
-    window.removeEventListener("resize", this.handleGlobalReset);
-    window.removeEventListener("blur", this.handleGlobalReset);
+    window.removeEventListener("resize", this.handleResizeReset);
+    window.removeEventListener("blur", this.handleBlurReset);
+    window.removeEventListener("visibilitychange", this.handleVisibilityChangeReset);
     this._isListening = false;
   }
 };
@@ -716,7 +755,7 @@ var BaseEntity = class {
     __publicField(this, "type");
     __publicField(this, "config");
     __publicField(this, "state");
-    __publicField(this, "rect", null);
+    __publicField(this, "rectProvider", null);
     // 内部状态发射器，负责处理状态订阅逻辑 / Internal emitter for state subscription logic
     __publicField(this, "stateEmitter", new SimpleEmitter());
     this.uid = uid;
@@ -745,8 +784,14 @@ var BaseEntity = class {
     this.stateEmitter.clear();
     Registry.getInstance().unregister(this.uid);
   }
-  updateRect(rect) {
-    this.rect = rect;
+  bindRectProvider(provider) {
+    this.rectProvider = provider;
+  }
+  /**
+   * Called when triggering interactions, this subclass fetches the latest boundaries in real time.
+   */
+  getRect() {
+    return this.rectProvider ? this.rectProvider() : null;
   }
   updateConfig(newConfig) {
     this.config = { ...this.config, ...newConfig };
@@ -768,12 +813,13 @@ var INITIAL_STATE = {
 };
 var InputZoneCore = class extends BaseEntity {
   constructor(uid, config) {
-    super(uid, TYPES.INPUT_ZONE, config, INITIAL_STATE);
+    super(uid, CMP_TYPES.INPUT_ZONE, config, INITIAL_STATE);
   }
   onPointerDown(e) {
     if (this.state.isDynamicActive) return;
     if (e.target !== e.currentTarget) return;
     if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
     const pos = this.calculateRelativePosition(e.clientX, e.clientY);
     this.setState({
       isDynamicActive: true,
@@ -785,6 +831,7 @@ var InputZoneCore = class extends BaseEntity {
     if (!this.state.isDynamicActive || e.pointerId !== this.state.dynamicPointerId) return;
   }
   onPointerUp(e) {
+    if (e.cancelable) e.preventDefault();
     this.handleRelease(e);
   }
   onPointerCancel(e) {
@@ -810,10 +857,11 @@ var InputZoneCore = class extends BaseEntity {
    * Converts viewport pixels to percentage coordinates relative to the zone.
    */
   calculateRelativePosition(clientX, clientY) {
-    if (!this.rect) return { x: 0, y: 0 };
+    const rect = this.getRect();
+    if (!rect) return { x: 0, y: 0 };
     return {
-      x: pxToPercent(clientX - this.rect.left, this.rect.width),
-      y: pxToPercent(clientY - this.rect.top, this.rect.height)
+      x: pxToPercent(clientX - rect.left, rect.width),
+      y: pxToPercent(clientY - rect.top, rect.height)
     };
   }
   /**
@@ -845,11 +893,12 @@ var KeyboardButtonCore = class extends BaseEntity {
    * @param config - The flat configuration object for the button.
    */
   constructor(uid, config) {
-    super(uid, TYPES.KEYBOARD_BUTTON, config, INITIAL_STATE2);
+    super(uid, CMP_TYPES.KEYBOARD_BUTTON, config, INITIAL_STATE2);
   }
   // --- IPointerHandler Implementation ---
   onPointerDown(e) {
     if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
     e.target.setPointerCapture(e.pointerId);
     this.setState({
       isActive: true,
@@ -904,7 +953,7 @@ var KeyboardButtonCore = class extends BaseEntity {
       target.handleSignal(signal);
     } else {
       if (import.meta.env?.DEV) {
-        console.warn(`[OmniPad-Core] Button ${this.uid} target not found: ${targetId}`);
+        console.warn(`[OmniPad-Core] KeyboardButton ${this.uid} target not found: ${targetId}`);
       }
     }
   }
@@ -917,20 +966,108 @@ var KeyboardButtonCore = class extends BaseEntity {
   }
 };
 
-// src/entities/RootLayerCore.ts
+// src/entities/MouseButtonCore.ts
 var INITIAL_STATE3 = {
+  isActive: false,
+  isPressed: false,
+  pointerId: null,
+  value: 0
+};
+var MouseButtonCore = class extends BaseEntity {
+  constructor(uid, config) {
+    super(uid, CMP_TYPES.MOUSE_BUTTON, config, INITIAL_STATE3);
+  }
+  // --- IPointerHandler Implementation ---
+  onPointerDown(e) {
+    if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
+    e.target.setPointerCapture(e.pointerId);
+    this.setState({
+      isActive: true,
+      isPressed: true,
+      pointerId: e.pointerId
+    });
+    this.sendInputSignal(ACTION_TYPES.MOUSEDOWN);
+  }
+  onPointerUp(e) {
+    if (e.cancelable) e.preventDefault();
+    this.handleRelease(e, true);
+  }
+  onPointerCancel(e) {
+    this.handleRelease(e, false);
+  }
+  onPointerMove(e) {
+    if (e.cancelable) e.preventDefault();
+  }
+  // --- Internal Logic ---
+  /**
+   * Handles the release of the button.
+   *
+   * @param e - The pointer event.
+   * @param isNormalRelease - If true, a 'click' event will also be dispatched.
+   */
+  handleRelease(e, isNormalRelease) {
+    const isCancelEvent = e.type === "pointercancel" || e.type === "lostpointercapture";
+    if (!isCancelEvent && this.state.pointerId !== e.pointerId) return;
+    if (e.target.hasPointerCapture(e.pointerId)) {
+      e.target.releasePointerCapture(e.pointerId);
+    }
+    this.setState(INITIAL_STATE3);
+    this.sendInputSignal(ACTION_TYPES.MOUSEUP);
+    if (isNormalRelease) {
+      this.sendInputSignal(ACTION_TYPES.CLICK);
+    }
+  }
+  /**
+   * Dispatches input signals to the registered target stage.
+   *
+   * @param type - The action type (mousedown, mouseup, or click).
+   */
+  sendInputSignal(type) {
+    const targetId = this.config.targetStageId;
+    if (!targetId) return;
+    const target = Registry.getInstance().getEntity(targetId);
+    if (target && typeof target.handleSignal === "function") {
+      const signal = {
+        targetStageId: targetId,
+        type,
+        payload: {
+          // 传递配置中的鼠标按键索引 (0:左键, 1:中键, 2:右键)
+          button: this.config.button ?? 0,
+          // 如果配置了固定坐标，一并传递给 TargetZone
+          point: this.config.fixedPoint
+        }
+      };
+      target.handleSignal(signal);
+    } else {
+      if (import.meta.env?.DEV) {
+        console.warn(`[OmniPad-Core] MouseButton ${this.uid} target not found: ${targetId}`);
+      }
+    }
+  }
+  // --- IResettable Implementation ---
+  reset() {
+    if (this.state.isPressed) {
+      this.sendInputSignal(ACTION_TYPES.MOUSEUP);
+    }
+    this.setState(INITIAL_STATE3);
+  }
+};
+
+// src/entities/RootLayerCore.ts
+var INITIAL_STATE4 = {
   isHighlighted: false
 };
 var RootLayerCore = class extends BaseEntity {
   constructor(uid, config) {
-    super(uid, TYPES.ROOT_LAYER, config, INITIAL_STATE3);
+    super(uid, CMP_TYPES.ROOT_LAYER, config, INITIAL_STATE4);
   }
   reset() {
   }
 };
 
 // src/entities/TargetZoneCore.ts
-var INITIAL_STATE4 = {
+var INITIAL_STATE5 = {
   position: { x: 50, y: 50 },
   isVisible: false,
   isPointerDown: false,
@@ -938,9 +1075,48 @@ var INITIAL_STATE4 = {
 };
 var TargetZoneCore = class extends BaseEntity {
   constructor(uid, config) {
-    super(uid, TYPES.TARGET_ZONE, config, INITIAL_STATE4);
+    super(uid, CMP_TYPES.TARGET_ZONE, config, INITIAL_STATE5);
     __publicField(this, "hideTimer", null);
     __publicField(this, "focusFeedbackTimer", null);
+    __publicField(this, "throttledPointerMove");
+    this.throttledPointerMove = createRafThrottler((e) => {
+      this.processPhysicalEvent(e, ACTION_TYPES.MOUSEMOVE);
+    });
+  }
+  // --- IPointerHandler Implementation ---
+  onPointerDown(e) {
+    if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
+    this.processPhysicalEvent(e, ACTION_TYPES.MOUSEDOWN);
+  }
+  onPointerMove(e) {
+    if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
+    this.throttledPointerMove(e);
+  }
+  onPointerUp(e) {
+    if (e.cancelable) e.preventDefault();
+    this.processPhysicalEvent(e, ACTION_TYPES.MOUSEUP);
+    this.processPhysicalEvent(e, ACTION_TYPES.CLICK);
+  }
+  onPointerCancel(e) {
+    this.processPhysicalEvent(e, ACTION_TYPES.MOUSEUP);
+  }
+  /**
+   * Convert physical DOM events into internal signals
+   */
+  processPhysicalEvent(e, type) {
+    const rect = this.getRect();
+    if (!rect) return;
+    const point = {
+      x: pxToPercent(e.clientX - rect.left, rect.width),
+      y: pxToPercent(e.clientY - rect.top, rect.height)
+    };
+    this.handleSignal({
+      targetStageId: this.uid,
+      type,
+      payload: { point, button: e.button }
+    });
   }
   // --- ISignalReceiver Implementation ---
   handleSignal(signal) {
@@ -954,13 +1130,18 @@ var TargetZoneCore = class extends BaseEntity {
       case ACTION_TYPES.MOUSEMOVE:
         if (payload.point) {
           this.updateCursorPosition(payload.point);
-          if (this.config.cursorEnabled) this.showCursor();
-          this.executeMouseAction(ACTION_TYPES.POINTERMOVE, payload);
+        } else if (payload.delta) {
+          this.updateCursorPositionByDelta(payload.delta);
         }
+        if (this.config.cursorEnabled) this.showCursor();
+        this.executeMouseAction(ACTION_TYPES.POINTERMOVE, payload);
         break;
       case ACTION_TYPES.MOUSEDOWN:
       case ACTION_TYPES.MOUSEUP:
       case ACTION_TYPES.CLICK:
+        if (payload.point) {
+          this.updateCursorPosition(payload.point);
+        }
         if (this.config.cursorEnabled) this.showCursor();
         this.executeMouseAction(
           type.startsWith(ACTION_TYPES.MOUSE) ? type.replace(ACTION_TYPES.MOUSE, ACTION_TYPES.POINTER) : type,
@@ -977,12 +1158,13 @@ var TargetZoneCore = class extends BaseEntity {
    * @param payload - Data containing point coordinates or button info.
    */
   executeMouseAction(pointerType, payload) {
-    if (!this.rect) return;
+    const rect = this.getRect();
+    if (!rect) return;
     if (pointerType === ACTION_TYPES.POINTERDOWN) this.setState({ isPointerDown: true });
     if (pointerType === ACTION_TYPES.POINTERUP) this.setState({ isPointerDown: false });
     const target = payload.point || this.state.position;
-    const px = this.rect.left + percentToPx(target.x, this.rect.width);
-    const py = this.rect.top + percentToPx(target.y, this.rect.height);
+    const px = rect.left + percentToPx(target.x, rect.width);
+    const py = rect.top + percentToPx(target.y, rect.height);
     dispatchPointerEventAtPos(pointerType, px, py, {
       button: payload.button ?? 0,
       buttons: this.state.isPointerDown ? 1 : 0
@@ -993,9 +1175,10 @@ var TargetZoneCore = class extends BaseEntity {
    * Checks if the target element under the virtual cursor has focus, and reclaims it if lost.
    */
   ensureFocus() {
-    if (!this.rect) return;
-    const px = this.rect.left + percentToPx(this.state.position.x, this.rect.width);
-    const py = this.rect.top + percentToPx(this.state.position.y, this.rect.height);
+    const rect = this.getRect();
+    if (!rect) return;
+    const px = rect.left + percentToPx(this.state.position.x, rect.width);
+    const py = rect.top + percentToPx(this.state.position.y, rect.height);
     const target = getDeepElement(px, py);
     if (!target) return;
     if (getDeepActiveElement() !== target) {
@@ -1016,8 +1199,23 @@ var TargetZoneCore = class extends BaseEntity {
    * Updates the internal virtual cursor coordinates.
    */
   updateCursorPosition(point) {
+    if (isVec2Equal(point, this.state.position)) return;
     this.setState({ position: { ...point } });
   }
+  /**
+   * Updates the internal virtual cursor coordinates by delta.
+   */
+  updateCursorPositionByDelta(delta) {
+    if (isVec2Equal(delta, { x: 0, y: 0 })) return;
+    const rect = this.getRect();
+    if (!rect) return;
+    const dxPercent = pxToPercent(delta.x, rect.width);
+    const dyPercent = pxToPercent(delta.y, rect.height);
+    this.updateCursorPosition({
+      x: clamp(this.state.position.x + dxPercent, 0, 100),
+      y: clamp(this.state.position.y + dyPercent, 0, 100)
+    });
+  }
   /**
    * Makes the virtual cursor visible and sets a timeout for auto-hiding.
    */
@@ -1046,26 +1244,164 @@ var TargetZoneCore = class extends BaseEntity {
   }
 };
 
+// src/entities/TrackpadCore.ts
+var GESTURE = {
+  TAP_TIME: 200,
+  // 200ms 以内抬起视为轻点 / Release within 200ms counts as a tap
+  TAP_DISTANCE: 10,
+  // 位移小于 10px 视为点击判定 / Movement within 10px counts as a tap
+  DOUBLE_TAP_GAP: 300
+  // 两次点击间隔小于 300ms 视为双击触发 / Interval within 300ms counts as double-tap
+};
+var INITIAL_STATE6 = {
+  isActive: false,
+  isPressed: false,
+  pointerId: null,
+  value: 0
+};
+var TrackpadCore = class extends BaseEntity {
+  /**
+   * Creates an instance of TrackpadCore.
+   *
+   * @param uid - Unique entity ID.
+   * @param config - Configuration for the trackpad.
+   */
+  constructor(uid, config) {
+    super(uid, CMP_TYPES.TRACKPAD, config, INITIAL_STATE6);
+    __publicField(this, "lastPointerPos", { x: 0, y: 0 });
+    __publicField(this, "startTime", 0);
+    __publicField(this, "startPos", { x: 0, y: 0 });
+    // 连击状态追踪 / State tracking for consecutive taps
+    __publicField(this, "lastClickTime", 0);
+    __publicField(this, "isDragMode", false);
+    __publicField(this, "throttledPointerMove");
+    this.throttledPointerMove = createRafThrottler((e) => {
+      this.processPointerMove(e);
+    });
+  }
+  // --- IPointerHandler Implementation ---
+  onPointerDown(e) {
+    if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
+    e.target.setPointerCapture(e.pointerId);
+    const now = Date.now();
+    this.startTime = now;
+    this.startPos = { x: e.clientX, y: e.clientY };
+    this.lastPointerPos = { x: e.clientX, y: e.clientY };
+    if (now - this.lastClickTime < GESTURE.DOUBLE_TAP_GAP) {
+      this.isDragMode = true;
+      this.sendSignal(ACTION_TYPES.MOUSEDOWN);
+      this.setState({ isPressed: true });
+    }
+    this.setState({ isActive: true, pointerId: e.pointerId });
+  }
+  onPointerMove(e) {
+    if (e.cancelable) e.preventDefault();
+    e.stopPropagation();
+    if (this.state.pointerId !== e.pointerId) return;
+    this.throttledPointerMove(e);
+  }
+  /**
+   * Internal logic for processing pointer movement.
+   * Calculates displacement and emits relative move signals.
+   *
+   * @param e - The pointer event.
+   */
+  processPointerMove(e) {
+    const dx = e.clientX - this.lastPointerPos.x;
+    const dy = e.clientY - this.lastPointerPos.y;
+    const rect = this.getRect();
+    if (!rect) return;
+    const deltaX = dx / rect.width * 100 * this.config.sensitivity;
+    const deltaY = dy / rect.height * 100 * this.config.sensitivity;
+    if (Math.abs(dx) > 0 || Math.abs(dy) > 0) {
+      this.sendSignal(ACTION_TYPES.MOUSEMOVE, { delta: { x: deltaX, y: deltaY } });
+    }
+    this.lastPointerPos = { x: e.clientX, y: e.clientY };
+  }
+  onPointerUp(e) {
+    if (this.state.pointerId !== e.pointerId) return;
+    if (e.cancelable) e.preventDefault();
+    const duration = Date.now() - this.startTime;
+    const dist = Math.hypot(e.clientX - this.startPos.x, e.clientY - this.startPos.y);
+    if (this.isDragMode) {
+      this.sendSignal(ACTION_TYPES.MOUSEUP);
+      this.isDragMode = false;
+    } else if (duration < GESTURE.TAP_TIME && dist < GESTURE.TAP_DISTANCE) {
+      this.sendSignal(ACTION_TYPES.CLICK);
+      this.lastClickTime = Date.now();
+    }
+    this.handleRelease(e);
+  }
+  onPointerCancel(e) {
+    this.handleRelease(e);
+  }
+  // --- IResettable Implementation ---
+  reset() {
+    if (this.isDragMode) this.sendSignal(ACTION_TYPES.MOUSEUP);
+    this.isDragMode = false;
+    this.setState(INITIAL_STATE6);
+  }
+  // --- Internal Helpers ---
+  /**
+   * Clean up pointer capture and reset interaction state.
+   */
+  handleRelease(e) {
+    if (e.target.hasPointerCapture(e.pointerId)) {
+      try {
+        e.target.releasePointerCapture(e.pointerId);
+      } catch (err) {
+      }
+    }
+    this.setState(INITIAL_STATE6);
+  }
+  /**
+   * Helper to send signals to the target stage via Registry.
+   *
+   * @param type - Signal action type.
+   * @param extraPayload - Additional data like delta or point.
+   */
+  sendSignal(type, extraPayload = {}) {
+    const targetId = this.config.targetStageId;
+    if (!targetId) return;
+    const target = Registry.getInstance().getEntity(targetId);
+    if (target && typeof target.handleSignal === "function") {
+      target.handleSignal({
+        targetStageId: targetId,
+        type,
+        payload: {
+          button: 0,
+          // 触摸板操作默认模拟左键 / Trackpad defaults to left button
+          ...extraPayload
+        }
+      });
+    }
+  }
+};
+
 // src/index.ts
 var OmniPad = {
+  ActionTypes: ACTION_TYPES,
   Context: CONTEXT,
   Keys: KEYS,
-  Types: TYPES
+  Types: CMP_TYPES
 };
 export {
   ACTION_TYPES,
   BaseEntity,
+  CMP_TYPES,
   CONTEXT,
   InputManager,
   InputZoneCore,
   KEYS,
   KeyboardButtonCore,
+  MouseButtonCore,
   OmniPad,
   Registry,
   RootLayerCore,
   SimpleEmitter,
-  TYPES,
   TargetZoneCore,
+  TrackpadCore,
   addVec,
   applyAxialDeadzone,
   applyRadialDeadzone,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omnipad/core",
-  "version": "0.1.1-alpha.1",
+  "version": "0.2.0-alpha.3",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",