npm - @omnipad/vue - Versions diffs - 0.1.1-alpha.0 - Mend

@omnipad/vue 0.1.1-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.d.ts ADDED Viewed

@@ -0,0 +1,197 @@
+import { AllowedComponentProps } from 'vue';
+import { Component } from 'vue';
+import { ComponentCustomProperties } from 'vue';
+import { ComponentCustomProps } from 'vue';
+import { ComponentInternalInstance } from 'vue';
+import { ComponentOptionsBase } from 'vue';
+import { ComponentOptionsMixin } from 'vue';
+import { ComponentProvideOptions } from 'vue';
+import { ComponentPublicInstance } from 'vue';
+import { ComputedRef } from 'vue';
+import { ConfigTreeNode } from '@omnipad/core';
+import { DebuggerEvent } from 'vue';
+import { DefineComponent } from 'vue';
+import { GlobalComponents } from 'vue';
+import { GlobalDirectives } from 'vue';
+import { KeyboardButtonConfig } from '@omnipad/core';
+import { LayoutBox } from '@omnipad/core';
+import { nextTick } from 'vue';
+import { OnCleanup } from '@vue/reactivity';
+import { PublicProps } from 'vue';
+import { ShallowUnwrapRef } from 'vue';
+import { Slot } from 'vue';
+import { VNodeProps } from 'vue';
+import { WatchOptions } from 'vue';
+import { WatchStopHandle } from 'vue';
+declare const __VLS_component: DefineComponent<InputZoneProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<InputZoneProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+elementRef: HTMLDivElement;
+}, HTMLDivElement>;
+declare const __VLS_component_2: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+elementRef: HTMLDivElement;
+}, HTMLDivElement>;
+declare type __VLS_Props = {
+    /** The runtime tree node for auto-configuration. */
+    treeNode?: ConfigTreeNode;
+    /** Unique configuration ID (CID) for this layer. Used for profile serialization. */
+    widgetId?: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        elementRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+declare function __VLS_template_2(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        elementRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
+declare type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+declare type __VLS_WithTemplateSlots_2<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+export declare const InputZone: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+declare interface InputZoneProps {
+    /** The runtime tree node for automatic setup. */
+    treeNode?: ConfigTreeNode;
+    /** Unique configuration ID (CID) for this zone. Used for profile serialization. */
+    widgetId?: string;
+    /** Spatial layout configuration (position, size, anchor). */
+    layout?: LayoutBox;
+    /** If true, prevents the browser focus from leaving the game area when touching this zone. */
+    preventFocusLoss?: {
+        type: boolean;
+        default: undefined;
+    };
+}
+export declare function registerComponent(type: string, component: Component): void;
+export declare const RootLayer: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
+export declare const TargetZone: DefineComponent<TargetZoneProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TargetZoneProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+elementRef: HTMLDivElement;
+}, HTMLDivElement>;
+declare interface TargetZoneProps {
+    /** The runtime tree node for automatic setup. */
+    treeNode?: ConfigTreeNode;
+    /** Unique configuration ID (CID) for this zone. Used for profile serialization. */
+    widgetId?: string;
+    /** Whether the virtual visual cursor is enabled for this stage. */
+    cursorEnabled?: boolean;
+    /** Delay in milliseconds before the virtual cursor auto-hides after inactivity (0 to disable). */
+    cursorAutoDelay?: number;
+    /** Spatial layout configuration. Usually set to cover the entire game container. */
+    layout?: LayoutBox;
+}
+export declare const VirtualKeyboardButton: DefineComponent<VirtualKeyButtonButtonProps, {
+uid: ComputedRef<any>;
+onPointerDown: (e: PointerEvent) => void | undefined;
+onPointerUp: (e: PointerEvent) => void | undefined;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<VirtualKeyButtonButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+elementRef: ({
+$: ComponentInternalInstance;
+$data: {};
+$props: {
+readonly layout?: LayoutBox | undefined;
+readonly isActive?: boolean | undefined;
+readonly label?: string | undefined;
+} & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+$attrs: {
+[x: string]: unknown;
+};
+$refs: {
+[x: string]: unknown;
+};
+$slots: Readonly<{
+[name: string]: Slot<any> | undefined;
+}>;
+$root: ComponentPublicInstance | null;
+$parent: ComponentPublicInstance | null;
+$host: Element | null;
+$emit: (event: string, ...args: any[]) => void;
+$el: HTMLDivElement;
+$options: ComponentOptionsBase<Readonly<{
+layout?: LayoutBox;
+isActive?: boolean;
+label?: string;
+}> & Readonly<{}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
+beforeCreate?: (() => void) | (() => void)[];
+created?: (() => void) | (() => void)[];
+beforeMount?: (() => void) | (() => void)[];
+mounted?: (() => void) | (() => void)[];
+beforeUpdate?: (() => void) | (() => void)[];
+updated?: (() => void) | (() => void)[];
+activated?: (() => void) | (() => void)[];
+deactivated?: (() => void) | (() => void)[];
+beforeDestroy?: (() => void) | (() => void)[];
+beforeUnmount?: (() => void) | (() => void)[];
+destroyed?: (() => void) | (() => void)[];
+unmounted?: (() => void) | (() => void)[];
+renderTracked?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+renderTriggered?: ((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[];
+errorCaptured?: ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void)[];
+};
+$forceUpdate: () => void;
+$nextTick: nextTick;
+$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, OnCleanup]) => any : (...args: [any, any, OnCleanup]) => any, options?: WatchOptions): WatchStopHandle;
+} & Readonly<{}> & Omit<Readonly<{
+layout?: LayoutBox;
+isActive?: boolean;
+label?: string;
+}> & Readonly<{}>, never> & ShallowUnwrapRef<    {}> & {} & ComponentCustomProperties & {} & {
+$slots: {
+default?(_: {}): any;
+};
+}) | null;
+}, HTMLDivElement>;
+declare interface VirtualKeyButtonButtonProps {
+    /** The runtime tree node for automatic setup. */
+    treeNode?: ConfigTreeNode;
+    /** Unique configuration ID (CID) for this zone. Used for profile serialization. */
+    widgetId?: string;
+    /** The text or symbol displayed on the button surface. */
+    label?: string;
+    /** The ID (CID) of the TargetZone this button sends signals to, usually global ID. */
+    targetStageId?: string;
+    /**
+     * Mapping definitions for keyboard events.
+     * Includes 'key', 'code', and legacy 'keyCode'.
+     */
+    mapping?: KeyboardButtonConfig['mapping'];
+    /** Spatial layout configuration relative to its parent zone. */
+    layout?: LayoutBox;
+}
+export { }

