@omnipad/vue 0.4.0 → 0.4.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 omnipad-js
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -47,6 +47,7 @@ onPointerDown: (e: PointerEvent) => any;
 onPointerMove: (e: PointerEvent) => any;
 onPointerUp: (e: PointerEvent) => any;
 onPointerCancel: (e: PointerEvent) => any;
+markRectDirty: () => (() => void) | undefined;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<VirtualButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
 elementRef: ({
 $: ComponentInternalInstance;
@@ -118,6 +119,7 @@ onPointerDown: (e: PointerEvent) => any;
 onPointerMove: (e: PointerEvent) => any;
 onPointerUp: (e: PointerEvent) => any;
 onPointerCancel: (e: PointerEvent) => any;
+markRectDirty: () => void | undefined;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<VirtualDPadProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
 elementRef: ({
 $: ComponentInternalInstance;
@@ -199,6 +201,7 @@ onPointerDown: (e: PointerEvent) => any;
 onPointerMove: (e: PointerEvent) => any;
 onPointerUp: (e: PointerEvent) => any;
 onPointerCancel: (e: PointerEvent) => any;
+markRectDirty: () => (() => void) | undefined;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<VirtualTrackpadProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
 elementRef: ({
 $: ComponentInternalInstance;
@@ -270,6 +273,7 @@ onPointerDown: (e: PointerEvent) => any;
 onPointerMove: (e: PointerEvent) => any;
 onPointerUp: (e: PointerEvent) => any;
 onPointerCancel: (e: PointerEvent) => any;
+markRectDirty: () => (() => void) | undefined;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<VirtualJoystickProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
 elementRef: ({
 $: ComponentInternalInstance;

package/dist/omnipad-vue.css

@@ -1 +1 @@
-:root{--omnipad-btn-bg: rgba(255, 255, 255, .2);--omnipad-btn-border-color: rgba(255, 255, 255, .4);--omnipad-btn-border-style: solid;--omnipad-btn-border-width: 2px;--omnipad-btn-radius: 8px;--omnipad-btn-font-family: "Upheaval", "monacoregular", sans-serif;--omnipad-btn-font-size: 18px;--omnipad-btn-font-weight: bold;--omnipad-btn-label-color: #ffffff;--omnipad-btn-pressed-bg: rgba(255, 186, 67, .6);--omnipad-btn-pressed-border-color: #ffba43;--omnipad-btn-pressed-opacity: 1;--omnipad-btn-pressed-scale: .92;--omnipad-btn-transition-duration: .1s;--omnipad-btn-transition-timing: ease-out;--omnipad-dpad-arm-bg: rgba(255, 255, 255, .15);--omnipad-dpad-arm-border: 2px solid rgba(255, 255, 255, .4);--omnipad-dpad-arm-border-radius: 8px;--omnipad-dpad-active-bg: rgba(255, 186, 67, .6);--omnipad-dpad-active-border: #ffba43;--omnipad-dpad-active-scale: .96;--omnipad-dpad-active-transform: scale(var(--omnipad-dpad-active-scale));--omnipad-dpad-bg: rgba(255, 255, 255, .05);--omnipad-dpad-border-radius: 50%;--omnipad-default-cursor-height: 20px;--omnipad-default-cursor-width: 20px;--omnipad-default-cursor-transition: var(--omnipad-default-cursor-transition-mode) var(--omnipad-default-cursor-transition-time);--omnipad-default-cursor-transition-mode: opacity;--omnipad-default-cursor-transition-time: .2s;--omnipad-default-cursor-dot-background: #ff000080;--omnipad-default-cursor-dot-border-color: #ffffff;--omnipad-default-cursor-dot-border-radius: 50%;--omnipad-default-cursor-dot-border-style: solid;--omnipad-default-cursor-dot-border-width: 2px;--omnipad-default-cursor-dot-down-background: #ff0000;--omnipad-default-cursor-dot-down-scale: .8;--omnipad-default-axis-stick-bg: rgba(255, 255, 255, .4);--omnipad-default-axis-stick-border-color: rgba(255, 255, 255, .8);--omnipad-default-axis-stick-border-radius: 50%;--omnipad-default-axis-stick-border-style: solid;--omnipad-default-axis-stick-border-width: 2px;--omnipad-default-axis-stick-box-shadow: 0 4px 10px rgba(0, 0, 0, .3);--omnipad-default-axis-stick-height-scaler: .2;--omnipad-default-axis-stick-width-scaler: .2;--omnipad-default-axis-stick-active-bg: rgba(255, 186, 67, .6);--omnipad-default-axis-stick-active-border-color: #ffba43;--omnipad-focus-color: rgba(255, 186, 67, .8);--omnipad-focus-bg-color: rgba(100, 200, 255, .05);--omnipad-joystick-base-border-color: rgba(255, 255, 255, .4);--omnipad-joystick-base-border-radius: 50%;--omnipad-joystick-base-border-style: solid;--omnipad-joystick-base-border-width: 2px;--omnipad-joystick-base-bg: rgba(255, 255, 255, .2);--omnipad-default-joystick-stick-height-scaler: .5;--omnipad-default-joystick-stick-width-scaler: .5;--omnipad-joystick-btn-bg: rgba(255, 255, 255, .2);--omnipad-joystick-btn-border-color: rgba(255, 255, 255, .4);--omnipad-joystick-btn-border-style: solid;--omnipad-joystick-btn-border-width: 2px;--omnipad-joystick-btn-radius: 50%;--omnipad-trackpad-bg: rgba(255, 255, 255, .05);--omnipad-trackpad-border-style: dashed;--omnipad-trackpad-cursor: crosshair}.omnipad-default-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);transition:all var(--omnipad-btn-transition-duration) var(--omnipad-btn-transition-timing)}.omnipad-default-cursor-dot{width:100%;height:100%;box-sizing:border-box;background:var(--omnipad-default-cursor-dot-background);border-color:var(--omnipad-default-cursor-dot-border-color);border-radius:var(--omnipad-default-cursor-dot-border-radius);border-style:var(--omnipad-default-cursor-dot-border-style);border-width:var(--omnipad-default-cursor-dot-border-width)}.omnipad-default-cursor-dot.is-down{transform:scale(var(--omnipad-default-cursor-dot-down-scale));background:var(--omnipad-default-cursor-dot-down-background)}.omnipad-default-axis-stick{width:100%;height:100%;box-sizing:border-box;background:var(--omnipad-default-axis-stick-bg);border-width:var(--omnipad-default-axis-stick-border-width);border-style:var(--omnipad-default-axis-stick-border-style);border-color:var(--omnipad-default-axis-stick-border-color);border-radius:var(--omnipad-default-axis-stick-border-radius);box-shadow:var(--omnipad-default-axis-stick-box-shadow)}.omnipad-default-axis-stick.is-active{background:var(--omnipad-default-axis-stick-active-bg);border-color:var(--omnipad-default-axis-stick-active-border-color)}.omnipad-default-focus-border-feedback{position:absolute;inset:0;pointer-events:none;z-index:5;border:2px solid var(--omnipad-focus-color);background-color:var(--omnipad-focus-bg-color);box-shadow:inset 0 0 10px var(--omnipad-focus-color);box-sizing:border-box}.omnipad-default-focus-fade-enter-active{transition:opacity .05s ease-in}.omnipad-default-focus-fade-leave-active{transition:opacity .2s ease-out}.omnipad-default-focus-fade-enter-from,.omnipad-default-focus-fade-leave-to{opacity:0}.omnipad-prevent{touch-action:none;user-select:none;outline:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.omnipad-trackpad:before{content:"";position:absolute;inset:10px;background-image:radial-gradient(rgba(255,255,255,.1) 1px,transparent 1px);background-size:20px 20px;pointer-events:none}.omnipad-virtual-layer-base[data-v-d67cc501]{position:absolute;inset:0;pointer-events:none;z-index:1000}[data-v-d67cc501] .omnipad-input-zone,[data-v-d67cc501] .omnipad-button{pointer-events:auto}.omnipad-input-zone[data-v-b4ae3724]{position:relative;pointer-events:none;container-type:size}.omnipad-input-zone-trigger[data-v-b4ae3724]{position:absolute;inset:0;pointer-events:auto;background:transparent;touch-action:none}.dynamic-widget-mount[data-v-b4ae3724]{position:absolute;left:0;top:0;pointer-events:none;will-change:transform;transform:translate3d(var(--dynamic-widget-mount-x, 0px),var(--dynamic-widget-mount-y, 0px),0);--dynamic-widget-mount-x: 0px;--dynamic-widget-mount-y: 0px}.omnipad-root-layer[data-v-e53747a9]{position:relative;pointer-events:none}.omnipad-target-zone[data-v-44c28c60]{position:relative;pointer-events:auto;overflow:hidden;container-type:size}.omnipad-virtual-cursor[data-v-44c28c60]{position:absolute;top:0;left:0;width:var(--omnipad-default-cursor-width);height:var(--omnipad-default-cursor-height);pointer-events:none;will-change:transform;transition:var(--omnipad-default-cursor-transition);z-index:10;transform:translate3d(calc(-50% + var(--omnipad-virtual-cursor-x, 0px)),calc(-50% + var(--omnipad-virtual-cursor-y, 0px)),0);--omnipad-virtual-cursor-x: 0px;--omnipad-virtual-cursor-y: 0px}.omnipad-button-base[data-v-f6a6e082]{position:relative;overflow:hidden;box-sizing:border-box;pointer-events:auto;will-change:transform,opacity}.omnipad-default-button-base[data-v-f6a6e082]{position:absolute;inset:0;pointer-events:none}.omnipad-button-content-layer[data-v-f6a6e082]{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.omnipad-default-button-base.is-active[data-v-f6a6e082]{background:var(--omnipad-btn-pressed-bg, rgba(255, 255, 255, .4));border-color:var(--omnipad-btn-pressed-border-color);opacity:var(--omnipad-btn-pressed-opacity)}.omnipad-default-button-label[data-v-f6a6e082]{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)}.omnipad-axis-base[data-v-95bb429e]{position:relative;box-sizing:border-box;pointer-events:auto;container-type:size}.omnipad-axis-bg[data-v-95bb429e]{box-sizing:border-box;border-color:var(--omnipad-axis-base-border-color);border-radius:var(--omnipad-axis-base-border-radius);border-style:var(--omnipad-axis-base-border-style);border-width:var(--omnipad-axis-base-border-width);background:var(--omnipad-axis-base-bg)}.omnipad-axis-bg[data-v-95bb429e],.omnipad-axis-content-layer[data-v-95bb429e]{position:absolute;inset:0;pointer-events:none}.omnipad-axis-stick-container[data-v-95bb429e]{width:calc(var(--omnipad-axis-stick-width, 0px) * var(--omnipad-default-axis-stick-width-scaler, .2));height:calc(var(--omnipad-axis-stick-height, 0px) * var(--omnipad-default-axis-stick-height-scaler, .2));position:absolute;left:50%;top:50%;pointer-events:none;transform:translate3d(calc(-50% + var(--omnipad-axis-stick-container-x, 0px)),calc(-50% + var(--omnipad-axis-stick-container-y, 0px)),0);--omnipad-axis-stick-container-x: 0px;--omnipad-axis-stick-container-y: 0px}.omnipad-dpad-cross-bg[data-v-671bfba1]{position:relative;width:100%;height:100%;border-radius:var(--omnipad-dpad-border-radius);background:var(--omnipad-dpad-bg);pointer-events:none}.dpad-arm[data-v-671bfba1]{position:absolute;background:var(--omnipad-dpad-arm-bg);border:var(--omnipad-dpad-arm-border);box-sizing:border-box;transition:background .1s,transform .1s,border-color .1s}.dpad-arm.top[data-v-671bfba1]{inset:0 33% 66%;border-bottom:none;border-radius:var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius) 0 0}.dpad-arm.bottom[data-v-671bfba1]{inset:66% 33% 0;border-top:none;border-radius:0 0 var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius)}.dpad-arm.left[data-v-671bfba1]{inset:33% 66% 33% 0;border-right:none;border-radius:var(--omnipad-dpad-arm-border-radius) 0 0 var(--omnipad-dpad-arm-border-radius)}.dpad-arm.right[data-v-671bfba1]{inset:33% 0 33% 66%;border-left:none;border-radius:0 var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius) 0}.dpad-center[data-v-671bfba1]{position:absolute;inset:33%;background:var(--omnipad-dpad-arm-bg);z-index:1}.dpad-arm.on[data-v-671bfba1]{background:var(--omnipad-dpad-active-bg);border-color:var(--omnipad-dpad-active-border);transform:var(--omnipad-dpad-active-transform);z-index:2}.omnipad-trackpad[data-v-09cbc089]{--omnipad-btn-border-style: var(--omnipad-trackpad-border-style);--omnipad-btn-bg: var(--omnipad-trackpad-bg);cursor:var(--omnipad-trackpad-cursor)}.omnipad-joystick[data-v-00e7d4c0]{pointer-events:auto;--omnipad-axis-base-border-color: var(--omnipad-joystick-base-border-color);--omnipad-axis-base-border-radius: var(--omnipad-joystick-base-border-radius);--omnipad-axis-base-border-style: var(--omnipad-joystick-base-border-style);--omnipad-axis-base-border-width: var(--omnipad-joystick-base-border-width);--omnipad-axis-base-bg: var(--omnipad-joystick-base-bg, rgba(255, 255, 255, .2));--omnipad-default-axis-stick-height-scaler: var( --omnipad-default-joystick-stick-height-scaler, .5 );--omnipad-default-axis-stick-width-scaler: var( --omnipad-default-joystick-stick-width-scaler, .5 );--omnipad-btn-bg: var(--omnipad-joystick-btn-bg, rgba(255, 255, 255, .2));--omnipad-btn-border-color: var(--omnipad-joystick-btn-border-color);--omnipad-btn-border-style: var(--omnipad-joystick-btn-border-style);--omnipad-btn-border-width: var(--omnipad-joystick-btn-border-width);--omnipad-btn-radius: var(--omnipad-joystick-btn-radius)}
+:root{--omnipad-btn-bg: rgba(255, 255, 255, .2);--omnipad-btn-border-color: rgba(255, 255, 255, .4);--omnipad-btn-border-style: solid;--omnipad-btn-border-width: 2px;--omnipad-btn-radius: 8px;--omnipad-btn-font-family: "Upheaval", "monacoregular", sans-serif;--omnipad-btn-font-size: 18px;--omnipad-btn-font-weight: bold;--omnipad-btn-label-color: #ffffff;--omnipad-btn-pressed-bg: rgba(255, 186, 67, .6);--omnipad-btn-pressed-border-color: #ffba43;--omnipad-btn-pressed-opacity: 1;--omnipad-btn-pressed-scale: .92;--omnipad-btn-transition-duration: .1s;--omnipad-btn-transition-timing: ease-out;--omnipad-dpad-arm-bg: rgba(255, 255, 255, .15);--omnipad-dpad-arm-border: 2px solid rgba(255, 255, 255, .4);--omnipad-dpad-arm-border-radius: 8px;--omnipad-dpad-active-bg: rgba(255, 186, 67, .6);--omnipad-dpad-active-border: #ffba43;--omnipad-dpad-active-scale: .96;--omnipad-dpad-active-transform: scale(var(--omnipad-dpad-active-scale));--omnipad-dpad-bg: rgba(255, 255, 255, .05);--omnipad-dpad-border-radius: 50%;--omnipad-default-cursor-height: 20px;--omnipad-default-cursor-width: 20px;--omnipad-default-cursor-transition: var(--omnipad-default-cursor-transition-mode) var(--omnipad-default-cursor-transition-time);--omnipad-default-cursor-transition-mode: opacity;--omnipad-default-cursor-transition-time: .2s;--omnipad-default-cursor-dot-background: #ff000080;--omnipad-default-cursor-dot-border-color: #ffffff;--omnipad-default-cursor-dot-border-radius: 50%;--omnipad-default-cursor-dot-border-style: solid;--omnipad-default-cursor-dot-border-width: 2px;--omnipad-default-cursor-dot-down-background: #ff0000;--omnipad-default-cursor-dot-down-scale: .8;--omnipad-default-axis-stick-bg: rgba(255, 255, 255, .4);--omnipad-default-axis-stick-border-color: rgba(255, 255, 255, .8);--omnipad-default-axis-stick-border-radius: 50%;--omnipad-default-axis-stick-border-style: solid;--omnipad-default-axis-stick-border-width: 2px;--omnipad-default-axis-stick-box-shadow: 0 4px 10px rgba(0, 0, 0, .3);--omnipad-default-axis-stick-height-scaler: .2;--omnipad-default-axis-stick-width-scaler: .2;--omnipad-default-axis-stick-active-bg: rgba(255, 186, 67, .6);--omnipad-default-axis-stick-active-border-color: #ffba43;--omnipad-focus-color: rgba(255, 186, 67, .8);--omnipad-focus-bg-color: rgba(100, 200, 255, .05);--omnipad-joystick-base-border-color: rgba(255, 255, 255, .4);--omnipad-joystick-base-border-radius: 50%;--omnipad-joystick-base-border-style: solid;--omnipad-joystick-base-border-width: 2px;--omnipad-joystick-base-bg: rgba(255, 255, 255, .2);--omnipad-default-joystick-stick-height-scaler: .5;--omnipad-default-joystick-stick-width-scaler: .5;--omnipad-joystick-btn-bg: rgba(255, 255, 255, .2);--omnipad-joystick-btn-border-color: rgba(255, 255, 255, .4);--omnipad-joystick-btn-border-style: solid;--omnipad-joystick-btn-border-width: 2px;--omnipad-joystick-btn-radius: 50%;--omnipad-trackpad-bg: rgba(255, 255, 255, .05);--omnipad-trackpad-border-style: dashed;--omnipad-trackpad-cursor: crosshair}.omnipad-default-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);transition:all var(--omnipad-btn-transition-duration) var(--omnipad-btn-transition-timing)}.omnipad-default-cursor-dot{width:100%;height:100%;box-sizing:border-box;background:var(--omnipad-default-cursor-dot-background);border-color:var(--omnipad-default-cursor-dot-border-color);border-radius:var(--omnipad-default-cursor-dot-border-radius);border-style:var(--omnipad-default-cursor-dot-border-style);border-width:var(--omnipad-default-cursor-dot-border-width)}.omnipad-default-cursor-dot.is-down{transform:scale(var(--omnipad-default-cursor-dot-down-scale));background:var(--omnipad-default-cursor-dot-down-background)}.omnipad-default-axis-stick{width:100%;height:100%;box-sizing:border-box;background:var(--omnipad-default-axis-stick-bg);border-width:var(--omnipad-default-axis-stick-border-width);border-style:var(--omnipad-default-axis-stick-border-style);border-color:var(--omnipad-default-axis-stick-border-color);border-radius:var(--omnipad-default-axis-stick-border-radius);box-shadow:var(--omnipad-default-axis-stick-box-shadow)}.omnipad-default-axis-stick.is-active{background:var(--omnipad-default-axis-stick-active-bg);border-color:var(--omnipad-default-axis-stick-active-border-color)}.omnipad-default-focus-border-feedback{position:absolute;inset:0;pointer-events:none;z-index:5;border:2px solid var(--omnipad-focus-color);background-color:var(--omnipad-focus-bg-color);box-shadow:inset 0 0 10px var(--omnipad-focus-color);box-sizing:border-box}.omnipad-default-focus-fade-enter-active{transition:opacity .05s ease-in}.omnipad-default-focus-fade-leave-active{transition:opacity .2s ease-out}.omnipad-default-focus-fade-enter-from,.omnipad-default-focus-fade-leave-to{opacity:0}.omnipad-prevent{touch-action:none;user-select:none;outline:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.omnipad-trackpad:before{content:"";position:absolute;inset:10px;background-image:radial-gradient(rgba(255,255,255,.1) 1px,transparent 1px);background-size:20px 20px;pointer-events:none}.omnipad-virtual-layer-base[data-v-d67cc501]{position:absolute;inset:0;pointer-events:none;z-index:1000}[data-v-d67cc501] .omnipad-input-zone,[data-v-d67cc501] .omnipad-button{pointer-events:auto}.omnipad-input-zone[data-v-0a998e05]{position:relative;pointer-events:none;container-type:size}.omnipad-input-zone-trigger[data-v-0a998e05]{position:absolute;inset:0;pointer-events:auto;background:transparent;touch-action:none}.dynamic-widget-mount[data-v-0a998e05]{position:absolute;left:0;top:0;pointer-events:none;will-change:transform;transform:translate3d(var(--dynamic-widget-mount-x, 0px),var(--dynamic-widget-mount-y, 0px),0);--dynamic-widget-mount-x: 0px;--dynamic-widget-mount-y: 0px}.omnipad-root-layer[data-v-e53747a9]{position:relative;pointer-events:none}.omnipad-target-zone[data-v-44c28c60]{position:relative;pointer-events:auto;overflow:hidden;container-type:size}.omnipad-virtual-cursor[data-v-44c28c60]{position:absolute;top:0;left:0;width:var(--omnipad-default-cursor-width);height:var(--omnipad-default-cursor-height);pointer-events:none;will-change:transform;transition:var(--omnipad-default-cursor-transition);z-index:10;transform:translate3d(calc(-50% + var(--omnipad-virtual-cursor-x, 0px)),calc(-50% + var(--omnipad-virtual-cursor-y, 0px)),0);--omnipad-virtual-cursor-x: 0px;--omnipad-virtual-cursor-y: 0px}.omnipad-button-base[data-v-f6a6e082]{position:relative;overflow:hidden;box-sizing:border-box;pointer-events:auto;will-change:transform,opacity}.omnipad-default-button-base[data-v-f6a6e082]{position:absolute;inset:0;pointer-events:none}.omnipad-button-content-layer[data-v-f6a6e082]{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.omnipad-default-button-base.is-active[data-v-f6a6e082]{background:var(--omnipad-btn-pressed-bg, rgba(255, 255, 255, .4));border-color:var(--omnipad-btn-pressed-border-color);opacity:var(--omnipad-btn-pressed-opacity)}.omnipad-default-button-label[data-v-f6a6e082]{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)}.omnipad-axis-base[data-v-95bb429e]{position:relative;box-sizing:border-box;pointer-events:auto;container-type:size}.omnipad-axis-bg[data-v-95bb429e]{box-sizing:border-box;border-color:var(--omnipad-axis-base-border-color);border-radius:var(--omnipad-axis-base-border-radius);border-style:var(--omnipad-axis-base-border-style);border-width:var(--omnipad-axis-base-border-width);background:var(--omnipad-axis-base-bg)}.omnipad-axis-bg[data-v-95bb429e],.omnipad-axis-content-layer[data-v-95bb429e]{position:absolute;inset:0;pointer-events:none}.omnipad-axis-stick-container[data-v-95bb429e]{width:calc(var(--omnipad-axis-stick-width, 0px) * var(--omnipad-default-axis-stick-width-scaler, .2));height:calc(var(--omnipad-axis-stick-height, 0px) * var(--omnipad-default-axis-stick-height-scaler, .2));position:absolute;left:50%;top:50%;pointer-events:none;transform:translate3d(calc(-50% + var(--omnipad-axis-stick-container-x, 0px)),calc(-50% + var(--omnipad-axis-stick-container-y, 0px)),0);--omnipad-axis-stick-container-x: 0px;--omnipad-axis-stick-container-y: 0px}.omnipad-dpad-cross-bg[data-v-e1ecfcd0]{position:relative;width:100%;height:100%;border-radius:var(--omnipad-dpad-border-radius);background:var(--omnipad-dpad-bg);pointer-events:none}.dpad-arm[data-v-e1ecfcd0]{position:absolute;background:var(--omnipad-dpad-arm-bg);border:var(--omnipad-dpad-arm-border);box-sizing:border-box;transition:background .1s,transform .1s,border-color .1s}.dpad-arm.top[data-v-e1ecfcd0]{inset:0 33% 66%;border-bottom:none;border-radius:var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius) 0 0}.dpad-arm.bottom[data-v-e1ecfcd0]{inset:66% 33% 0;border-top:none;border-radius:0 0 var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius)}.dpad-arm.left[data-v-e1ecfcd0]{inset:33% 66% 33% 0;border-right:none;border-radius:var(--omnipad-dpad-arm-border-radius) 0 0 var(--omnipad-dpad-arm-border-radius)}.dpad-arm.right[data-v-e1ecfcd0]{inset:33% 0 33% 66%;border-left:none;border-radius:0 var(--omnipad-dpad-arm-border-radius) var(--omnipad-dpad-arm-border-radius) 0}.dpad-center[data-v-e1ecfcd0]{position:absolute;inset:33%;background:var(--omnipad-dpad-arm-bg);z-index:1}.dpad-arm.on[data-v-e1ecfcd0]{background:var(--omnipad-dpad-active-bg);border-color:var(--omnipad-dpad-active-border);transform:var(--omnipad-dpad-active-transform);z-index:2}.omnipad-trackpad[data-v-5cf9baf9]{--omnipad-btn-border-style: var(--omnipad-trackpad-border-style);--omnipad-btn-bg: var(--omnipad-trackpad-bg);cursor:var(--omnipad-trackpad-cursor)}.omnipad-joystick[data-v-2255ec27]{pointer-events:auto;--omnipad-axis-base-border-color: var(--omnipad-joystick-base-border-color);--omnipad-axis-base-border-radius: var(--omnipad-joystick-base-border-radius);--omnipad-axis-base-border-style: var(--omnipad-joystick-base-border-style);--omnipad-axis-base-border-width: var(--omnipad-joystick-base-border-width);--omnipad-axis-base-bg: var(--omnipad-joystick-base-bg, rgba(255, 255, 255, .2));--omnipad-default-axis-stick-height-scaler: var( --omnipad-default-joystick-stick-height-scaler, .5 );--omnipad-default-axis-stick-width-scaler: var( --omnipad-default-joystick-stick-width-scaler, .5 );--omnipad-btn-bg: var(--omnipad-joystick-btn-bg, rgba(255, 255, 255, .2));--omnipad-btn-border-color: var(--omnipad-joystick-btn-border-color);--omnipad-btn-border-style: var(--omnipad-joystick-btn-border-style);--omnipad-btn-border-width: var(--omnipad-joystick-btn-border-width);--omnipad-btn-radius: var(--omnipad-joystick-btn-radius)}

package/dist/omnipad-vue.mjs

@@ -1,108 +1,117 @@
-import { Registry as ae, CONTEXT as ee, CMP_TYPES as D, InputZoneCore as re, RootLayerCore as ce, TargetZoneCore as le, ButtonCore as ue, DPadCore as de, TrackpadCore as ve, JoystickCore as pe } from "@omnipad/core";
-import { defineComponent as E, h as me, shallowRef as fe, ref as V, onMounted as ye, onUnmounted as Pe, computed as _, openBlock as w, createElementBlock as A, Fragment as ge, renderList as be, createBlock as L, resolveDynamicComponent as X, renderSlot as g, inject as he, provide as we, useSlots as _e, watch as Ce, nextTick as $e, normalizeStyle as B, normalizeClass as C, unref as o, createVNode as J, withCtx as $, createElementVNode as T, createCommentVNode as M, Transition as Re, toDisplayString as ke, normalizeProps as N, guardReactiveProps as x, watchEffect as oe } from "vue";
-import { createPointerBridge as De, generateUID as Te, resolveLayoutStyle as j, supportsContainerQueries as q, remap as W, reclaimFocusAtPos as Ae, dispatchPointerEventAtPos as Ie, dispatchKeyboardEvent as Ne } from "@omnipad/core/utils";
-const z = {};
-function Z(e, s) {
-  z[e] = s;
+import { Registry as ae, WindowManager as re, CONTEXT as ee, CMP_TYPES as D, InputZoneCore as ce, RootLayerCore as le, TargetZoneCore as ue, ButtonCore as de, DPadCore as ve, TrackpadCore as pe, JoystickCore as me } from "@omnipad/core";
+import { defineComponent as S, h as fe, shallowRef as ye, ref as V, onMounted as Pe, onUnmounted as ge, computed as _, openBlock as R, createElementBlock as A, Fragment as be, renderList as he, createBlock as L, resolveDynamicComponent as X, renderSlot as h, inject as we, provide as Re, useSlots as _e, watch as Ce, nextTick as ke, normalizeStyle as B, normalizeClass as k, unref as o, createVNode as J, withCtx as $, createElementVNode as T, createCommentVNode as M, Transition as $e, toDisplayString as De, normalizeProps as x, guardReactiveProps as E, watchEffect as oe } from "vue";
+import { createCachedProvider as Te, createPointerBridge as Ae, generateUID as Ie, resolveLayoutStyle as j, supportsContainerQueries as q, remap as W, reclaimFocusAtPos as Ne, dispatchPointerEventAtPos as xe, dispatchKeyboardEvent as Ee } from "@omnipad/core/utils";
+const K = {};
+function Z(e, i) {
+  K[e] = i;
 }
 function ne(e) {
-  const s = z[e];
-  return s || E({
-    render: () => me("div", { style: "color:red" }, `[Unknown: ${e}]`)
+  const i = K[e];
+  return i || S({
+    render: () => fe("div", { style: "color:red" }, `[Unknown: ${e}]`)
   });
 }
 function te(e) {
-  return !e || !z[e] ? null : z[e];
+  return !e || !K[e] ? null : K[e];
 }
-function rt(e) {
-  return e ? !!z[e] : !1;
+function lt(e) {
+  return e ? !!K[e] : !1;
 }
-function F(e, s = {}, u) {
-  const t = e(), n = fe(), r = V(), p = V(null), i = V({}), d = (a) => {
-    r.value = a;
-  }, y = (a) => {
+function F(e, i = {}, u) {
+  const t = e(), n = ye(), a = V(), y = V(null), s = V({});
+  let d = null;
+  const b = (v) => {
+    a.value = v;
+  }, c = (v) => {
     if (!n.value) return;
-    const b = n.value;
-    typeof b.bindDelegate == "function" && Object.entries(a).forEach(([P, l]) => {
-      b.bindDelegate(P, l);
+    const p = n.value;
+    typeof p.bindDelegate == "function" && Object.entries(v).forEach(([P, f]) => {
+      p.bindDelegate(P, f);
     });
   };
-  return ye(() => {
-    n.value = t, ae.getInstance().register(t), "subscribe" in t && t.subscribe(d), u && y(u);
-    let a = null;
-    if (p.value && (p.value instanceof Element ? a = p.value : p.value.$el instanceof Element && (a = p.value.$el)), a && "bindRectProvider" in t && t.bindRectProvider(() => a.getBoundingClientRect()), "onPointerDown" in t) {
-      const b = De(t, s);
-      i.value = { ...b };
+  return Pe(() => {
+    n.value = t, ae.getInstance().register(t), "subscribe" in t && t.subscribe(b), u && c(u);
+    let v = null;
+    if (y.value && (y.value instanceof Element ? v = y.value : y.value.$el instanceof Element && (v = y.value.$el)), v && "bindRectProvider" in t) {
+      const p = t, P = Te(() => v.getBoundingClientRect());
+      p.bindRectProvider(P.get, P.markDirty), d = new ResizeObserver(() => {
+        p.markRectDirty();
+      }), d.observe(v);
     }
-  }), Pe(() => {
-    n.value && n.value.destroy();
+    if ("onPointerDown" in t) {
+      const p = Ae(t, i);
+      s.value = { ...p };
+    }
+    re.getInstance().init();
+  }), ge(() => {
+    d && (d.disconnect(), d = null), n.value && n.value.destroy();
   }), {
     core: n,
-    state: r,
-    elementRef: p,
-    domEvents: i,
-    bindDelegates: y
+    state: a,
+    elementRef: y,
+    domEvents: s,
+    bindDelegates: c
   };
 }
-const xe = { class: "omnipad-virtual-layer-base omnipad-prevent" }, Ee = /* @__PURE__ */ E({
+const Se = { class: "omnipad-virtual-layer-base omnipad-prevent" }, Ue = /* @__PURE__ */ S({
   __name: "VirtualLayerBase",
   props: {
     nodes: {}
   },
   setup(e) {
-    const s = e, u = _(() => (s.nodes || []).map((t) => {
+    const i = e, u = _(() => (i.nodes || []).map((t) => {
       let n = te(t.type);
       return !n && t.config?.baseType && (n = te(t.config.baseType)), n || (n = ne(t.type)), {
         node: t,
         component: n
       };
     }));
-    return (t, n) => (w(), A("div", xe, [
-      (w(!0), A(ge, null, be(u.value, (r) => (w(), L(X(r.component), {
-        key: r.node.uid,
-        "tree-node": r.node
+    return (t, n) => (R(), A("div", Se, [
+      (R(!0), A(be, null, he(u.value, (a) => (R(), L(X(a.component), {
+        key: a.node.uid,
+        "tree-node": a.node
       }, null, 8, ["tree-node"]))), 128)),
-      g(t.$slots, "default", {}, void 0, !0)
+      h(t.$slots, "default", {}, void 0, !0)
     ]));
   }
-}), O = (e, s) => {
+}), O = (e, i) => {
   const u = e.__vccOpts || e;
-  for (const [t, n] of s)
+  for (const [t, n] of i)
     u[t] = n;
   return u;
-}, se = /* @__PURE__ */ O(Ee, [["__scopeId", "data-v-d67cc501"]]);
-function Y(e, s, u = {}) {
-  const t = s.treeNode, n = t && t.config?.baseType === e || t?.type === e ? t : void 0;
+}, se = /* @__PURE__ */ O(Ue, [["__scopeId", "data-v-d67cc501"]]);
+function z(e, i, u = {}) {
+  const t = i.treeNode, n = t && t.config?.baseType === e || t?.type === e ? t : void 0;
   t && !n && console.warn(
     `[OmniPad-Validation] Type mismatch! Component expected "${e}", but received "${t.type}". Config ignored.`
   );
-  const r = he(ee.PARENT_ID_KEY, V(void 0)), p = _(() => s.parentId || n?.config?.parentId || r.value), i = _(() => s.widgetId || n?.uid || Te(e));
-  we(ee.PARENT_ID_KEY, i);
+  const a = we(ee.PARENT_ID_KEY, V(void 0)), y = _(() => i.parentId || n?.config?.parentId || a.value), s = _(() => i.widgetId || n?.uid || Ie(e));
+  Re(ee.PARENT_ID_KEY, s);
   const d = _(() => {
-    const a = n?.config || {}, b = Object.fromEntries(
-      Object.entries(s).filter(([P, l]) => l !== void 0 && P !== "treeNode" && P !== "widgetId")
+    const c = n?.config || {}, v = Object.fromEntries(
+      Object.entries(i).filter(([p, P]) => P !== void 0 && p !== "treeNode" && p !== "widgetId")
     );
     return {
       ...u,
-      ...a,
-      ...b,
-      id: i.value,
+      ...c,
+      ...v,
+      id: s.value,
       baseType: e,
-      parentId: p.value,
+      parentId: y.value,
       // 特殊处理 Layout：深度合并，确保即便只传了 { width: 100 } 也不丢失原来的 left/top
       layout: {
         ...u.layout || {},
-        ...a.layout || {},
-        ...b.layout || {}
+        ...c.layout || {},
+        ...v.layout || {}
       }
     };
-  }), y = _(() => {
-    const a = d.value.cssClasses;
-    return a ? Array.isArray(a) ? a : [a] : [];
+  }), b = _(() => {
+    const c = d.value.cssClasses;
+    return c ? Array.isArray(c) ? c : [c] : [];
   });
-  return { uid: i, config: d, customClasses: y };
+  return { uid: s, config: d, customClasses: b };
 }
-const Se = ["id"], Ue = /* @__PURE__ */ E({
+const Be = ["id"], Oe = /* @__PURE__ */ S({
   __name: "InputZone",
   props: {
     treeNode: {},
@@ -111,103 +120,105 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     preventFocusLoss: {}
   },
   setup(e) {
-    const s = e, u = _e(), t = V(null), { uid: n, config: r, customClasses: p } = Y(
+    const i = e, u = _e(), t = V(null), { uid: n, config: a, customClasses: y } = z(
       D.INPUT_ZONE,
-      s
-    ), { core: i, state: d, elementRef: y, domEvents: a, bindDelegates: b } = F(() => new re(n.value, r.value), { requireDirectHit: !0 }), P = _(() => {
-      const v = s.treeNode?.config?.dynamicWidgetId;
-      return s.treeNode?.children?.filter((U) => U.uid !== v) || [];
-    }), l = _(() => {
-      const U = (u.dynamicWidget?.() || []).filter((Q) => !(Q.type === Comment || Q.type === Text)), I = s.treeNode?.children?.find(
-        (Q) => Q.uid === s.treeNode?.config?.dynamicWidgetId
-      ), K = U.length > 0;
-      return U.length > 1 && console.error(
+      i
+    ), { core: s, state: d, elementRef: b, domEvents: c, bindDelegates: v } = F(() => new ce(n.value, a.value), { requireDirectHit: !0 }), p = _(() => {
+      const m = i.treeNode?.config?.dynamicWidgetId;
+      return i.treeNode?.children?.filter((I) => I.uid !== m) || [];
+    }), P = _(() => {
+      const I = (u.dynamicWidget?.() || []).filter((Q) => !(Q.type === Comment || Q.type === Text)), N = i.treeNode?.children?.find(
+        (Q) => Q.uid === i.treeNode?.config?.dynamicWidgetId
+      ), Y = I.length > 0;
+      return I.length > 1 && console.error(
         `[OmniPad-Validation] InputZone ${n.value} has multiple dynamic widgets in slot. Only the first one will be activated.`
-      ), K && I && console.warn(
+      ), Y && N && console.warn(
         `[OmniPad-Validation] InputZone ${n.value} has both Slot and Config dynamic widgets. Config ignored.`
       ), {
-        nodeToRender: K ? U[0] : I || null,
-        isFromSlot: K
+        nodeToRender: Y ? I[0] : N || null,
+        isFromSlot: Y
       };
-    }), h = _(() => {
-      const v = l.value.nodeToRender;
-      return ne(v.config?.baseType || v.type);
+    }), f = _(() => {
+      const m = P.value.nodeToRender;
+      return ne(m.config?.baseType || m.type);
     });
     Ce(
       t,
-      (v) => {
-        $e(() => {
-          v && v?.uid && (i.value?.updateConfig({
-            dynamicWidgetId: v.uid
-          }), b({
-            dynamicWidgetPointerDown: v.onPointerDown,
-            dynamicWidgetPointerMove: v.onPointerMove,
-            dynamicWidgetPointerUp: v.onPointerUp,
-            dynamicWidgetPointerCancel: v.onPointerCancel
+      (m) => {
+        ke(() => {
+          m && m?.uid && (s.value?.updateConfig({
+            dynamicWidgetId: m.uid
+          }), v({
+            dynamicWidgetPointerDown: (I) => {
+              m.markRectDirty?.(), m.onPointerDown?.(I);
+            },
+            dynamicWidgetPointerMove: m.onPointerMove,
+            dynamicWidgetPointerUp: m.onPointerUp,
+            dynamicWidgetPointerCancel: m.onPointerCancel
           }));
         });
       },
       { immediate: !0 }
     );
-    const R = _(() => j(r.value.layout)), k = q(), m = _(() => {
+    const w = _(() => j(a.value.layout)), C = q(), l = _(() => {
       if (!d.value) return { display: "none" };
       if (!d.value?.isDynamicActive) return { visibility: "hidden", opacity: 0 };
-      let v, U;
-      const I = d?.value?.dynamicPosition;
-      if (k)
-        v = `${I.x}cqw`, U = `${I.y}cqh`;
+      let m, I;
+      const N = d?.value?.dynamicPosition;
+      if (C)
+        m = `${N.x}cqw`, I = `${N.y}cqh`;
       else {
-        const K = i?.value?.rect;
-        v = `${W(I?.x || 0, 0, 100, 0, K?.width || 0)}px`, U = `${W(I?.y || 0, 0, 100, 0, K?.height || 0)}px`;
+        const Y = s?.value?.rect;
+        m = `${W(N?.x || 0, 0, 100, 0, Y?.width || 0)}px`, I = `${W(N?.y || 0, 0, 100, 0, Y?.height || 0)}px`;
       }
       return {
         zIndex: 100,
-        "--dynamic-widget-mount-x": v,
-        "--dynamic-widget-mount-y": U,
+        "--dynamic-widget-mount-x": m,
+        "--dynamic-widget-mount-y": I,
         visibility: "visible",
         opacity: 1,
         pointerEvents: "auto"
       };
-    }), c = (v) => a.value?.onPointerDown(v), S = (v) => a.value?.onPointerMove(v), f = (v) => a.value?.onPointerUp(v), H = (v) => a.value?.onPointerCancel(v);
-    return (v, U) => (w(), A("div", {
+    }), r = (m) => c.value?.onPointerDown(m), U = (m) => c.value?.onPointerMove(m), g = (m) => c.value?.onPointerUp(m), H = (m) => c.value?.onPointerCancel(m);
+    return (m, I) => (R(), A("div", {
       id: o(n),
       ref_key: "elementRef",
-      ref: y,
-      class: C(["omnipad-input-zone omnipad-prevent", o(p)]),
-      style: B(R.value)
+      ref: b,
+      class: k(["omnipad-input-zone omnipad-prevent", o(y)]),
+      style: B(w.value)
     }, [
-      J(se, { nodes: P.value }, {
+      J(se, { nodes: p.value }, {
         default: $(() => [
-          g(v.$slots, "default", {}, void 0, !0)
+          h(m.$slots, "default", {}, void 0, !0)
         ]),
         _: 3
       }, 8, ["nodes"]),
-      l.value.nodeToRender || o(i)?.isInterceptorRequired ? (w(), A("div", {
+      P.value.nodeToRender || o(s)?.isInterceptorRequired ? (R(), A("div", {
         key: 0,
         class: "omnipad-input-zone-trigger omnipad-prevent",
-        onPointerdown: c,
-        onPointermove: S,
-        onPointerup: f,
+        onPointerdown: r,
+        onPointermove: U,
+        onPointerup: g,
         onPointercancel: H,
         onLostpointercapture: H
       }, [
         T("div", {
           class: "dynamic-widget-mount",
-          style: B(m.value)
+          style: B(l.value)
         }, [
-          l.value.isFromSlot ? (w(), L(X(l.value.nodeToRender), {
+          P.value.isFromSlot ? (R(), L(X(P.value.nodeToRender), {
             key: 0,
-            ref: (I) => t.value = I
-          }, null, 512)) : l.value.nodeToRender ? (w(), L(X(h.value), {
+            ref: (N) => t.value = N
+          }, null, 512)) : P.value.nodeToRender ? (R(), L(X(f.value), {
             key: 1,
-            ref: (I) => t.value = I,
-            "tree-node": l.value.nodeToRender
+            ref: (N) => t.value = N,
+            "tree-node": P.value.nodeToRender
           }, null, 8, ["tree-node"])) : M("", !0)
         ], 4)
       ], 32)) : M("", !0)
-    ], 14, Se));
+    ], 14, Be));
   }
-}), Be = /* @__PURE__ */ O(Ue, [["__scopeId", "data-v-b4ae3724"]]), Oe = ["id"], Ve = /* @__PURE__ */ E({
+}), Ve = /* @__PURE__ */ O(Oe, [["__scopeId", "data-v-0a998e05"]]), Me = ["id"], Le = /* @__PURE__ */ S({
   __name: "RootLayer",
   props: {
     treeNode: {},
@@ -215,28 +226,28 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     layout: {}
   },
   setup(e) {
-    const s = e, { uid: u, config: t, customClasses: n } = Y(D.ROOT_LAYER, s), { elementRef: r } = F(() => new ce(u.value, t.value)), p = _(() => j(t.value.layout));
-    return (i, d) => (w(), A("div", {
+    const i = e, { uid: u, config: t, customClasses: n } = z(D.ROOT_LAYER, i), { elementRef: a } = F(() => new le(u.value, t.value)), y = _(() => j(t.value.layout));
+    return (s, d) => (R(), A("div", {
       id: o(u),
       ref_key: "elementRef",
-      ref: r,
-      class: C(["omnipad-root-layer omnipad-prevent", o(n)]),
-      style: B(p.value)
+      ref: a,
+      class: k(["omnipad-root-layer omnipad-prevent", o(n)]),
+      style: B(y.value)
     }, [
       J(se, {
         nodes: e.treeNode?.children || []
       }, {
         default: $(() => [
-          g(i.$slots, "default", {}, void 0, !0)
+          h(s.$slots, "default", {}, void 0, !0)
         ]),
         _: 3
       }, 8, ["nodes"])
-    ], 14, Oe));
+    ], 14, Me));
   }
-}), Me = /* @__PURE__ */ O(Ve, [["__scopeId", "data-v-e53747a9"]]), Le = ["id"], Ze = {
+}), Ze = /* @__PURE__ */ O(Le, [["__scopeId", "data-v-e53747a9"]]), Fe = ["id"], ze = {
   key: 0,
   class: "omnipad-default-focus-border-feedback"
-}, Fe = /* @__PURE__ */ E({
+}, Ye = /* @__PURE__ */ S({
   __name: "TargetZone",
   props: {
     treeNode: {},
@@ -246,100 +257,100 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     layout: {}
   },
   setup(e) {
-    const s = e, u = {
+    const i = e, u = {
       cursorAutoDelay: 2500
-    }, { uid: t, config: n, customClasses: r } = Y(
+    }, { uid: t, config: n, customClasses: a } = z(
       D.TARGET_ZONE,
-      s,
+      i,
       u
-    ), { core: p, state: i, elementRef: d, domEvents: y } = F(
-      () => new le(t.value, n.value),
+    ), { core: y, state: s, elementRef: d, domEvents: b } = F(
+      () => new ue(t.value, n.value),
       {},
       {
-        dispatchKeyboardEvent: Ne,
-        dispatchPointerEventAtPos: Ie,
-        reclaimFocusAtPos: Ae
+        dispatchKeyboardEvent: Ee,
+        dispatchPointerEventAtPos: xe,
+        reclaimFocusAtPos: Ne
       }
-    ), a = _(() => j(n.value.layout)), b = q(), P = _(() => {
-      if (!i.value) return { display: "none" };
-      let m, c;
-      const S = i?.value?.position;
-      if (b)
-        m = `${S.x}cqw`, c = `${S.y}cqh`;
+    ), c = _(() => j(n.value.layout)), v = q(), p = _(() => {
+      if (!s.value) return { display: "none" };
+      let l, r;
+      const U = s?.value?.position;
+      if (v)
+        l = `${U.x}cqw`, r = `${U.y}cqh`;
       else {
-        const f = p?.value?.rect;
-        m = `${W(S?.x || 0, 0, 100, 0, f?.width || 0)}px`, c = `${W(S?.y || 0, 0, 100, 0, f?.height || 0)}px`;
+        const g = y?.value?.rect;
+        l = `${W(U?.x || 0, 0, 100, 0, g?.width || 0)}px`, r = `${W(U?.y || 0, 0, 100, 0, g?.height || 0)}px`;
       }
       return {
-        "--omnipad-virtual-cursor-x": m,
-        "--omnipad-virtual-cursor-y": c,
-        opacity: i.value.isVisible ? 1 : 0
+        "--omnipad-virtual-cursor-x": l,
+        "--omnipad-virtual-cursor-y": r,
+        opacity: s.value.isVisible ? 1 : 0
       };
-    }), l = (m) => y.value?.onPointerDown(m), h = (m) => y.value?.onPointerMove(m), R = (m) => y.value?.onPointerUp(m), k = (m) => y.value?.onPointerCancel(m);
-    return (m, c) => (w(), A("div", {
+    }), P = (l) => b.value?.onPointerDown(l), f = (l) => b.value?.onPointerMove(l), w = (l) => b.value?.onPointerUp(l), C = (l) => b.value?.onPointerCancel(l);
+    return (l, r) => (R(), A("div", {
       id: o(t),
       ref_key: "elementRef",
       ref: d,
-      class: C(["omnipad-target-zone omnipad-prevent", o(r)]),
-      style: B(a.value),
-      onPointerdown: l,
-      onPointermove: h,
-      onPointerup: R,
-      onPointercancel: k,
-      onLostpointercapture: k
+      class: k(["omnipad-target-zone omnipad-prevent", o(a)]),
+      style: B(c.value),
+      onPointerdown: P,
+      onPointermove: f,
+      onPointerup: w,
+      onPointercancel: C,
+      onLostpointercapture: C
     }, [
-      g(m.$slots, "focus-feedback", {
-        state: o(i),
-        isReturning: o(i)?.isFocusReturning,
-        cursorPos: o(i)?.position
+      h(l.$slots, "focus-feedback", {
+        state: o(s),
+        isReturning: o(s)?.isFocusReturning,
+        cursorPos: o(s)?.position
       }, () => [
-        J(Re, { name: "omnipad-default-focus-fade" }, {
+        J($e, { name: "omnipad-default-focus-fade" }, {
           default: $(() => [
-            o(i)?.isFocusReturning ? (w(), A("div", Ze)) : M("", !0)
+            o(s)?.isFocusReturning ? (R(), A("div", ze)) : M("", !0)
           ]),
           _: 1
         })
       ], !0),
-      o(n).cursorEnabled ? (w(), A("div", {
+      o(n).cursorEnabled ? (R(), A("div", {
         key: 0,
         class: "omnipad-virtual-cursor",
-        style: B(P.value)
+        style: B(p.value)
       }, [
-        g(m.$slots, "cursor", {
-          state: o(i),
-          isDown: o(i)?.isPointerDown,
-          isReturning: o(i)?.isFocusReturning,
-          cursorPos: o(i)?.position
+        h(l.$slots, "cursor", {
+          state: o(s),
+          isDown: o(s)?.isPointerDown,
+          isReturning: o(s)?.isFocusReturning,
+          cursorPos: o(s)?.position
         }, () => [
           T("div", {
-            class: C(["omnipad-default-cursor-dot", { "is-down": o(i)?.isPointerDown }])
+            class: k(["omnipad-default-cursor-dot", { "is-down": o(s)?.isPointerDown }])
           }, null, 2)
         ], !0)
       ], 4)) : M("", !0),
-      o(n).cursorEnabled ? (w(), A("div", {
+      o(n).cursorEnabled ? (R(), A("div", {
         key: 1,
         class: "omnipad-virtual-cursor",
-        style: B(P.value)
+        style: B(p.value)
       }, [
-        g(m.$slots, "with-cursor", {
-          state: o(i),
-          isDown: o(i)?.isPointerDown,
-          isReturning: o(i)?.isFocusReturning,
-          cursorPos: o(i)?.position
+        h(l.$slots, "with-cursor", {
+          state: o(s),
+          isDown: o(s)?.isPointerDown,
+          isReturning: o(s)?.isFocusReturning,
+          cursorPos: o(s)?.position
         }, void 0, !0)
       ], 4)) : M("", !0),
-      g(m.$slots, "default", {
-        state: o(i),
-        isDown: o(i)?.isPointerDown,
-        isReturning: o(i)?.isFocusReturning,
-        cursorPos: o(i)?.position
+      h(l.$slots, "default", {
+        state: o(s),
+        isDown: o(s)?.isPointerDown,
+        isReturning: o(s)?.isFocusReturning,
+        cursorPos: o(s)?.position
       }, void 0, !0)
-    ], 46, Le));
+    ], 46, Fe));
   }
-}), Ye = /* @__PURE__ */ O(Fe, [["__scopeId", "data-v-44c28c60"]]), Ke = { class: "omnipad-button-content-layer" }, ze = {
+}), Ke = /* @__PURE__ */ O(Ye, [["__scopeId", "data-v-44c28c60"]]), je = { class: "omnipad-button-content-layer" }, qe = {
   key: 0,
   class: "omnipad-default-button-label"
-}, je = /* @__PURE__ */ E({
+}, Qe = /* @__PURE__ */ S({
   __name: "VirtualButtonBase",
   props: {
     layout: {},
@@ -347,31 +358,31 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     label: {}
   },
   setup(e) {
-    const s = e, u = _(() => s.layout ? j(s.layout) : {});
-    return (t, n) => (w(), A("div", {
+    const i = e, u = _(() => i.layout ? j(i.layout) : {});
+    return (t, n) => (R(), A("div", {
       class: "omnipad-button-base omnipad-prevent",
       style: B(u.value),
       tabindex: "-1"
     }, [
-      g(t.$slots, "base", {
+      h(t.$slots, "base", {
         isActive: e.isActive,
         label: e.label
       }, () => [
         T("div", {
-          class: C(["omnipad-default-button-base", { "is-active": e.isActive }])
+          class: k(["omnipad-default-button-base", { "is-active": e.isActive }])
         }, null, 2)
       ], !0),
-      T("div", Ke, [
-        g(t.$slots, "default", {
+      T("div", je, [
+        h(t.$slots, "default", {
           isActive: e.isActive,
           label: e.label
         }, () => [
-          e.label ? (w(), A("span", ze, ke(e.label), 1)) : M("", !0)
+          e.label ? (R(), A("span", qe, De(e.label), 1)) : M("", !0)
         ], !0)
       ])
     ], 4));
   }
-}), G = /* @__PURE__ */ O(je, [["__scopeId", "data-v-f6a6e082"]]), qe = /* @__PURE__ */ E({
+}), G = /* @__PURE__ */ O(Qe, [["__scopeId", "data-v-f6a6e082"]]), We = /* @__PURE__ */ S({
   __name: "VirtualButton",
   props: {
     treeNode: {},
@@ -381,45 +392,46 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     mapping: {},
     layout: {}
   },
-  setup(e, { expose: s }) {
+  setup(e, { expose: i }) {
     const u = e, t = {
       label: "BTN"
-    }, { uid: n, config: r, customClasses: p } = Y(
+    }, { uid: n, config: a, customClasses: y } = z(
       D.BUTTON,
       u,
       t
-    ), { state: i, elementRef: d, domEvents: y } = F(
-      () => new ue(n.value, r.value)
-    ), a = (h) => y.value?.onPointerDown(h), b = (h) => y.value?.onPointerMove(h), P = (h) => y.value?.onPointerUp(h), l = (h) => y.value?.onPointerCancel(h);
-    return s({
+    ), { core: s, state: d, elementRef: b, domEvents: c } = F(
+      () => new de(n.value, a.value)
+    ), v = (w) => c.value?.onPointerDown(w), p = (w) => c.value?.onPointerMove(w), P = (w) => c.value?.onPointerUp(w), f = (w) => c.value?.onPointerCancel(w);
+    return i({
       uid: n,
-      onPointerDown: a,
-      onPointerMove: b,
+      onPointerDown: v,
+      onPointerMove: p,
       onPointerUp: P,
-      onPointerCancel: l
-    }), (h, R) => (w(), L(G, {
+      onPointerCancel: f,
+      markRectDirty: () => s.value?.markRectDirty
+    }), (w, C) => (R(), L(G, {
       id: o(n),
       ref_key: "elementRef",
-      ref: d,
-      class: C(["omnipad-button omnipad-prevent", o(p)]),
-      layout: o(r).layout,
-      label: o(r).label,
-      "is-active": o(i)?.isPressed,
-      onPointerdown: a,
+      ref: b,
+      class: k(["omnipad-button omnipad-prevent", o(y)]),
+      layout: o(a).layout,
+      label: o(a).label,
+      "is-active": o(d)?.isPressed,
+      onPointerdown: v,
       onPointerup: P,
-      onPointercancel: l,
-      onLostpointercapture: l
+      onPointercancel: f,
+      onLostpointercapture: f
     }, {
-      base: $((k) => [
-        g(h.$slots, "base", N(x(k)))
+      base: $((l) => [
+        h(w.$slots, "base", x(E(l)))
       ]),
-      default: $((k) => [
-        g(h.$slots, "default", N(x(k)))
+      default: $((l) => [
+        h(w.$slots, "default", x(E(l)))
       ]),
       _: 3
     }, 8, ["id", "class", "layout", "label", "is-active"]));
   }
-}), Qe = { class: "omnipad-axis-bg" }, We = { class: "omnipad-axis-content-layer" }, Je = /* @__PURE__ */ E({
+}), Je = { class: "omnipad-axis-bg" }, Xe = { class: "omnipad-axis-content-layer" }, Ge = /* @__PURE__ */ S({
   __name: "VirtualAxisBase",
   props: {
     layout: {},
@@ -429,51 +441,51 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     baseRadius: {}
   },
   setup(e) {
-    const s = e, u = _(() => s.layout ? j(s.layout) : {}), t = q(), n = _(() => {
-      const r = s.vector?.x || 0, p = s.vector?.y || 0, i = s.baseRadius?.x || 0, d = s.baseRadius?.y || 0, y = t ? `${r * 50}cqw` : `${r * i}px`, a = t ? `${p * 50}cqh` : `${p * d}px`, b = t ? "100cqw" : `${i * 2}px`, P = t ? "100cqh" : `${d * 2}px`;
+    const i = e, u = _(() => i.layout ? j(i.layout) : {}), t = q(), n = _(() => {
+      const a = i.vector?.x || 0, y = i.vector?.y || 0, s = i.baseRadius?.x || 0, d = i.baseRadius?.y || 0, b = t ? `${a * 50}cqw` : `${a * s}px`, c = t ? `${y * 50}cqh` : `${y * d}px`, v = t ? "100cqw" : `${s * 2}px`, p = t ? "100cqh" : `${d * 2}px`;
       return {
-        "--omnipad-axis-stick-container-x": y,
-        "--omnipad-axis-stick-container-y": a,
-        "--omnipad-axis-stick-width": b,
-        "--omnipad-axis-stick-height": P,
+        "--omnipad-axis-stick-container-x": b,
+        "--omnipad-axis-stick-container-y": c,
+        "--omnipad-axis-stick-width": v,
+        "--omnipad-axis-stick-height": p,
         // 松手时加一点回弹过渡，活动时取消过渡保证绝对跟手
-        transition: s.isActive ? "none" : "transform 0.1s ease-out"
+        transition: i.isActive ? "none" : "transform 0.1s ease-out"
       };
     });
-    return (r, p) => (w(), A("div", {
-      class: C(["omnipad-axis-base omnipad-prevent", { "is-active": e.isActive }]),
+    return (a, y) => (R(), A("div", {
+      class: k(["omnipad-axis-base omnipad-prevent", { "is-active": e.isActive }]),
       style: B(u.value),
       tabindex: "-1"
     }, [
-      T("div", Qe, [
-        g(r.$slots, "base", {
+      T("div", Je, [
+        h(a.$slots, "base", {
           isActive: e.isActive,
           vector: e.vector
         }, void 0, !0)
       ]),
-      e.showStick ? (w(), A("div", {
+      e.showStick ? (R(), A("div", {
         key: 0,
         class: "omnipad-axis-stick-container",
         style: B(n.value)
       }, [
-        g(r.$slots, "stick", {
+        h(a.$slots, "stick", {
           isActive: e.isActive,
           vector: e.vector
         }, () => [
           T("div", {
-            class: C(["omnipad-default-axis-stick", { "is-active": e.isActive }])
+            class: k(["omnipad-default-axis-stick", { "is-active": e.isActive }])
           }, null, 2)
         ], !0)
       ], 4)) : M("", !0),
-      T("div", We, [
-        g(r.$slots, "default", {
+      T("div", Xe, [
+        h(a.$slots, "default", {
           isActive: e.isActive,
           vector: e.vector
         }, void 0, !0)
       ])
     ], 6));
   }
-}), ie = /* @__PURE__ */ O(Je, [["__scopeId", "data-v-95bb429e"]]), Xe = { class: "omnipad-dpad-cross-bg" }, Ge = /* @__PURE__ */ E({
+}), ie = /* @__PURE__ */ O(Ge, [["__scopeId", "data-v-95bb429e"]]), He = { class: "omnipad-dpad-cross-bg" }, et = /* @__PURE__ */ S({
   __name: "VirtualDPad",
   props: {
     treeNode: {},
@@ -484,72 +496,73 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     showStick: {},
     layout: {}
   },
-  setup(e, { expose: s }) {
+  setup(e, { expose: i }) {
     const u = e, t = {
       showStick: !1,
       threshold: 0.3
-    }, { uid: n, config: r, customClasses: p } = Y(
+    }, { uid: n, config: a, customClasses: y } = z(
       D.D_PAD,
       u,
       t
-    ), { core: i, state: d, elementRef: y, domEvents: a } = F(
-      () => new de(n.value, r.value)
-    ), b = q(), P = V({ x: 0, y: 0 }), l = oe(() => {
-      const c = i.value?.rect;
-      c && (P.value = { x: c.width / 2, y: c.height / 2 });
+    ), { core: s, state: d, elementRef: b, domEvents: c } = F(
+      () => new ve(n.value, a.value)
+    ), v = q(), p = V({ x: 0, y: 0 }), P = oe(() => {
+      const r = s.value?.rect;
+      r && (p.value = { x: r.width / 2, y: r.height / 2 });
     });
-    b && l();
-    const h = (c) => a.value?.onPointerDown(c), R = (c) => a.value?.onPointerMove(c), k = (c) => a.value?.onPointerUp(c), m = (c) => a.value?.onPointerCancel(c);
-    return s({
+    v && P();
+    const f = (r) => c.value?.onPointerDown(r), w = (r) => c.value?.onPointerMove(r), C = (r) => c.value?.onPointerUp(r), l = (r) => c.value?.onPointerCancel(r);
+    return i({
       uid: n,
-      onPointerDown: h,
-      onPointerMove: R,
-      onPointerUp: k,
-      onPointerCancel: m
-    }), (c, S) => (w(), L(ie, {
+      onPointerDown: f,
+      onPointerMove: w,
+      onPointerUp: C,
+      onPointerCancel: l,
+      markRectDirty: () => s.value?.markRectDirty()
+    }), (r, U) => (R(), L(ie, {
       ref_key: "elementRef",
-      ref: y,
-      class: C(["omnipad-dpad omnipad-prevent", o(p)]),
-      layout: o(r).layout,
+      ref: b,
+      class: k(["omnipad-dpad omnipad-prevent", o(y)]),
+      layout: o(a).layout,
       "is-active": o(d)?.isActive,
       vector: o(d)?.vector,
-      "show-stick": o(r).showStick,
-      "base-radius": P.value,
-      onPointerdown: h,
-      onPointermove: R,
-      onPointerup: k,
-      onPointercancel: m,
-      onLostpointercapture: m
+      "show-stick": o(a).showStick,
+      "base-radius": p.value,
+      onPointerdown: f,
+      onPointermove: w,
+      onPointerup: C,
+      onPointercancel: l,
+      onLostpointercapture: l
     }, {
-      base: $((f) => [
-        g(c.$slots, "base", N(x(f)), () => [
-          T("div", Xe, [
+      base: $((g) => [
+        h(r.$slots, "base", x(E(g)), () => [
+          T("div", He, [
             T("div", {
-              class: C(["dpad-arm top", { on: f.vector && f.vector.y < -o(r).threshold }])
+              class: k(["dpad-arm top", { on: g.vector && g.vector.y < -o(a).threshold }])
             }, null, 2),
             T("div", {
-              class: C(["dpad-arm bottom", { on: f.vector && f.vector.y > o(r).threshold }])
+              class: k(["dpad-arm bottom", { on: g.vector && g.vector.y > o(a).threshold }])
             }, null, 2),
             T("div", {
-              class: C(["dpad-arm left", { on: f.vector && f.vector.x < -o(r).threshold }])
+              class: k(["dpad-arm left", { on: g.vector && g.vector.x < -o(a).threshold }])
             }, null, 2),
             T("div", {
-              class: C(["dpad-arm right", { on: f.vector && f.vector.x > o(r).threshold }])
+              class: k(["dpad-arm right", { on: g.vector && g.vector.x > o(a).threshold }])
             }, null, 2),
-            S[0] || (S[0] = T("div", { class: "dpad-center" }, null, -1))
+            U[0] || (U[0] = T("div", { class: "dpad-center" }, null, -1))
           ])
         ], !0)
       ]),
-      stick: $((f) => [
-        g(c.$slots, "stick", N(x(f)), void 0, !0)
+      stick: $((g) => [
+        h(r.$slots, "stick", x(E(g)), void 0, !0)
       ]),
-      default: $((f) => [
-        g(c.$slots, "default", N(x(f)), void 0, !0)
+      default: $((g) => [
+        h(r.$slots, "default", x(E(g)), void 0, !0)
       ]),
       _: 3
     }, 8, ["class", "layout", "is-active", "vector", "show-stick", "base-radius"]));
   }
-}), He = /* @__PURE__ */ O(Ge, [["__scopeId", "data-v-671bfba1"]]), et = /* @__PURE__ */ E({
+}), tt = /* @__PURE__ */ O(et, [["__scopeId", "data-v-e1ecfcd0"]]), ot = /* @__PURE__ */ S({
   __name: "VirtualTrackpad",
   props: {
     treeNode: {},
@@ -560,43 +573,44 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     mapping: {},
     layout: {}
   },
-  setup(e, { expose: s }) {
-    const u = e, { uid: t, config: n, customClasses: r } = Y(D.TRACKPAD, u, {
+  setup(e, { expose: i }) {
+    const u = e, { uid: t, config: n, customClasses: a } = z(D.TRACKPAD, u, {
       label: "TRACKPAD",
       sensitivity: 1
-    }), { state: p, elementRef: i, domEvents: d } = F(
-      () => new ve(t.value, n.value)
-    ), y = (l) => d.value?.onPointerDown(l), a = (l) => d.value?.onPointerMove(l), b = (l) => d.value?.onPointerUp(l), P = (l) => d.value?.onPointerCancel(l);
-    return s({
+    }), { core: y, state: s, elementRef: d, domEvents: b } = F(
+      () => new pe(t.value, n.value)
+    ), c = (f) => b.value?.onPointerDown(f), v = (f) => b.value?.onPointerMove(f), p = (f) => b.value?.onPointerUp(f), P = (f) => b.value?.onPointerCancel(f);
+    return i({
       uid: t,
-      onPointerDown: y,
-      onPointerMove: a,
-      onPointerUp: b,
-      onPointerCancel: P
-    }), (l, h) => (w(), L(G, {
+      onPointerDown: c,
+      onPointerMove: v,
+      onPointerUp: p,
+      onPointerCancel: P,
+      markRectDirty: () => y.value?.markRectDirty
+    }), (f, w) => (R(), L(G, {
       id: o(t),
       ref_key: "elementRef",
-      ref: i,
-      class: C(["omnipad-trackpad omnipad-prevent", o(r)]),
+      ref: d,
+      class: k(["omnipad-trackpad omnipad-prevent", o(a)]),
       layout: o(n).layout,
       label: o(n).label,
-      "is-active": o(p)?.isPressed,
-      onPointerdown: y,
-      onPointermove: a,
-      onPointerup: b,
+      "is-active": o(s)?.isPressed,
+      onPointerdown: c,
+      onPointermove: v,
+      onPointerup: p,
       onPointercancel: P,
       onLostpointercapture: P
     }, {
-      base: $((R) => [
-        g(l.$slots, "base", N(x(R)), void 0, !0)
+      base: $((C) => [
+        h(f.$slots, "base", x(E(C)), void 0, !0)
       ]),
-      default: $((R) => [
-        g(l.$slots, "default", N(x(R)), void 0, !0)
+      default: $((C) => [
+        h(f.$slots, "default", x(E(C)), void 0, !0)
       ]),
       _: 3
     }, 8, ["id", "class", "layout", "label", "is-active"]));
   }
-}), tt = /* @__PURE__ */ O(et, [["__scopeId", "data-v-09cbc089"]]), ot = /* @__PURE__ */ E({
+}), nt = /* @__PURE__ */ O(ot, [["__scopeId", "data-v-5cf9baf9"]]), st = /* @__PURE__ */ S({
   __name: "VirtualJoystick",
   props: {
     treeNode: {},
@@ -609,87 +623,88 @@ const Se = ["id"], Ue = /* @__PURE__ */ E({
     mapping: {},
     layout: {}
   },
-  setup(e, { expose: s }) {
+  setup(e, { expose: i }) {
     const u = e, t = {
       label: "PUSH",
       threshold: 0.2,
       cursorMode: !1,
       cursorSensitivity: 1
-    }, { uid: n, config: r, customClasses: p } = Y(
+    }, { uid: n, config: a, customClasses: y } = z(
       D.JOYSTICK,
       u,
       t
-    ), { core: i, state: d, elementRef: y, domEvents: a } = F(
-      () => new pe(n.value, r.value)
-    ), b = q(), P = V({ x: 0, y: 0 }), l = oe(() => {
-      const c = i.value?.rect;
-      c && (P.value = { x: c.width / 2, y: c.height / 2 });
+    ), { core: s, state: d, elementRef: b, domEvents: c } = F(
+      () => new me(n.value, a.value)
+    ), v = q(), p = V({ x: 0, y: 0 }), P = oe(() => {
+      const r = s.value?.rect;
+      r && (p.value = { x: r.width / 2, y: r.height / 2 });
     });
-    b && l();
-    const h = (c) => a.value?.onPointerDown(c), R = (c) => a.value?.onPointerMove(c), k = (c) => a.value?.onPointerUp(c), m = (c) => a.value?.onPointerCancel(c);
-    return s({
+    v && P();
+    const f = (r) => c.value?.onPointerDown(r), w = (r) => c.value?.onPointerMove(r), C = (r) => c.value?.onPointerUp(r), l = (r) => c.value?.onPointerCancel(r);
+    return i({
       uid: n,
-      onPointerDown: h,
-      onPointerMove: R,
-      onPointerUp: k,
-      onPointerCancel: m
-    }), (c, S) => (w(), L(ie, {
+      onPointerDown: f,
+      onPointerMove: w,
+      onPointerUp: C,
+      onPointerCancel: l,
+      markRectDirty: () => s.value?.markRectDirty
+    }), (r, U) => (R(), L(ie, {
       ref_key: "elementRef",
-      ref: y,
-      class: C(["omnipad-joystick omnipad-prevent", o(p)]),
-      layout: o(r).layout,
+      ref: b,
+      class: k(["omnipad-joystick omnipad-prevent", o(y)]),
+      layout: o(a).layout,
       "is-active": o(d)?.isActive,
       vector: o(d)?.vector,
       "show-stick": "",
-      "base-radius": P.value,
-      onPointerdown: h,
-      onPointermove: R,
-      onPointerup: k,
-      onPointercancel: m,
-      onLostpointercapture: m
+      "base-radius": p.value,
+      onPointerdown: f,
+      onPointermove: w,
+      onPointerup: C,
+      onPointercancel: l,
+      onLostpointercapture: l
     }, {
-      base: $((f) => [
-        g(c.$slots, "base", N(x(f)), void 0, !0)
+      base: $((g) => [
+        h(r.$slots, "base", x(E(g)), void 0, !0)
       ]),
       stick: $(() => [
         J(G, {
           layout: { height: "100%", width: "100%" },
           "is-active": o(d)?.isPressed,
-          label: o(r).label
+          label: o(a).label
         }, {
-          base: $((f) => [
-            g(c.$slots, "stick-base", N(x(f)), void 0, !0)
+          base: $((g) => [
+            h(r.$slots, "stick-base", x(E(g)), void 0, !0)
           ]),
-          default: $((f) => [
-            g(c.$slots, "stick", N(x(f)), void 0, !0)
+          default: $((g) => [
+            h(r.$slots, "stick", x(E(g)), void 0, !0)
           ]),
           _: 3
         }, 8, ["is-active", "label"])
       ]),
-      default: $((f) => [
-        g(c.$slots, "default", N(x(f)), void 0, !0)
+      default: $((g) => [
+        h(r.$slots, "default", x(E(g)), void 0, !0)
       ]),
       _: 3
     }, 8, ["class", "layout", "is-active", "vector", "base-radius"]));
   }
-}), nt = /* @__PURE__ */ O(ot, [["__scopeId", "data-v-00e7d4c0"]]);
-Z(D.BUTTON, qe);
-Z(D.INPUT_ZONE, Be);
-Z(D.ROOT_LAYER, Me);
-Z(D.TARGET_ZONE, Ye);
-Z(D.TRACKPAD, tt);
-Z(D.D_PAD, He);
-Z(D.JOYSTICK, nt);
+}), it = /* @__PURE__ */ O(st, [["__scopeId", "data-v-2255ec27"]]);
+Z(D.BUTTON, We);
+Z(D.INPUT_ZONE, Ve);
+Z(D.ROOT_LAYER, Ze);
+Z(D.TARGET_ZONE, Ke);
+Z(D.TRACKPAD, nt);
+Z(D.D_PAD, tt);
+Z(D.JOYSTICK, it);
 export {
-  Be as InputZone,
-  Me as RootLayer,
-  Ye as TargetZone,
-  qe as VirtualButton,
-  He as VirtualDPad,
-  nt as VirtualJoystick,
-  tt as VirtualTrackpad,
+  Ve as InputZone,
+  Ze as RootLayer,
+  Ke as TargetZone,
+  We as VirtualButton,
+  tt as VirtualDPad,
+  it as VirtualJoystick,
+  nt as VirtualTrackpad,
   ne as getComponent,
   te as getComponentSafe,
-  rt as hasRegisteredComponent,
+  lt as hasRegisteredComponent,
   Z as registerComponent
 };

package/dist/omnipad-vue.umd.js

@@ -1 +1 @@
-(function(_,m){typeof exports=="object"&&typeof module<"u"?m(exports,require("@omnipad/core"),require("vue"),require("@omnipad/core/utils")):typeof define=="function"&&define.amd?define(["exports","@omnipad/core","vue","@omnipad/core/utils"],m):(_=typeof globalThis<"u"?globalThis:_||self,m(_.OmnipadVue={},_.OmniPadCore,_.Vue,_.OmniPadCoreUtils))})(this,(function(_,m,e,k){"use strict";const x={};function N(t,r){x[t]=r}function A(t){const r=x[t];return r||e.defineComponent({render:()=>e.h("div",{style:"color:red"},`[Unknown: ${t}]`)})}function I(t){return!t||!x[t]?null:x[t]}function j(t){return t?!!x[t]:!1}function T(t,r={},d){const o=t(),n=e.shallowRef(),s=e.ref(),f=e.ref(null),a=e.ref({}),p=i=>{s.value=i},C=i=>{if(!n.value)return;const h=n.value;typeof h.bindDelegate=="function"&&Object.entries(i).forEach(([g,l])=>{h.bindDelegate(g,l)})};return e.onMounted(()=>{n.value=o,m.Registry.getInstance().register(o),"subscribe"in o&&o.subscribe(p),d&&C(d);let i=null;if(f.value&&(f.value instanceof Element?i=f.value:f.value.$el instanceof Element&&(i=f.value.$el)),i&&"bindRectProvider"in o&&o.bindRectProvider(()=>i.getBoundingClientRect()),"onPointerDown"in o){const h=k.createPointerBridge(o,r);a.value={...h}}}),e.onUnmounted(()=>{n.value&&n.value.destroy()}),{core:n,state:s,elementRef:f,domEvents:a,bindDelegates:C}}const J={class:"omnipad-virtual-layer-base omnipad-prevent"},W=e.defineComponent({__name:"VirtualLayerBase",props:{nodes:{}},setup(t){const r=t,d=e.computed(()=>(r.nodes||[]).map(o=>{let n=I(o.type);return!n&&o.config?.baseType&&(n=I(o.config.baseType)),n||(n=A(o.type)),{node:o,component:n}}));return(o,n)=>(e.openBlock(),e.createElementBlock("div",J,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,s=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.component),{key:s.node.uid,"tree-node":s.node},null,8,["tree-node"]))),128)),e.renderSlot(o.$slots,"default",{},void 0,!0)]))}}),B=(t,r)=>{const d=t.__vccOpts||t;for(const[o,n]of r)d[o]=n;return d},M=B(W,[["__scopeId","data-v-d67cc501"]]);function D(t,r,d={}){const o=r.treeNode,n=o&&o.config?.baseType===t||o?.type===t?o:void 0;o&&!n&&console.warn(`[OmniPad-Validation] Type mismatch! Component expected "${t}", but received "${o.type}". Config ignored.`);const s=e.inject(m.CONTEXT.PARENT_ID_KEY,e.ref(void 0)),f=e.computed(()=>r.parentId||n?.config?.parentId||s.value),a=e.computed(()=>r.widgetId||n?.uid||k.generateUID(t));e.provide(m.CONTEXT.PARENT_ID_KEY,a);const p=e.computed(()=>{const i=n?.config||{},h=Object.fromEntries(Object.entries(r).filter(([g,l])=>l!==void 0&&g!=="treeNode"&&g!=="widgetId"));return{...d,...i,...h,id:a.value,baseType:t,parentId:f.value,layout:{...d.layout||{},...i.layout||{},...h.layout||{}}}}),C=e.computed(()=>{const i=p.value.cssClasses;return i?Array.isArray(i)?i:[i]:[]});return{uid:a,config:p,customClasses:C}}const X=["id"],U=B(e.defineComponent({__name:"InputZone",props:{treeNode:{},widgetId:{},layout:{},preventFocusLoss:{}},setup(t){const r=t,d=e.useSlots(),o=e.ref(null),{uid:n,config:s,customClasses:f}=D(m.CMP_TYPES.INPUT_ZONE,r),{core:a,state:p,elementRef:C,domEvents:i,bindDelegates:h}=T(()=>new m.InputZoneCore(n.value,s.value),{requireDirectHit:!0}),g=e.computed(()=>{const u=r.treeNode?.config?.dynamicWidgetId;return r.treeNode?.children?.filter(R=>R.uid!==u)||[]}),l=e.computed(()=>{const R=(d.dynamicWidget?.()||[]).filter(v=>!(v.type===Comment||v.type===Text)),E=r.treeNode?.children?.find(v=>v.uid===r.treeNode?.config?.dynamicWidgetId),V=R.length>0;return R.length>1&&console.error(`[OmniPad-Validation] InputZone ${n.value} has multiple dynamic widgets in slot. Only the first one will be activated.`),V&&E&&console.warn(`[OmniPad-Validation] InputZone ${n.value} has both Slot and Config dynamic widgets. Config ignored.`),{nodeToRender:V?R[0]:E||null,isFromSlot:V}}),b=e.computed(()=>{const u=l.value.nodeToRender;return A(u.config?.baseType||u.type)});e.watch(o,u=>{e.nextTick(()=>{u&&u?.uid&&(a.value?.updateConfig({dynamicWidgetId:u.uid}),h({dynamicWidgetPointerDown:u.onPointerDown,dynamicWidgetPointerMove:u.onPointerMove,dynamicWidgetPointerUp:u.onPointerUp,dynamicWidgetPointerCancel:u.onPointerCancel}))})},{immediate:!0});const w=e.computed(()=>k.resolveLayoutStyle(s.value.layout)),S=k.supportsContainerQueries(),y=e.computed(()=>{if(!p.value)return{display:"none"};if(!p.value?.isDynamicActive)return{visibility:"hidden",opacity:0};let u,R;const E=p?.value?.dynamicPosition;if(S)u=`${E.x}cqw`,R=`${E.y}cqh`;else{const V=a?.value?.rect;u=`${k.remap(E?.x||0,0,100,0,V?.width||0)}px`,R=`${k.remap(E?.y||0,0,100,0,V?.height||0)}px`}return{zIndex:100,"--dynamic-widget-mount-x":u,"--dynamic-widget-mount-y":R,visibility:"visible",opacity:1,pointerEvents:"auto"}}),c=u=>i.value?.onPointerDown(u),$=u=>i.value?.onPointerMove(u),P=u=>i.value?.onPointerUp(u),K=u=>i.value?.onPointerCancel(u);return(u,R)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(n),ref_key:"elementRef",ref:C,class:e.normalizeClass(["omnipad-input-zone omnipad-prevent",e.unref(f)]),style:e.normalizeStyle(w.value)},[e.createVNode(M,{nodes:g.value},{default:e.withCtx(()=>[e.renderSlot(u.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"]),l.value.nodeToRender||e.unref(a)?.isInterceptorRequired?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-input-zone-trigger omnipad-prevent",onPointerdown:c,onPointermove:$,onPointerup:P,onPointercancel:K,onLostpointercapture:K},[e.createElementVNode("div",{class:"dynamic-widget-mount",style:e.normalizeStyle(y.value)},[l.value.isFromSlot?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(l.value.nodeToRender),{key:0,ref:E=>o.value=E},null,512)):l.value.nodeToRender?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(b.value),{key:1,ref:E=>o.value=E,"tree-node":l.value.nodeToRender},null,8,["tree-node"])):e.createCommentVNode("",!0)],4)],32)):e.createCommentVNode("",!0)],14,X))}}),[["__scopeId","data-v-b4ae3724"]]),G=["id"],O=B(e.defineComponent({__name:"RootLayer",props:{treeNode:{},widgetId:{},layout:{}},setup(t){const r=t,{uid:d,config:o,customClasses:n}=D(m.CMP_TYPES.ROOT_LAYER,r),{elementRef:s}=T(()=>new m.RootLayerCore(d.value,o.value)),f=e.computed(()=>k.resolveLayoutStyle(o.value.layout));return(a,p)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(d),ref_key:"elementRef",ref:s,class:e.normalizeClass(["omnipad-root-layer omnipad-prevent",e.unref(n)]),style:e.normalizeStyle(f.value)},[e.createVNode(M,{nodes:t.treeNode?.children||[]},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"])],14,G))}}),[["__scopeId","data-v-e53747a9"]]),H=["id"],ee={key:0,class:"omnipad-default-focus-border-feedback"},Y=B(e.defineComponent({__name:"TargetZone",props:{treeNode:{},widgetId:{},cursorEnabled:{type:Boolean},cursorAutoDelay:{},layout:{}},setup(t){const r=t,d={cursorAutoDelay:2500},{uid:o,config:n,customClasses:s}=D(m.CMP_TYPES.TARGET_ZONE,r,d),{core:f,state:a,elementRef:p,domEvents:C}=T(()=>new m.TargetZoneCore(o.value,n.value),{},{dispatchKeyboardEvent:k.dispatchKeyboardEvent,dispatchPointerEventAtPos:k.dispatchPointerEventAtPos,reclaimFocusAtPos:k.reclaimFocusAtPos}),i=e.computed(()=>k.resolveLayoutStyle(n.value.layout)),h=k.supportsContainerQueries(),g=e.computed(()=>{if(!a.value)return{display:"none"};let y,c;const $=a?.value?.position;if(h)y=`${$.x}cqw`,c=`${$.y}cqh`;else{const P=f?.value?.rect;y=`${k.remap($?.x||0,0,100,0,P?.width||0)}px`,c=`${k.remap($?.y||0,0,100,0,P?.height||0)}px`}return{"--omnipad-virtual-cursor-x":y,"--omnipad-virtual-cursor-y":c,opacity:a.value.isVisible?1:0}}),l=y=>C.value?.onPointerDown(y),b=y=>C.value?.onPointerMove(y),w=y=>C.value?.onPointerUp(y),S=y=>C.value?.onPointerCancel(y);return(y,c)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(o),ref_key:"elementRef",ref:p,class:e.normalizeClass(["omnipad-target-zone omnipad-prevent",e.unref(s)]),style:e.normalizeStyle(i.value),onPointerdown:l,onPointermove:b,onPointerup:w,onPointercancel:S,onLostpointercapture:S},[e.renderSlot(y.$slots,"focus-feedback",{state:e.unref(a),isReturning:e.unref(a)?.isFocusReturning,cursorPos:e.unref(a)?.position},()=>[e.createVNode(e.Transition,{name:"omnipad-default-focus-fade"},{default:e.withCtx(()=>[e.unref(a)?.isFocusReturning?(e.openBlock(),e.createElementBlock("div",ee)):e.createCommentVNode("",!0)]),_:1})],!0),e.unref(n).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-virtual-cursor",style:e.normalizeStyle(g.value)},[e.renderSlot(y.$slots,"cursor",{state:e.unref(a),isDown:e.unref(a)?.isPointerDown,isReturning:e.unref(a)?.isFocusReturning,cursorPos:e.unref(a)?.position},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-cursor-dot",{"is-down":e.unref(a)?.isPointerDown}])},null,2)],!0)],4)):e.createCommentVNode("",!0),e.unref(n).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:1,class:"omnipad-virtual-cursor",style:e.normalizeStyle(g.value)},[e.renderSlot(y.$slots,"with-cursor",{state:e.unref(a),isDown:e.unref(a)?.isPointerDown,isReturning:e.unref(a)?.isFocusReturning,cursorPos:e.unref(a)?.position},void 0,!0)],4)):e.createCommentVNode("",!0),e.renderSlot(y.$slots,"default",{state:e.unref(a),isDown:e.unref(a)?.isPointerDown,isReturning:e.unref(a)?.isFocusReturning,cursorPos:e.unref(a)?.position},void 0,!0)],46,H))}}),[["__scopeId","data-v-44c28c60"]]),te={class:"omnipad-button-content-layer"},oe={key:0,class:"omnipad-default-button-label"},z=B(e.defineComponent({__name:"VirtualButtonBase",props:{layout:{},isActive:{type:Boolean},label:{}},setup(t){const r=t,d=e.computed(()=>r.layout?k.resolveLayoutStyle(r.layout):{});return(o,n)=>(e.openBlock(),e.createElementBlock("div",{class:"omnipad-button-base omnipad-prevent",style:e.normalizeStyle(d.value),tabindex:"-1"},[e.renderSlot(o.$slots,"base",{isActive:t.isActive,label:t.label},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-button-base",{"is-active":t.isActive}])},null,2)],!0),e.createElementVNode("div",te,[e.renderSlot(o.$slots,"default",{isActive:t.isActive,label:t.label},()=>[t.label?(e.openBlock(),e.createElementBlock("span",oe,e.toDisplayString(t.label),1)):e.createCommentVNode("",!0)],!0)])],4))}}),[["__scopeId","data-v-f6a6e082"]]),L=e.defineComponent({__name:"VirtualButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:r}){const d=t,o={label:"BTN"},{uid:n,config:s,customClasses:f}=D(m.CMP_TYPES.BUTTON,d,o),{state:a,elementRef:p,domEvents:C}=T(()=>new m.ButtonCore(n.value,s.value)),i=b=>C.value?.onPointerDown(b),h=b=>C.value?.onPointerMove(b),g=b=>C.value?.onPointerUp(b),l=b=>C.value?.onPointerCancel(b);return r({uid:n,onPointerDown:i,onPointerMove:h,onPointerUp:g,onPointerCancel:l}),(b,w)=>(e.openBlock(),e.createBlock(z,{id:e.unref(n),ref_key:"elementRef",ref:p,class:e.normalizeClass(["omnipad-button omnipad-prevent",e.unref(f)]),layout:e.unref(s).layout,label:e.unref(s).label,"is-active":e.unref(a)?.isPressed,onPointerdown:i,onPointerup:g,onPointercancel:l,onLostpointercapture:l},{base:e.withCtx(S=>[e.renderSlot(b.$slots,"base",e.normalizeProps(e.guardReactiveProps(S)))]),default:e.withCtx(S=>[e.renderSlot(b.$slots,"default",e.normalizeProps(e.guardReactiveProps(S)))]),_:3},8,["id","class","layout","label","is-active"]))}}),ne={class:"omnipad-axis-bg"},re={class:"omnipad-axis-content-layer"},Z=B(e.defineComponent({__name:"VirtualAxisBase",props:{layout:{},isActive:{type:Boolean},vector:{},showStick:{type:Boolean},baseRadius:{}},setup(t){const r=t,d=e.computed(()=>r.layout?k.resolveLayoutStyle(r.layout):{}),o=k.supportsContainerQueries(),n=e.computed(()=>{const s=r.vector?.x||0,f=r.vector?.y||0,a=r.baseRadius?.x||0,p=r.baseRadius?.y||0,C=o?`${s*50}cqw`:`${s*a}px`,i=o?`${f*50}cqh`:`${f*p}px`,h=o?"100cqw":`${a*2}px`,g=o?"100cqh":`${p*2}px`;return{"--omnipad-axis-stick-container-x":C,"--omnipad-axis-stick-container-y":i,"--omnipad-axis-stick-width":h,"--omnipad-axis-stick-height":g,transition:r.isActive?"none":"transform 0.1s ease-out"}});return(s,f)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["omnipad-axis-base omnipad-prevent",{"is-active":t.isActive}]),style:e.normalizeStyle(d.value),tabindex:"-1"},[e.createElementVNode("div",ne,[e.renderSlot(s.$slots,"base",{isActive:t.isActive,vector:t.vector},void 0,!0)]),t.showStick?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-axis-stick-container",style:e.normalizeStyle(n.value)},[e.renderSlot(s.$slots,"stick",{isActive:t.isActive,vector:t.vector},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-axis-stick",{"is-active":t.isActive}])},null,2)],!0)],4)):e.createCommentVNode("",!0),e.createElementVNode("div",re,[e.renderSlot(s.$slots,"default",{isActive:t.isActive,vector:t.vector},void 0,!0)])],6))}}),[["__scopeId","data-v-95bb429e"]]),ae={class:"omnipad-dpad-cross-bg"},F=B(e.defineComponent({__name:"VirtualDPad",props:{treeNode:{},widgetId:{},targetStageId:{},mapping:{},threshold:{},showStick:{},layout:{}},setup(t,{expose:r}){const d=t,o={showStick:!1,threshold:.3},{uid:n,config:s,customClasses:f}=D(m.CMP_TYPES.D_PAD,d,o),{core:a,state:p,elementRef:C,domEvents:i}=T(()=>new m.DPadCore(n.value,s.value)),h=k.supportsContainerQueries(),g=e.ref({x:0,y:0}),l=e.watchEffect(()=>{const c=a.value?.rect;c&&(g.value={x:c.width/2,y:c.height/2})});h&&l();const b=c=>i.value?.onPointerDown(c),w=c=>i.value?.onPointerMove(c),S=c=>i.value?.onPointerUp(c),y=c=>i.value?.onPointerCancel(c);return r({uid:n,onPointerDown:b,onPointerMove:w,onPointerUp:S,onPointerCancel:y}),(c,$)=>(e.openBlock(),e.createBlock(Z,{ref_key:"elementRef",ref:C,class:e.normalizeClass(["omnipad-dpad omnipad-prevent",e.unref(f)]),layout:e.unref(s).layout,"is-active":e.unref(p)?.isActive,vector:e.unref(p)?.vector,"show-stick":e.unref(s).showStick,"base-radius":g.value,onPointerdown:b,onPointermove:w,onPointerup:S,onPointercancel:y,onLostpointercapture:y},{base:e.withCtx(P=>[e.renderSlot(c.$slots,"base",e.normalizeProps(e.guardReactiveProps(P)),()=>[e.createElementVNode("div",ae,[e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm top",{on:P.vector&&P.vector.y<-e.unref(s).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm bottom",{on:P.vector&&P.vector.y>e.unref(s).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm left",{on:P.vector&&P.vector.x<-e.unref(s).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm right",{on:P.vector&&P.vector.x>e.unref(s).threshold}])},null,2),$[0]||($[0]=e.createElementVNode("div",{class:"dpad-center"},null,-1))])],!0)]),stick:e.withCtx(P=>[e.renderSlot(c.$slots,"stick",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),default:e.withCtx(P=>[e.renderSlot(c.$slots,"default",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),_:3},8,["class","layout","is-active","vector","show-stick","base-radius"]))}}),[["__scopeId","data-v-671bfba1"]]),Q=B(e.defineComponent({__name:"VirtualTrackpad",props:{treeNode:{},widgetId:{},label:{},sensitivity:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:r}){const d=t,{uid:o,config:n,customClasses:s}=D(m.CMP_TYPES.TRACKPAD,d,{label:"TRACKPAD",sensitivity:1}),{state:f,elementRef:a,domEvents:p}=T(()=>new m.TrackpadCore(o.value,n.value)),C=l=>p.value?.onPointerDown(l),i=l=>p.value?.onPointerMove(l),h=l=>p.value?.onPointerUp(l),g=l=>p.value?.onPointerCancel(l);return r({uid:o,onPointerDown:C,onPointerMove:i,onPointerUp:h,onPointerCancel:g}),(l,b)=>(e.openBlock(),e.createBlock(z,{id:e.unref(o),ref_key:"elementRef",ref:a,class:e.normalizeClass(["omnipad-trackpad omnipad-prevent",e.unref(s)]),layout:e.unref(n).layout,label:e.unref(n).label,"is-active":e.unref(f)?.isPressed,onPointerdown:C,onPointermove:i,onPointerup:h,onPointercancel:g,onLostpointercapture:g},{base:e.withCtx(w=>[e.renderSlot(l.$slots,"base",e.normalizeProps(e.guardReactiveProps(w)),void 0,!0)]),default:e.withCtx(w=>[e.renderSlot(l.$slots,"default",e.normalizeProps(e.guardReactiveProps(w)),void 0,!0)]),_:3},8,["id","class","layout","label","is-active"]))}}),[["__scopeId","data-v-09cbc089"]]),q=B(e.defineComponent({__name:"VirtualJoystick",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},threshold:{},cursorMode:{},cursorSensitivity:{},mapping:{},layout:{}},setup(t,{expose:r}){const d=t,o={label:"PUSH",threshold:.2,cursorMode:!1,cursorSensitivity:1},{uid:n,config:s,customClasses:f}=D(m.CMP_TYPES.JOYSTICK,d,o),{core:a,state:p,elementRef:C,domEvents:i}=T(()=>new m.JoystickCore(n.value,s.value)),h=k.supportsContainerQueries(),g=e.ref({x:0,y:0}),l=e.watchEffect(()=>{const c=a.value?.rect;c&&(g.value={x:c.width/2,y:c.height/2})});h&&l();const b=c=>i.value?.onPointerDown(c),w=c=>i.value?.onPointerMove(c),S=c=>i.value?.onPointerUp(c),y=c=>i.value?.onPointerCancel(c);return r({uid:n,onPointerDown:b,onPointerMove:w,onPointerUp:S,onPointerCancel:y}),(c,$)=>(e.openBlock(),e.createBlock(Z,{ref_key:"elementRef",ref:C,class:e.normalizeClass(["omnipad-joystick omnipad-prevent",e.unref(f)]),layout:e.unref(s).layout,"is-active":e.unref(p)?.isActive,vector:e.unref(p)?.vector,"show-stick":"","base-radius":g.value,onPointerdown:b,onPointermove:w,onPointerup:S,onPointercancel:y,onLostpointercapture:y},{base:e.withCtx(P=>[e.renderSlot(c.$slots,"base",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),stick:e.withCtx(()=>[e.createVNode(z,{layout:{height:"100%",width:"100%"},"is-active":e.unref(p)?.isPressed,label:e.unref(s).label},{base:e.withCtx(P=>[e.renderSlot(c.$slots,"stick-base",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),default:e.withCtx(P=>[e.renderSlot(c.$slots,"stick",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),_:3},8,["is-active","label"])]),default:e.withCtx(P=>[e.renderSlot(c.$slots,"default",e.normalizeProps(e.guardReactiveProps(P)),void 0,!0)]),_:3},8,["class","layout","is-active","vector","base-radius"]))}}),[["__scopeId","data-v-00e7d4c0"]]);N(m.CMP_TYPES.BUTTON,L),N(m.CMP_TYPES.INPUT_ZONE,U),N(m.CMP_TYPES.ROOT_LAYER,O),N(m.CMP_TYPES.TARGET_ZONE,Y),N(m.CMP_TYPES.TRACKPAD,Q),N(m.CMP_TYPES.D_PAD,F),N(m.CMP_TYPES.JOYSTICK,q),_.InputZone=U,_.RootLayer=O,_.TargetZone=Y,_.VirtualButton=L,_.VirtualDPad=F,_.VirtualJoystick=q,_.VirtualTrackpad=Q,_.getComponent=A,_.getComponentSafe=I,_.hasRegisteredComponent=j,_.registerComponent=N,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));
+(function(w,d){typeof exports=="object"&&typeof module<"u"?d(exports,require("@omnipad/core"),require("vue"),require("@omnipad/core/utils")):typeof define=="function"&&define.amd?define(["exports","@omnipad/core","vue","@omnipad/core/utils"],d):(w=typeof globalThis<"u"?globalThis:w||self,d(w.OmnipadVue={},w.OmniPadCore,w.Vue,w.OmniPadCoreUtils))})(this,(function(w,d,e,_){"use strict";const V={};function N(t,a){V[t]=a}function A(t){const a=V[t];return a||e.defineComponent({render:()=>e.h("div",{style:"color:red"},`[Unknown: ${t}]`)})}function z(t){return!t||!V[t]?null:V[t]}function j(t){return t?!!V[t]:!1}function T(t,a={},m){const o=t(),n=e.shallowRef(),i=e.ref(),C=e.ref(null),r=e.ref({});let p=null;const k=u=>{i.value=u},c=u=>{if(!n.value)return;const f=n.value;typeof f.bindDelegate=="function"&&Object.entries(u).forEach(([g,P])=>{f.bindDelegate(g,P)})};return e.onMounted(()=>{n.value=o,d.Registry.getInstance().register(o),"subscribe"in o&&o.subscribe(k),m&&c(m);let u=null;if(C.value&&(C.value instanceof Element?u=C.value:C.value.$el instanceof Element&&(u=C.value.$el)),u&&"bindRectProvider"in o){const f=o,g=_.createCachedProvider(()=>u.getBoundingClientRect());f.bindRectProvider(g.get,g.markDirty),p=new ResizeObserver(()=>{f.markRectDirty()}),p.observe(u)}if("onPointerDown"in o){const f=_.createPointerBridge(o,a);r.value={...f}}d.WindowManager.getInstance().init()}),e.onUnmounted(()=>{p&&(p.disconnect(),p=null),n.value&&n.value.destroy()}),{core:n,state:i,elementRef:C,domEvents:r,bindDelegates:c}}const J={class:"omnipad-virtual-layer-base omnipad-prevent"},W=e.defineComponent({__name:"VirtualLayerBase",props:{nodes:{}},setup(t){const a=t,m=e.computed(()=>(a.nodes||[]).map(o=>{let n=z(o.type);return!n&&o.config?.baseType&&(n=z(o.config.baseType)),n||(n=A(o.type)),{node:o,component:n}}));return(o,n)=>(e.openBlock(),e.createElementBlock("div",J,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.value,i=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.component),{key:i.node.uid,"tree-node":i.node},null,8,["tree-node"]))),128)),e.renderSlot(o.$slots,"default",{},void 0,!0)]))}}),B=(t,a)=>{const m=t.__vccOpts||t;for(const[o,n]of a)m[o]=n;return m},M=B(W,[["__scopeId","data-v-d67cc501"]]);function D(t,a,m={}){const o=a.treeNode,n=o&&o.config?.baseType===t||o?.type===t?o:void 0;o&&!n&&console.warn(`[OmniPad-Validation] Type mismatch! Component expected "${t}", but received "${o.type}". Config ignored.`);const i=e.inject(d.CONTEXT.PARENT_ID_KEY,e.ref(void 0)),C=e.computed(()=>a.parentId||n?.config?.parentId||i.value),r=e.computed(()=>a.widgetId||n?.uid||_.generateUID(t));e.provide(d.CONTEXT.PARENT_ID_KEY,r);const p=e.computed(()=>{const c=n?.config||{},u=Object.fromEntries(Object.entries(a).filter(([f,g])=>g!==void 0&&f!=="treeNode"&&f!=="widgetId"));return{...m,...c,...u,id:r.value,baseType:t,parentId:C.value,layout:{...m.layout||{},...c.layout||{},...u.layout||{}}}}),k=e.computed(()=>{const c=p.value.cssClasses;return c?Array.isArray(c)?c:[c]:[]});return{uid:r,config:p,customClasses:k}}const X=["id"],U=B(e.defineComponent({__name:"InputZone",props:{treeNode:{},widgetId:{},layout:{},preventFocusLoss:{}},setup(t){const a=t,m=e.useSlots(),o=e.ref(null),{uid:n,config:i,customClasses:C}=D(d.CMP_TYPES.INPUT_ZONE,a),{core:r,state:p,elementRef:k,domEvents:c,bindDelegates:u}=T(()=>new d.InputZoneCore(n.value,i.value),{requireDirectHit:!0}),f=e.computed(()=>{const y=a.treeNode?.config?.dynamicWidgetId;return a.treeNode?.children?.filter(R=>R.uid!==y)||[]}),g=e.computed(()=>{const R=(m.dynamicWidget?.()||[]).filter(x=>!(x.type===Comment||x.type===Text)),E=a.treeNode?.children?.find(x=>x.uid===a.treeNode?.config?.dynamicWidgetId),v=R.length>0;return R.length>1&&console.error(`[OmniPad-Validation] InputZone ${n.value} has multiple dynamic widgets in slot. Only the first one will be activated.`),v&&E&&console.warn(`[OmniPad-Validation] InputZone ${n.value} has both Slot and Config dynamic widgets. Config ignored.`),{nodeToRender:v?R[0]:E||null,isFromSlot:v}}),P=e.computed(()=>{const y=g.value.nodeToRender;return A(y.config?.baseType||y.type)});e.watch(o,y=>{e.nextTick(()=>{y&&y?.uid&&(r.value?.updateConfig({dynamicWidgetId:y.uid}),u({dynamicWidgetPointerDown:R=>{y.markRectDirty?.(),y.onPointerDown?.(R)},dynamicWidgetPointerMove:y.onPointerMove,dynamicWidgetPointerUp:y.onPointerUp,dynamicWidgetPointerCancel:y.onPointerCancel}))})},{immediate:!0});const b=e.computed(()=>_.resolveLayoutStyle(i.value.layout)),S=_.supportsContainerQueries(),l=e.computed(()=>{if(!p.value)return{display:"none"};if(!p.value?.isDynamicActive)return{visibility:"hidden",opacity:0};let y,R;const E=p?.value?.dynamicPosition;if(S)y=`${E.x}cqw`,R=`${E.y}cqh`;else{const v=r?.value?.rect;y=`${_.remap(E?.x||0,0,100,0,v?.width||0)}px`,R=`${_.remap(E?.y||0,0,100,0,v?.height||0)}px`}return{zIndex:100,"--dynamic-widget-mount-x":y,"--dynamic-widget-mount-y":R,visibility:"visible",opacity:1,pointerEvents:"auto"}}),s=y=>c.value?.onPointerDown(y),$=y=>c.value?.onPointerMove(y),h=y=>c.value?.onPointerUp(y),K=y=>c.value?.onPointerCancel(y);return(y,R)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(n),ref_key:"elementRef",ref:k,class:e.normalizeClass(["omnipad-input-zone omnipad-prevent",e.unref(C)]),style:e.normalizeStyle(b.value)},[e.createVNode(M,{nodes:f.value},{default:e.withCtx(()=>[e.renderSlot(y.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"]),g.value.nodeToRender||e.unref(r)?.isInterceptorRequired?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-input-zone-trigger omnipad-prevent",onPointerdown:s,onPointermove:$,onPointerup:h,onPointercancel:K,onLostpointercapture:K},[e.createElementVNode("div",{class:"dynamic-widget-mount",style:e.normalizeStyle(l.value)},[g.value.isFromSlot?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(g.value.nodeToRender),{key:0,ref:E=>o.value=E},null,512)):g.value.nodeToRender?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(P.value),{key:1,ref:E=>o.value=E,"tree-node":g.value.nodeToRender},null,8,["tree-node"])):e.createCommentVNode("",!0)],4)],32)):e.createCommentVNode("",!0)],14,X))}}),[["__scopeId","data-v-0a998e05"]]),G=["id"],O=B(e.defineComponent({__name:"RootLayer",props:{treeNode:{},widgetId:{},layout:{}},setup(t){const a=t,{uid:m,config:o,customClasses:n}=D(d.CMP_TYPES.ROOT_LAYER,a),{elementRef:i}=T(()=>new d.RootLayerCore(m.value,o.value)),C=e.computed(()=>_.resolveLayoutStyle(o.value.layout));return(r,p)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(m),ref_key:"elementRef",ref:i,class:e.normalizeClass(["omnipad-root-layer omnipad-prevent",e.unref(n)]),style:e.normalizeStyle(C.value)},[e.createVNode(M,{nodes:t.treeNode?.children||[]},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"])],14,G))}}),[["__scopeId","data-v-e53747a9"]]),H=["id"],ee={key:0,class:"omnipad-default-focus-border-feedback"},Y=B(e.defineComponent({__name:"TargetZone",props:{treeNode:{},widgetId:{},cursorEnabled:{type:Boolean},cursorAutoDelay:{},layout:{}},setup(t){const a=t,m={cursorAutoDelay:2500},{uid:o,config:n,customClasses:i}=D(d.CMP_TYPES.TARGET_ZONE,a,m),{core:C,state:r,elementRef:p,domEvents:k}=T(()=>new d.TargetZoneCore(o.value,n.value),{},{dispatchKeyboardEvent:_.dispatchKeyboardEvent,dispatchPointerEventAtPos:_.dispatchPointerEventAtPos,reclaimFocusAtPos:_.reclaimFocusAtPos}),c=e.computed(()=>_.resolveLayoutStyle(n.value.layout)),u=_.supportsContainerQueries(),f=e.computed(()=>{if(!r.value)return{display:"none"};let l,s;const $=r?.value?.position;if(u)l=`${$.x}cqw`,s=`${$.y}cqh`;else{const h=C?.value?.rect;l=`${_.remap($?.x||0,0,100,0,h?.width||0)}px`,s=`${_.remap($?.y||0,0,100,0,h?.height||0)}px`}return{"--omnipad-virtual-cursor-x":l,"--omnipad-virtual-cursor-y":s,opacity:r.value.isVisible?1:0}}),g=l=>k.value?.onPointerDown(l),P=l=>k.value?.onPointerMove(l),b=l=>k.value?.onPointerUp(l),S=l=>k.value?.onPointerCancel(l);return(l,s)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(o),ref_key:"elementRef",ref:p,class:e.normalizeClass(["omnipad-target-zone omnipad-prevent",e.unref(i)]),style:e.normalizeStyle(c.value),onPointerdown:g,onPointermove:P,onPointerup:b,onPointercancel:S,onLostpointercapture:S},[e.renderSlot(l.$slots,"focus-feedback",{state:e.unref(r),isReturning:e.unref(r)?.isFocusReturning,cursorPos:e.unref(r)?.position},()=>[e.createVNode(e.Transition,{name:"omnipad-default-focus-fade"},{default:e.withCtx(()=>[e.unref(r)?.isFocusReturning?(e.openBlock(),e.createElementBlock("div",ee)):e.createCommentVNode("",!0)]),_:1})],!0),e.unref(n).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-virtual-cursor",style:e.normalizeStyle(f.value)},[e.renderSlot(l.$slots,"cursor",{state:e.unref(r),isDown:e.unref(r)?.isPointerDown,isReturning:e.unref(r)?.isFocusReturning,cursorPos:e.unref(r)?.position},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-cursor-dot",{"is-down":e.unref(r)?.isPointerDown}])},null,2)],!0)],4)):e.createCommentVNode("",!0),e.unref(n).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:1,class:"omnipad-virtual-cursor",style:e.normalizeStyle(f.value)},[e.renderSlot(l.$slots,"with-cursor",{state:e.unref(r),isDown:e.unref(r)?.isPointerDown,isReturning:e.unref(r)?.isFocusReturning,cursorPos:e.unref(r)?.position},void 0,!0)],4)):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"default",{state:e.unref(r),isDown:e.unref(r)?.isPointerDown,isReturning:e.unref(r)?.isFocusReturning,cursorPos:e.unref(r)?.position},void 0,!0)],46,H))}}),[["__scopeId","data-v-44c28c60"]]),te={class:"omnipad-button-content-layer"},oe={key:0,class:"omnipad-default-button-label"},I=B(e.defineComponent({__name:"VirtualButtonBase",props:{layout:{},isActive:{type:Boolean},label:{}},setup(t){const a=t,m=e.computed(()=>a.layout?_.resolveLayoutStyle(a.layout):{});return(o,n)=>(e.openBlock(),e.createElementBlock("div",{class:"omnipad-button-base omnipad-prevent",style:e.normalizeStyle(m.value),tabindex:"-1"},[e.renderSlot(o.$slots,"base",{isActive:t.isActive,label:t.label},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-button-base",{"is-active":t.isActive}])},null,2)],!0),e.createElementVNode("div",te,[e.renderSlot(o.$slots,"default",{isActive:t.isActive,label:t.label},()=>[t.label?(e.openBlock(),e.createElementBlock("span",oe,e.toDisplayString(t.label),1)):e.createCommentVNode("",!0)],!0)])],4))}}),[["__scopeId","data-v-f6a6e082"]]),L=e.defineComponent({__name:"VirtualButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:a}){const m=t,o={label:"BTN"},{uid:n,config:i,customClasses:C}=D(d.CMP_TYPES.BUTTON,m,o),{core:r,state:p,elementRef:k,domEvents:c}=T(()=>new d.ButtonCore(n.value,i.value)),u=b=>c.value?.onPointerDown(b),f=b=>c.value?.onPointerMove(b),g=b=>c.value?.onPointerUp(b),P=b=>c.value?.onPointerCancel(b);return a({uid:n,onPointerDown:u,onPointerMove:f,onPointerUp:g,onPointerCancel:P,markRectDirty:()=>r.value?.markRectDirty}),(b,S)=>(e.openBlock(),e.createBlock(I,{id:e.unref(n),ref_key:"elementRef",ref:k,class:e.normalizeClass(["omnipad-button omnipad-prevent",e.unref(C)]),layout:e.unref(i).layout,label:e.unref(i).label,"is-active":e.unref(p)?.isPressed,onPointerdown:u,onPointerup:g,onPointercancel:P,onLostpointercapture:P},{base:e.withCtx(l=>[e.renderSlot(b.$slots,"base",e.normalizeProps(e.guardReactiveProps(l)))]),default:e.withCtx(l=>[e.renderSlot(b.$slots,"default",e.normalizeProps(e.guardReactiveProps(l)))]),_:3},8,["id","class","layout","label","is-active"]))}}),ne={class:"omnipad-axis-bg"},re={class:"omnipad-axis-content-layer"},Z=B(e.defineComponent({__name:"VirtualAxisBase",props:{layout:{},isActive:{type:Boolean},vector:{},showStick:{type:Boolean},baseRadius:{}},setup(t){const a=t,m=e.computed(()=>a.layout?_.resolveLayoutStyle(a.layout):{}),o=_.supportsContainerQueries(),n=e.computed(()=>{const i=a.vector?.x||0,C=a.vector?.y||0,r=a.baseRadius?.x||0,p=a.baseRadius?.y||0,k=o?`${i*50}cqw`:`${i*r}px`,c=o?`${C*50}cqh`:`${C*p}px`,u=o?"100cqw":`${r*2}px`,f=o?"100cqh":`${p*2}px`;return{"--omnipad-axis-stick-container-x":k,"--omnipad-axis-stick-container-y":c,"--omnipad-axis-stick-width":u,"--omnipad-axis-stick-height":f,transition:a.isActive?"none":"transform 0.1s ease-out"}});return(i,C)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["omnipad-axis-base omnipad-prevent",{"is-active":t.isActive}]),style:e.normalizeStyle(m.value),tabindex:"-1"},[e.createElementVNode("div",ne,[e.renderSlot(i.$slots,"base",{isActive:t.isActive,vector:t.vector},void 0,!0)]),t.showStick?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-axis-stick-container",style:e.normalizeStyle(n.value)},[e.renderSlot(i.$slots,"stick",{isActive:t.isActive,vector:t.vector},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-axis-stick",{"is-active":t.isActive}])},null,2)],!0)],4)):e.createCommentVNode("",!0),e.createElementVNode("div",re,[e.renderSlot(i.$slots,"default",{isActive:t.isActive,vector:t.vector},void 0,!0)])],6))}}),[["__scopeId","data-v-95bb429e"]]),ae={class:"omnipad-dpad-cross-bg"},F=B(e.defineComponent({__name:"VirtualDPad",props:{treeNode:{},widgetId:{},targetStageId:{},mapping:{},threshold:{},showStick:{},layout:{}},setup(t,{expose:a}){const m=t,o={showStick:!1,threshold:.3},{uid:n,config:i,customClasses:C}=D(d.CMP_TYPES.D_PAD,m,o),{core:r,state:p,elementRef:k,domEvents:c}=T(()=>new d.DPadCore(n.value,i.value)),u=_.supportsContainerQueries(),f=e.ref({x:0,y:0}),g=e.watchEffect(()=>{const s=r.value?.rect;s&&(f.value={x:s.width/2,y:s.height/2})});u&&g();const P=s=>c.value?.onPointerDown(s),b=s=>c.value?.onPointerMove(s),S=s=>c.value?.onPointerUp(s),l=s=>c.value?.onPointerCancel(s);return a({uid:n,onPointerDown:P,onPointerMove:b,onPointerUp:S,onPointerCancel:l,markRectDirty:()=>r.value?.markRectDirty()}),(s,$)=>(e.openBlock(),e.createBlock(Z,{ref_key:"elementRef",ref:k,class:e.normalizeClass(["omnipad-dpad omnipad-prevent",e.unref(C)]),layout:e.unref(i).layout,"is-active":e.unref(p)?.isActive,vector:e.unref(p)?.vector,"show-stick":e.unref(i).showStick,"base-radius":f.value,onPointerdown:P,onPointermove:b,onPointerup:S,onPointercancel:l,onLostpointercapture:l},{base:e.withCtx(h=>[e.renderSlot(s.$slots,"base",e.normalizeProps(e.guardReactiveProps(h)),()=>[e.createElementVNode("div",ae,[e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm top",{on:h.vector&&h.vector.y<-e.unref(i).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm bottom",{on:h.vector&&h.vector.y>e.unref(i).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm left",{on:h.vector&&h.vector.x<-e.unref(i).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm right",{on:h.vector&&h.vector.x>e.unref(i).threshold}])},null,2),$[0]||($[0]=e.createElementVNode("div",{class:"dpad-center"},null,-1))])],!0)]),stick:e.withCtx(h=>[e.renderSlot(s.$slots,"stick",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),default:e.withCtx(h=>[e.renderSlot(s.$slots,"default",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),_:3},8,["class","layout","is-active","vector","show-stick","base-radius"]))}}),[["__scopeId","data-v-e1ecfcd0"]]),Q=B(e.defineComponent({__name:"VirtualTrackpad",props:{treeNode:{},widgetId:{},label:{},sensitivity:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:a}){const m=t,{uid:o,config:n,customClasses:i}=D(d.CMP_TYPES.TRACKPAD,m,{label:"TRACKPAD",sensitivity:1}),{core:C,state:r,elementRef:p,domEvents:k}=T(()=>new d.TrackpadCore(o.value,n.value)),c=P=>k.value?.onPointerDown(P),u=P=>k.value?.onPointerMove(P),f=P=>k.value?.onPointerUp(P),g=P=>k.value?.onPointerCancel(P);return a({uid:o,onPointerDown:c,onPointerMove:u,onPointerUp:f,onPointerCancel:g,markRectDirty:()=>C.value?.markRectDirty}),(P,b)=>(e.openBlock(),e.createBlock(I,{id:e.unref(o),ref_key:"elementRef",ref:p,class:e.normalizeClass(["omnipad-trackpad omnipad-prevent",e.unref(i)]),layout:e.unref(n).layout,label:e.unref(n).label,"is-active":e.unref(r)?.isPressed,onPointerdown:c,onPointermove:u,onPointerup:f,onPointercancel:g,onLostpointercapture:g},{base:e.withCtx(S=>[e.renderSlot(P.$slots,"base",e.normalizeProps(e.guardReactiveProps(S)),void 0,!0)]),default:e.withCtx(S=>[e.renderSlot(P.$slots,"default",e.normalizeProps(e.guardReactiveProps(S)),void 0,!0)]),_:3},8,["id","class","layout","label","is-active"]))}}),[["__scopeId","data-v-5cf9baf9"]]),q=B(e.defineComponent({__name:"VirtualJoystick",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},threshold:{},cursorMode:{},cursorSensitivity:{},mapping:{},layout:{}},setup(t,{expose:a}){const m=t,o={label:"PUSH",threshold:.2,cursorMode:!1,cursorSensitivity:1},{uid:n,config:i,customClasses:C}=D(d.CMP_TYPES.JOYSTICK,m,o),{core:r,state:p,elementRef:k,domEvents:c}=T(()=>new d.JoystickCore(n.value,i.value)),u=_.supportsContainerQueries(),f=e.ref({x:0,y:0}),g=e.watchEffect(()=>{const s=r.value?.rect;s&&(f.value={x:s.width/2,y:s.height/2})});u&&g();const P=s=>c.value?.onPointerDown(s),b=s=>c.value?.onPointerMove(s),S=s=>c.value?.onPointerUp(s),l=s=>c.value?.onPointerCancel(s);return a({uid:n,onPointerDown:P,onPointerMove:b,onPointerUp:S,onPointerCancel:l,markRectDirty:()=>r.value?.markRectDirty}),(s,$)=>(e.openBlock(),e.createBlock(Z,{ref_key:"elementRef",ref:k,class:e.normalizeClass(["omnipad-joystick omnipad-prevent",e.unref(C)]),layout:e.unref(i).layout,"is-active":e.unref(p)?.isActive,vector:e.unref(p)?.vector,"show-stick":"","base-radius":f.value,onPointerdown:P,onPointermove:b,onPointerup:S,onPointercancel:l,onLostpointercapture:l},{base:e.withCtx(h=>[e.renderSlot(s.$slots,"base",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),stick:e.withCtx(()=>[e.createVNode(I,{layout:{height:"100%",width:"100%"},"is-active":e.unref(p)?.isPressed,label:e.unref(i).label},{base:e.withCtx(h=>[e.renderSlot(s.$slots,"stick-base",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),default:e.withCtx(h=>[e.renderSlot(s.$slots,"stick",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),_:3},8,["is-active","label"])]),default:e.withCtx(h=>[e.renderSlot(s.$slots,"default",e.normalizeProps(e.guardReactiveProps(h)),void 0,!0)]),_:3},8,["class","layout","is-active","vector","base-radius"]))}}),[["__scopeId","data-v-2255ec27"]]);N(d.CMP_TYPES.BUTTON,L),N(d.CMP_TYPES.INPUT_ZONE,U),N(d.CMP_TYPES.ROOT_LAYER,O),N(d.CMP_TYPES.TARGET_ZONE,Y),N(d.CMP_TYPES.TRACKPAD,Q),N(d.CMP_TYPES.D_PAD,F),N(d.CMP_TYPES.JOYSTICK,q),w.InputZone=U,w.RootLayer=O,w.TargetZone=Y,w.VirtualButton=L,w.VirtualDPad=F,w.VirtualJoystick=q,w.VirtualTrackpad=Q,w.getComponent=A,w.getComponentSafe=z,w.hasRegisteredComponent=j,w.registerComponent=N,Object.defineProperty(w,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omnipad/vue",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "",
   "main": "./dist/omnipad-vue.umd.js",
   "module": "./dist/omnipad-vue.mjs",
@@ -30,7 +30,7 @@
     "vue": "^3.2.0"
   },
   "dependencies": {
-    "@omnipad/core": "0.4.0"
+    "@omnipad/core": "0.4.2"
   },
   "publishConfig": {
     "access": "public",