package/dist/omnipad-vue.css ADDED Viewed

@@ -0,0 +1 @@

+ :root{--omnipad-btn-bg: rgba(255, 255, 255, .2);--omnipad-btn-border-color: rgba(255, 255, 255, .4);--omnipad-btn-border-width: 2px;--omnipad-btn-border-style: solid;--omnipad-btn-radius: 8px;--omnipad-btn-label-color: #ffffff;--omnipad-btn-font-family: "Upheaval", "monacoregular", sans-serif;--omnipad-btn-font-size: 18px;--omnipad-btn-font-weight: bold;--omnipad-btn-pressed-bg: rgba(255, 186, 67, .6);--omnipad-btn-pressed-border-color: #ffba43;--omnipad-btn-pressed-scale: .92;--omnipad-btn-pressed-opacity: 1;--omnipad-btn-transition-duration: .1s;--omnipad-btn-transition-timing: ease-out}.omnipad-button-base{background:var(--omnipad-btn-bg);border:var(--omnipad-btn-border-width) var(--omnipad-btn-border-style) var(--omnipad-btn-border-color);border-radius:var(--omnipad-btn-radius);display:flex;align-items:center;justify-content:center;transition:all var(--omnipad-btn-transition-duration) var(--omnipad-btn-transition-timing)}.omnipad-button-label-hollow{font-family:var(--omnipad-btn-font-family);font-size:var(--omnipad-btn-font-size);color:var(--omnipad-btn-label-color);font-weight:var(--omnipad-btn-font-weight);background:inherit;-webkit-background-clip:text;background-clip:text;color:transparent;filter:invert(1) grayscale(1) contrast(9);mix-blend-mode:destination-out}.omnipad-prevent{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.omnipad-virtual-layer-base[data-v-6f1860f6]{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000}[data-v-6f1860f6] .omnipad-input-zone,[data-v-6f1860f6] .omnipad-button{pointer-events:auto}.omnipad-input-zone[data-v-02669919]{position:absolute;pointer-events:none}.omnipad-input-zone-trigger[data-v-02669919]{position:absolute;inset:0;pointer-events:auto;background:transparent;touch-action:none}.dynamic-widget-mount[data-v-02669919]{pointer-events:none}.omnipad-virtual-layer[data-v-a509fd6e]{position:relative;height:100%;width:100%;pointer-events:none}.omnipad-target-zone[data-v-b9d49b97]{pointer-events:none;overflow:hidden}.omnipad-virtual-cursor[data-v-b9d49b97]{position:absolute;width:20px;height:20px;transform:translate(-50%,-50%);pointer-events:none;transition:opacity .2s}.cursor-dot[data-v-b9d49b97]{width:100%;height:100%;border:2px solid white;border-radius:50%;background:#ff000080}.cursor-dot.is-down[data-v-b9d49b97]{transform:scale(.8);background:red}.focus-feedback-ring[data-v-b9d49b97]{position:absolute;width:60px;height:60px;transform:translate(-50%,-50%);border:2px solid rgba(100,200,255,.8);border-radius:50%;pointer-events:none;z-index:5}.pulse-enter-active[data-v-b9d49b97]{animation:ripple-out-b9d49b97 .5s ease-out forwards}@keyframes ripple-out-b9d49b97{0%{transform:translate(-50%,-50%) scale(.2);opacity:1}to{transform:translate(-50%,-50%) scale(1.5);opacity:0}}.omnipad-virtual-cursor[data-v-b9d49b97]{z-index:10}.omnipad-button-base[data-v-6cbe805c]{-webkit-user-select:none;user-select:none;touch-action:none;overflow:hidden;box-sizing:border-box;pointer-events:auto}.omnipad-button-base.omnipad-is-active[data-v-6cbe805c]{background:var(--omnipad-btn-pressed-bg);border-color:var(--omnipad-btn-pressed-border-color);opacity:var(--omnipad-btn-pressed-opacity);filter:brightness(1.2)}.omnipad-button-label[data-v-6cbe805c]{font-family:var(--omnipad-btn-font-family);font-size:var(--omnipad-btn-font-size);color:var(--omnipad-btn-label-color);font-weight:var(--omnipad-btn-font-weight)}

package/dist/omnipad-vue.mjs ADDED Viewed

@@ -0,0 +1,791 @@
+import { defineComponent as P, h as oe, shallowRef as se, ref as D, onMounted as re, onUnmounted as ae, openBlock as p, createElementBlock as E, Fragment as ce, renderList as le, createBlock as C, resolveDynamicComponent as Y, unref as h, renderSlot as k, inject as ue, computed as y, provide as de, useSlots as fe, watch as he, nextTick as pe, normalizeStyle as _, createVNode as L, withCtx as K, createElementVNode as G, createCommentVNode as T, Transition as ve, normalizeClass as j, toDisplayString as me } from "vue";
+var ge = Object.defineProperty, ye = (e, t, n) => t in e ? ge(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, g = (e, t, n) => ye(e, typeof t != "symbol" ? t + "" : t, n), v = {
+  // --- Zones ---
+  /** Area responsible for capturing touches and spawning dynamic widgets */
+  INPUT_ZONE: "input-zone",
+  /** Area responsible for receiving signals and simulating DOM events */
+  TARGET_ZONE: "target-zone",
+  // --- Widgets ---
+  /** Simulates a physical keyboard key press */
+  KEYBOARD_BUTTON: "keyboard-button",
+  /** The top-level managed container */
+  ROOT_LAYER: "root-layer"
+}, f = {
+  KEYDOWN: "keydown",
+  KEYUP: "keyup",
+  POINTER: "pointer",
+  POINTERMOVE: "pointermove",
+  POINTERDOWN: "pointerdown",
+  POINTERUP: "pointerup",
+  MOUSE: "mouse",
+  MOUSEMOVE: "mousemove",
+  MOUSEDOWN: "mousedown",
+  MOUSEUP: "mouseup",
+  CLICK: "click"
+}, W = {
+  /** The key used to propagate Parent IDs through the component tree */
+  PARENT_ID_KEY: "omnipad-parent-id-link"
+}, X = (e, t = 2) => {
+  const n = Math.pow(10, t);
+  return Math.round(e * n) / n;
+}, A = (e, t) => X(e * t / 100), z = (e, t) => t === 0 ? 0 : X(e * 100 / t), H = (e, t) => {
+  let n = document.elementFromPoint(e, t);
+  for (; n && n.shadowRoot; ) {
+    const i = n.shadowRoot.elementFromPoint(e, t);
+    if (!i || i === n) break;
+    n = i;
+  }
+  return n;
+}, J = () => {
+  let e = document.activeElement;
+  for (; e && e.shadowRoot && e.shadowRoot.activeElement; )
+    e = e.shadowRoot.activeElement;
+  return e;
+}, Ee = (e) => {
+  J() !== e && (e.hasAttribute("tabindex") || e.setAttribute("tabindex", "-1"), e.focus());
+}, Pe = (e, t) => {
+  const n = new KeyboardEvent(e, {
+    ...t,
+    which: t.keyCode,
+    // Support for legacy Flash engines
+    bubbles: !0,
+    cancelable: !0,
+    view: window
+  });
+  window.dispatchEvent(n);
+}, be = (e, t, n, i = {}) => {
+  const o = H(t, n);
+  if (!o) return;
+  const s = {
+    bubbles: !0,
+    cancelable: !0,
+    composed: !0,
+    // Crucial for piercing Shadow DOM boundaries
+    clientX: t,
+    clientY: n,
+    view: window,
+    ...i
+  };
+  if (e.startsWith("pointer")) {
+    o.dispatchEvent(
+      new PointerEvent(e, {
+        isPrimary: !0,
+        pointerId: 1,
+        pointerType: "mouse",
+        // Emulate mouse behavior for Flash MouseOver/Down logic
+        ...s
+      })
+    );
+    const r = e.replace("pointer", "mouse");
+    o.dispatchEvent(new MouseEvent(r, s));
+  } else
+    o.dispatchEvent(new MouseEvent(e, s));
+}, Ie = (e = "omnipad") => {
+  const t = Date.now().toString(36), n = Math.random().toString(36).substring(2, 6);
+  return `${e}-${t}-${n}`;
+}, V = (e) => {
+  if (!e) return {};
+  const t = {};
+  t.position = "absolute", ["left", "top", "right", "bottom", "width", "height"].forEach((o) => {
+    const s = e[o];
+    s !== void 0 && (t[o] = typeof s == "number" ? `${s}px` : s);
+  }), e.zIndex !== void 0 && (t.zIndex = e.zIndex);
+  const i = {
+    "top-left": "translate(0, 0)",
+    "top-center": "translate(-50%, 0)",
+    "top-right": "translate(-100%, 0)",
+    "center-left": "translate(0, -50%)",
+    center: "translate(-50%, -50%)",
+    "center-right": "translate(-100%, -50%)",
+    "bottom-left": "translate(0, -100%)",
+    "bottom-center": "translate(-50%, -100%)",
+    "bottom-right": "translate(-100%, -100%)"
+  };
+  return e.anchor && (t.transform = i[e.anchor]), t;
+}, _e = class {
+  constructor() {
+    g(this, "listeners", /* @__PURE__ */ new Set());
+  }
+  /**
+   * Registers a callback function to be executed whenever data is emitted.
+   *
+   * @param fn - The callback function.
+   * @returns A function that, when called, unsubscribes the listener.
+   */
+  subscribe(e) {
+    return this.listeners.add(e), () => this.listeners.delete(e);
+  }
+  /**
+   * Broadcasts the provided data to all registered listeners.
+   * Each listener is executed within a try-catch block to ensure that
+   * an error in one subscriber doesn't prevent others from receiving the signal.
+   *
+   * @param data - The payload to be sent to all subscribers.
+   */
+  emit(e) {
+    this.listeners.forEach((t) => {
+      try {
+        t(e);
+      } catch (n) {
+        console.error("[OmniPad-Core] Emitter callback error:", n);
+      }
+    });
+  }
+  /**
+   * Removes all listeners and clears the subscription set.
+   * Essential for preventing memory leaks when an Entity is destroyed.
+   */
+  clear() {
+    this.listeners.clear();
+  }
+}, R = class {
+  constructor(e, t, n, i) {
+    g(this, "uid"), g(this, "type"), g(this, "config"), g(this, "state"), g(this, "rect", null), g(this, "stateEmitter", new _e()), this.uid = e, this.type = t, this.config = n, this.state = i;
+  }
+  // --- IObservable Implementation ---
+  subscribe(e) {
+    return e(this.state), this.stateEmitter.subscribe(e);
+  }
+  // --- State Management ---
+  /**
+   * Updates the internal state and notifies all subscribers.
+   *
+   * @param partialState - Partial object containing updated state values.
+   */
+  setState(e) {
+    this.state = { ...this.state, ...e }, this.stateEmitter.emit(this.state);
+  }
+  // --- Lifecycle ---
+  destroy() {
+    this.reset(), this.stateEmitter.clear(), Z.getInstance().unregister(this.uid);
+  }
+  updateRect(e) {
+    this.rect = e;
+  }
+  updateConfig(e) {
+    this.config = { ...this.config, ...e }, this.stateEmitter.emit(this.state);
+  }
+  getState() {
+    return this.state;
+  }
+  getConfig() {
+    return this.config;
+  }
+}, B = /* @__PURE__ */ Symbol.for("omnipad.registry.instance"), Z = class Q {
+  /**
+   * Private constructor to enforce singleton pattern.
+   */
+  constructor() {
+    g(this, "entities", /* @__PURE__ */ new Map());
+  }
+  /**
+   * Retrieves the global instance of the Registry.
+   * Uses globalThis to ensure the instance is unique even if the library is loaded multiple times.
+   */
+  static getInstance() {
+    const t = globalThis;
+    return t[B] || (t[B] = new Q()), t[B];
+  }
+  register(t) {
+    if (!t.uid) {
+      console.warn("[OmniPad-Core] Registry: Attempted to register entity without UID.", t);
+      return;
+    }
+    this.entities.has(t.uid), this.entities.set(t.uid, t);
+  }
+  unregister(t) {
+    this.entities.has(t) && this.entities.delete(t);
+  }
+  getEntity(t) {
+    return this.entities.get(t);
+  }
+  getAllEntities() {
+    return Array.from(this.entities.values());
+  }
+  getEntitiesByRoot(t) {
+    const n = this.getAllEntities();
+    if (!t) return n;
+    if (!this.entities.get(t))
+      return console.warn(`[OmniPad-Core] Registry: Root entity ${t} not found.`), [];
+    const o = /* @__PURE__ */ new Map();
+    n.forEach((c) => {
+      if (c instanceof R) {
+        const l = c.getConfig();
+        l.parentId && (o.has(l.parentId) || o.set(l.parentId, []), o.get(l.parentId).push(c));
+      }
+    });
+    const s = [], r = [t], a = /* @__PURE__ */ new Set();
+    for (; r.length > 0; ) {
+      const c = r.shift();
+      if (a.has(c)) continue;
+      a.add(c);
+      const l = this.entities.get(c);
+      if (l) {
+        s.push(l);
+        const u = o.get(c);
+        u && u.forEach((m) => r.push(m.uid));
+      }
+    }
+    return s;
+  }
+  destroyByRoot(t) {
+    const n = this.getEntitiesByRoot(t);
+    for (let i = n.length - 1; i >= 0; i--) {
+      const o = n[i];
+      try {
+        o.destroy();
+      } catch (s) {
+        console.error(`[OmniPad-Core] Error during destroyByRoot at ${o.uid}:`, s);
+      }
+    }
+  }
+  clear() {
+    this.entities.clear();
+  }
+  resetAll() {
+    this.entities.forEach((t) => {
+      "reset" in t && t.reset();
+    });
+  }
+  debugGetSnapshot() {
+    return new Map(this.entities);
+  }
+}, Te = {
+  isDynamicActive: !1,
+  dynamicPointerId: null,
+  dynamicPosition: { x: 0, y: 0 }
+}, Re = class extends R {
+  constructor(e, t) {
+    super(e, v.INPUT_ZONE, t, Te);
+  }
+  onPointerDown(e) {
+    if (this.state.isDynamicActive || e.target !== e.currentTarget) return;
+    e.cancelable && e.preventDefault();
+    const t = this.calculateRelativePosition(e.clientX, e.clientY);
+    this.setState({
+      isDynamicActive: !0,
+      dynamicPointerId: e.pointerId,
+      dynamicPosition: t
+    });
+  }
+  onPointerMove(e) {
+    !this.state.isDynamicActive || (e.pointerId, this.state.dynamicPointerId);
+  }
+  onPointerUp(e) {
+    this.handleRelease(e);
+  }
+  onPointerCancel(e) {
+    this.handleRelease(e);
+  }
+  /**
+   * Internal helper to handle pointer release and cleanup.
+   */
+  handleRelease(e) {
+    if (e.pointerId === this.state.dynamicPointerId) {
+      try {
+        e.currentTarget.releasePointerCapture(e.pointerId);
+      } catch {
+      }
+      this.setState({
+        isDynamicActive: !1,
+        dynamicPointerId: null
+      });
+    }
+  }
+  // --- Helper Calculations ---
+  /**
+   * Converts viewport pixels to percentage coordinates relative to the zone.
+   */
+  calculateRelativePosition(e, t) {
+    return this.rect ? {
+      x: z(e - this.rect.left, this.rect.width),
+      y: z(t - this.rect.top, this.rect.height)
+    } : { x: 0, y: 0 };
+  }
+  /**
+   * Whether the interceptor layer should be enabled.
+   */
+  get isInterceptorRequired() {
+    return !!(this.config.dynamicWidgetId || this.config.preventFocusLoss);
+  }
+  reset() {
+    this.setState({
+      isDynamicActive: !1,
+      dynamicPointerId: null
+    });
+  }
+}, F = {
+  isActive: !1,
+  isPressed: !1,
+  pointerId: null,
+  value: 0
+}, we = class extends R {
+  /**
+   * Creates an instance of KeyboardButtonCore.
+   *
+   * @param uid - The unique entity ID.
+   * @param config - The flat configuration object for the button.
+   */
+  constructor(e, t) {
+    super(e, v.KEYBOARD_BUTTON, t, F);
+  }
+  // --- IPointerHandler Implementation ---
+  onPointerDown(e) {
+    e.cancelable && e.preventDefault(), e.target.setPointerCapture(e.pointerId), this.setState({
+      isActive: !0,
+      isPressed: !0,
+      pointerId: e.pointerId
+    }), this.sendInputSignal(f.KEYDOWN);
+  }
+  onPointerUp(e) {
+    e.cancelable && e.preventDefault(), this.handleRelease(e);
+  }
+  onPointerCancel(e) {
+    this.handleRelease(e);
+  }
+  onPointerMove(e) {
+    e.cancelable && e.preventDefault();
+  }
+  // --- Internal Logic ---
+  /**
+   * Common logic for releasing the button state.
+   *
+   * @param e - The pointer event that triggered the release.
+   */
+  handleRelease(e) {
+    this.state.pointerId === e.pointerId && (e.target.hasPointerCapture(e.pointerId) && e.target.releasePointerCapture(e.pointerId), this.setState(F), this.sendInputSignal(f.KEYUP));
+  }
+  /**
+   * Dispatches input signals to the registered target stage.
+   *
+   * @param type - The action type (keydown or keyup).
+   */
+  sendInputSignal(e) {
+    const t = this.config.targetStageId;
+    if (!t) return;
+    const n = Z.getInstance().getEntity(t);
+    if (n && typeof n.handleSignal == "function") {
+      const i = {
+        targetStageId: t,
+        type: e,
+        payload: {
+          key: this.config.mapping.key,
+          code: this.config.mapping.code,
+          keyCode: this.config.mapping.keyCode
+        }
+      };
+      n.handleSignal(i);
+    }
+  }
+  // --- IResettable Implementation ---
+  reset() {
+    this.state.isPressed && this.sendInputSignal(f.KEYUP), this.setState(F);
+  }
+}, Oe = {
+  isHighlighted: !1
+}, Se = class extends R {
+  constructor(e, t) {
+    super(e, v.ROOT_LAYER, t, Oe);
+  }
+  reset() {
+  }
+}, Ne = {
+  position: { x: 50, y: 50 },
+  isVisible: !1,
+  isPointerDown: !1,
+  isFocusReturning: !1
+}, Ae = class extends R {
+  constructor(e, t) {
+    super(e, v.TARGET_ZONE, t, Ne), g(this, "hideTimer", null), g(this, "focusFeedbackTimer", null);
+  }
+  // --- ISignalReceiver Implementation ---
+  handleSignal(e) {
+    const { type: t, payload: n } = e;
+    switch (this.ensureFocus(), t) {
+      case f.KEYDOWN:
+      case f.KEYUP:
+        Pe(t, n);
+        break;
+      case f.MOUSEMOVE:
+        n.point && (this.updateCursorPosition(n.point), this.config.cursorEnabled && this.showCursor(), this.executeMouseAction(f.POINTERMOVE, n));
+        break;
+      case f.MOUSEDOWN:
+      case f.MOUSEUP:
+      case f.CLICK:
+        this.config.cursorEnabled && this.showCursor(), this.executeMouseAction(
+          t.startsWith(f.MOUSE) ? t.replace(f.MOUSE, f.POINTER) : t,
+          n
+        );
+        break;
+    }
+  }
+  // --- Mouse & Pointer Simulation ---
+  /**
+   * Calculates pixel coordinates and dispatches simulated pointer events to the deepest element.
+   *
+   * @param pointerType - The specific pointer event type (e.g., pointermove, pointerdown).
+   * @param payload - Data containing point coordinates or button info.
+   */
+  executeMouseAction(e, t) {
+    if (!this.rect) return;
+    e === f.POINTERDOWN && this.setState({ isPointerDown: !0 }), e === f.POINTERUP && this.setState({ isPointerDown: !1 });
+    const n = t.point || this.state.position, i = this.rect.left + A(n.x, this.rect.width), o = this.rect.top + A(n.y, this.rect.height);
+    be(e, i, o, {
+      button: t.button ?? 0,
+      buttons: this.state.isPointerDown ? 1 : 0
+    });
+  }
+  // --- Focus Management ---
+  /**
+   * Checks if the target element under the virtual cursor has focus, and reclaims it if lost.
+   */
+  ensureFocus() {
+    if (!this.rect) return;
+    const e = this.rect.left + A(this.state.position.x, this.rect.width), t = this.rect.top + A(this.state.position.y, this.rect.height), n = H(e, t);
+    n && J() !== n && (Ee(n), this.triggerFocusFeedback());
+  }
+  /**
+   * Activates a temporary visual feedback state to indicate a focus-reclaim event.
+   */
+  triggerFocusFeedback() {
+    this.setState({ isFocusReturning: !0 }), this.focusFeedbackTimer && clearTimeout(this.focusFeedbackTimer), this.focusFeedbackTimer = setTimeout(() => this.setState({ isFocusReturning: !1 }), 500);
+  }
+  // --- Cursor State Helpers ---
+  /**
+   * Updates the internal virtual cursor coordinates.
+   */
+  updateCursorPosition(e) {
+    this.setState({ position: { ...e } });
+  }
+  /**
+   * Makes the virtual cursor visible and sets a timeout for auto-hiding.
+   */
+  showCursor() {
+    this.setState({ isVisible: !0 }), this.hideTimer && clearTimeout(this.hideTimer), this.config.cursorAutoDelay && this.config.cursorAutoDelay > 0 && (this.hideTimer = setTimeout(
+      () => this.setState({ isVisible: !1 }),
+      this.config.cursorAutoDelay
+    ));
+  }
+  // --- IResettable Implementation ---
+  reset() {
+    this.state.isPointerDown && this.executeMouseAction(f.POINTERUP, {}), this.hideTimer && clearTimeout(this.hideTimer), this.focusFeedbackTimer && clearTimeout(this.focusFeedbackTimer), this.setState({
+      isVisible: !1,
+      isPointerDown: !1,
+      isFocusReturning: !1
+    });
+  }
+};
+const q = {};
+function x(e, t) {
+  q[e] = t;
+}
+function ee(e) {
+  const t = q[e];
+  return t || P({
+    render: () => oe("div", { style: "color:red" }, `[Unknown: ${e}]`)
+  });
+}
+function U(e) {
+  const t = se(), n = D(), i = D(null), o = (r) => {
+    n.value = r;
+  };
+  let s = null;
+  return re(() => {
+    const r = e();
+    t.value = r, Z.getInstance().register(r), "subscribe" in r && r.subscribe(o);
+    let a = null;
+    i.value && (i.value instanceof Element ? a = i.value : i.value.$el instanceof Element && (a = i.value.$el)), a && "updateRect" in r && (s = new ResizeObserver((c) => {
+      for (const l of c)
+        r.updateRect(l.target.getBoundingClientRect());
+    }), s.observe(a), r.updateRect(a.getBoundingClientRect()));
+  }), ae(() => {
+    s && s.disconnect(), t.value && t.value.destroy();
+  }), {
+    core: t,
+    state: n,
+    elementRef: i
+  };
+}
+const De = { class: "omnipad-virtual-layer-base omnipad-prevent" }, Ce = /* @__PURE__ */ P({
+  __name: "VirtualLayerBase",
+  props: {
+    nodes: {}
+  },
+  setup(e) {
+    return (t, n) => (p(), E("div", De, [
+      (p(!0), E(ce, null, le(e.nodes || [], (i) => (p(), C(Y(h(ee)(i.type)), {
+        key: i.uid,
+        "tree-node": i
+      }, null, 8, ["tree-node"]))), 128)),
+      k(t.$slots, "default", {}, void 0, !0)
+    ]));
+  }
+}), w = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [i, o] of t)
+    n[i] = o;
+  return n;
+}, te = /* @__PURE__ */ w(Ce, [["__scopeId", "data-v-6f1860f6"]]);
+function M(e, t, n = {}) {
+  const i = t.treeNode, o = i && i.type === e ? i : void 0;
+  i && i.type !== e && console.warn(
+    `[OmniPad-Validation] Type mismatch! Component expected "${e}", but received "${i.type}". Config ignored.`
+  );
+  const s = ue(W.PARENT_ID_KEY, D(void 0)), r = y(() => t.parentId || o?.config?.parentId || s.value), a = y(() => t.widgetId || o?.uid || Ie(e));
+  de(W.PARENT_ID_KEY, a);
+  const c = y(() => {
+    const l = o?.config || {}, u = Object.fromEntries(
+      Object.entries(t).filter(([m, O]) => O !== void 0 && m !== "treeNode" && m !== "widgetId")
+    );
+    return {
+      ...n,
+      ...l,
+      ...u,
+      id: a.value,
+      type: e,
+      parentId: r.value,
+      // 特殊处理 Layout：深度合并，确保即便只传了 { width: 100 } 也不丢失原来的 left/top
+      layout: {
+        ...n.layout || {},
+        ...l.layout || {},
+        ...u.layout || {}
+      }
+    };
+  });
+  return { uid: a, config: c };
+}
+const ke = ["id"], xe = /* @__PURE__ */ P({
+  __name: "InputZone",
+  props: {
+    treeNode: {},
+    widgetId: {},
+    layout: {},
+    preventFocusLoss: {}
+  },
+  setup(e) {
+    const t = e, n = fe(), i = D(null), { uid: o, config: s } = M(v.INPUT_ZONE, t), { core: r, state: a, elementRef: c } = U(
+      () => new Re(o.value, s.value)
+    ), l = y(() => {
+      const d = t.treeNode?.config?.dynamicWidgetId;
+      return t.treeNode?.children?.filter((b) => b.uid !== d) || [];
+    }), u = y(() => {
+      const b = (n.dynamicWidget?.() || []).filter((N) => !(N.type === Comment || N.type === Text)), I = t.treeNode?.children?.find(
+        (N) => N.uid === t.treeNode?.config?.dynamicWidgetId
+      ), $ = b.length > 0;
+      return b.length > 1 && console.error(
+        `[OmniPad-Validation] InputZone ${o.value} has multiple dynamic widgets in slot. Only the first one will be activated.`
+      ), $ && I && console.warn(
+        `[OmniPad-Validation] InputZone ${o.value} has both Slot and Config dynamic widgets. Config ignored.`
+      ), {
+        nodeToRender: $ ? b[0] : I || null,
+        isFromSlot: $
+      };
+    });
+    he(
+      i,
+      (d) => {
+        pe(() => {
+          d && d?.uid && r.value?.updateConfig({
+            dynamicWidgetId: d.uid
+          });
+        });
+      },
+      { immediate: !0 }
+    );
+    const m = y(() => V(s.value.layout)), O = y(() => a.value?.isDynamicActive ? {
+      position: "absolute",
+      left: `${a.value.dynamicPosition.x}%`,
+      top: `${a.value.dynamicPosition.y}%`,
+      zIndex: 100,
+      pointerEvents: "auto"
+    } : { display: "none" }), ne = (d) => {
+      r.value && (r.value.onPointerDown(d), a.value?.isDynamicActive && i.value && typeof i.value.onPointerDown == "function" && i.value.onPointerDown(d));
+    }, ie = (d) => {
+      r.value && (r.value.onPointerMove(d), a.value?.isDynamicActive && i.value && typeof i.value.onPointerMove == "function" && i.value.onPointerMove(d));
+    }, S = (d) => {
+      a.value?.isDynamicActive && i.value && typeof i.value.onPointerUp == "function" && i.value.onPointerUp(d), r.value && r.value.onPointerUp(d);
+    };
+    return (d, b) => (p(), E("div", {
+      id: h(o),
+      ref_key: "elementRef",
+      ref: c,
+      class: "omnipad-input-zone omnipad-prevent",
+      style: _(m.value)
+    }, [
+      L(te, { nodes: l.value }, {
+        default: K(() => [
+          k(d.$slots, "default", {}, void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["nodes"]),
+      h(r)?.isInterceptorRequired ? (p(), E("div", {
+        key: 0,
+        class: "omnipad-input-zone-trigger",
+        onPointerdown: ne,
+        onPointermove: ie,
+        onPointerup: S,
+        onPointercancel: S,
+        onLostpointercapture: S,
+        onPointerleave: S
+      }, [
+        G("div", {
+          class: "dynamic-widget-mount",
+          style: _(O.value)
+        }, [
+          u.value.isFromSlot ? (p(), C(Y(u.value.nodeToRender), {
+            key: 0,
+            ref: (I) => i.value = I
+          }, null, 512)) : u.value.nodeToRender ? (p(), C(Y(h(ee)(u.value.nodeToRender.type)), {
+            key: 1,
+            ref: (I) => i.value = I,
+            "tree-node": u.value.nodeToRender
+          }, null, 8, ["tree-node"])) : T("", !0)
+        ], 4)
+      ], 32)) : T("", !0)
+    ], 12, ke));
+  }
+}), Ue = /* @__PURE__ */ w(xe, [["__scopeId", "data-v-02669919"]]), Me = ["id"], $e = /* @__PURE__ */ P({
+  __name: "RootLayer",
+  props: {
+    treeNode: {},
+    widgetId: {}
+  },
+  setup(e) {
+    const t = e, { uid: n, config: i } = M(v.ROOT_LAYER, t), { elementRef: o } = U(() => new Se(n.value, i.value));
+    return (s, r) => (p(), E("div", {
+      id: h(n),
+      ref_key: "elementRef",
+      ref: o,
+      class: "omnipad-virtual-layer"
+    }, [
+      L(te, {
+        nodes: e.treeNode?.children || []
+      }, {
+        default: K(() => [
+          k(s.$slots, "default", {}, void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["nodes"])
+    ], 8, Me));
+  }
+}), Be = /* @__PURE__ */ w($e, [["__scopeId", "data-v-a509fd6e"]]), Fe = ["id"], Ye = /* @__PURE__ */ P({
+  __name: "TargetZone",
+  props: {
+    treeNode: {},
+    widgetId: {},
+    cursorEnabled: { type: Boolean },
+    cursorAutoDelay: {},
+    layout: {}
+  },
+  setup(e) {
+    const t = e, n = {
+      cursorAutoDelay: 2500
+    }, { uid: i, config: o } = M(v.TARGET_ZONE, t, n), { state: s, elementRef: r } = U(
+      () => new Ae(i.value, o.value)
+    ), a = y(() => V(o.value.layout)), c = y(() => s.value ? {
+      left: `${s.value.position.x}%`,
+      top: `${s.value.position.y}%`,
+      opacity: s.value.isVisible ? 1 : 0
+    } : { display: "none" });
+    return (l, u) => (p(), E("div", {
+      id: h(i),
+      ref_key: "elementRef",
+      ref: r,
+      class: "omnipad-target-zone",
+      style: _(a.value)
+    }, [
+      L(ve, { name: "pulse" }, {
+        default: K(() => [
+          h(s)?.isFocusReturning ? (p(), E("div", {
+            key: 0,
+            class: "focus-feedback-ring",
+            style: _({
+              left: `${h(s).position.x}%`,
+              top: `${h(s).position.y}%`
+            })
+          }, null, 4)) : T("", !0)
+        ]),
+        _: 1
+      }),
+      h(o).cursorEnabled ? (p(), E("div", {
+        key: 0,
+        class: "omnipad-virtual-cursor",
+        style: _(c.value)
+      }, [
+        G("div", {
+          class: j(["cursor-dot", { "is-down": h(s)?.isPointerDown }])
+        }, null, 2)
+      ], 4)) : T("", !0)
+    ], 12, Fe));
+  }
+}), Le = /* @__PURE__ */ w(Ye, [["__scopeId", "data-v-b9d49b97"]]), Ke = {
+  key: 0,
+  class: "omnipad-button-label"
+}, Ve = /* @__PURE__ */ P({
+  __name: "VirtualButtonBase",
+  props: {
+    layout: {},
+    isActive: { type: Boolean },
+    label: {}
+  },
+  setup(e) {
+    const t = e, n = y(() => t.layout ? V(t.layout) : {});
+    return (i, o) => (p(), E("div", {
+      class: j(["omnipad-button-base", { "omnipad-is-active": e.isActive }]),
+      style: _(n.value),
+      tabindex: "-1"
+    }, [
+      k(i.$slots, "default", {}, () => [
+        e.label ? (p(), E("span", Ke, me(e.label), 1)) : T("", !0)
+      ], !0)
+    ], 6));
+  }
+}), Ze = /* @__PURE__ */ w(Ve, [["__scopeId", "data-v-6cbe805c"]]), We = /* @__PURE__ */ P({
+  __name: "VirtualKeyboardButton",
+  props: {
+    treeNode: {},
+    widgetId: {},
+    label: {},
+    targetStageId: {},
+    mapping: {},
+    layout: {}
+  },
+  setup(e, { expose: t }) {
+    const n = e, i = {
+      label: "BTN"
+    }, { uid: o, config: s } = M(
+      v.KEYBOARD_BUTTON,
+      n,
+      i
+    ), { core: r, state: a, elementRef: c } = U(
+      () => new we(o.value, s.value)
+    ), l = (m) => r.value?.onPointerDown(m), u = (m) => r.value?.onPointerUp(m);
+    return t({
+      uid: o,
+      onPointerDown: l,
+      onPointerUp: u
+    }), (m, O) => (p(), C(Ze, {
+      id: h(o),
+      ref_key: "elementRef",
+      ref: c,
+      layout: h(s).layout,
+      label: h(s).label,
+      "is-active": h(a)?.isPressed,
+      onPointerdown: l,
+      onPointerup: u,
+      onPointercancel: u,
+      onLostpointercapture: u
+    }, null, 8, ["id", "layout", "label", "is-active"]));
+  }
+});
+x(v.INPUT_ZONE, Ue);
+x(v.ROOT_LAYER, Be);
+x(v.TARGET_ZONE, Le);
+x(v.KEYBOARD_BUTTON, We);
+export {
+  Ue as InputZone,
+  Be as RootLayer,
+  Le as TargetZone,
+  We as VirtualKeyboardButton,
+  x as registerComponent
+};

package/dist/omnipad-vue.umd.js ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,44 @@
+{
+  "name": "@omnipad/vue",
+  "version": "0.1.1-alpha.0",
+  "description": "",
+  "main": "./dist/omnipad-vue.umd.js",
+  "module": "./dist/omnipad-vue.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/omnipad-vue.mjs",
+      "require": "./dist/omnipad-vue.umd.js"
+    },
+    "./style.css": "./dist/omnipad-vue.css"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.3",
+    "typescript": "^5.9.3",
+    "vite": "^7.3.1",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.27"
+  },
+  "dependencies": {
+    "@omnipad/core": "0.1.1-alpha.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/omnipad-js/omnipad.git"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch"
+  }
+}