@omnipad/vue 0.3.0 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +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-020d0ab6]{position:relative;pointer-events:none;container-type:size}.omnipad-input-zone-trigger[data-v-020d0ab6]{position:absolute;inset:0;pointer-events:auto;background:transparent;touch-action:none}.dynamic-widget-mount[data-v-020d0ab6]{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-c836f838]{position:relative;pointer-events:none}.omnipad-target-zone[data-v-f072b1fb]{position:relative;pointer-events:auto;overflow:hidden;container-type:size}.omnipad-virtual-cursor[data-v-f072b1fb]{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-d141d62c]{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-d141d62c]{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-d141d62c]{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-d141d62c]{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-d141d62c]{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-d141d62c]{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-d141d62c]{position:absolute;inset:33%;background:var(--omnipad-dpad-arm-bg);z-index:1}.dpad-arm.on[data-v-d141d62c]{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-d23c7e6d]{--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-fb7cd5c1]{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)}
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)}
@@ -1,105 +1,108 @@
1
- import { Registry as se, CONTEXT as H, CMP_TYPES as C, InputZoneCore as ae, RootLayerCore as re, TargetZoneCore as ce, ButtonCore as le, DPadCore as ue, TrackpadCore as de, JoystickCore as ve } from "@omnipad/core";
2
- import { defineComponent as x, h as pe, shallowRef as fe, ref as O, onMounted as me, onUnmounted as ye, computed as w, openBlock as h, createElementBlock as D, Fragment as Pe, renderList as ge, createBlock as M, resolveDynamicComponent as J, renderSlot as b, inject as be, provide as he, useSlots as we, watch as _e, nextTick as $e, normalizeStyle as S, unref as s, createVNode as W, withCtx as _, createElementVNode as k, createCommentVNode as V, Transition as Re, normalizeClass as B, toDisplayString as Ce, normalizeProps as I, guardReactiveProps as N, watchEffect as te } from "vue";
3
- import { createPointerBridge as ke, generateUID as De, resolveLayoutStyle as z, supportsContainerQueries as j, remap as Q, reclaimFocusAtPos as Te, dispatchPointerEventAtPos as Ie, dispatchKeyboardEvent as Ne } from "@omnipad/core/utils";
4
- const K = {};
5
- function L(e, i) {
6
- K[e] = i;
1
+ 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";
2
+ 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";
3
+ 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";
4
+ const z = {};
5
+ function Z(e, s) {
6
+ z[e] = s;
7
7
  }
8
- function oe(e) {
9
- const i = K[e];
10
- return i || x({
11
- render: () => pe("div", { style: "color:red" }, `[Unknown: ${e}]`)
8
+ function ne(e) {
9
+ const s = z[e];
10
+ return s || E({
11
+ render: () => me("div", { style: "color:red" }, `[Unknown: ${e}]`)
12
12
  });
13
13
  }
14
- function ee(e) {
15
- return !e || !K[e] ? null : K[e];
14
+ function te(e) {
15
+ return !e || !z[e] ? null : z[e];
16
16
  }
17
- function at(e) {
18
- return e ? !!K[e] : !1;
17
+ function rt(e) {
18
+ return e ? !!z[e] : !1;
19
19
  }
20
- function Z(e, i = {}, d) {
21
- const t = e(), o = fe(), a = O(), n = O(null), l = O({}), P = (f) => {
22
- a.value = f;
23
- }, u = (f) => {
24
- if (!o.value) return;
25
- const v = o.value;
26
- typeof v.bindDelegate == "function" && Object.entries(f).forEach(([c, g]) => {
27
- v.bindDelegate(c, g);
20
+ function F(e, s = {}, u) {
21
+ const t = e(), n = fe(), r = V(), p = V(null), i = V({}), d = (a) => {
22
+ r.value = a;
23
+ }, y = (a) => {
24
+ if (!n.value) return;
25
+ const b = n.value;
26
+ typeof b.bindDelegate == "function" && Object.entries(a).forEach(([P, l]) => {
27
+ b.bindDelegate(P, l);
28
28
  });
29
29
  };
30
- return me(() => {
31
- o.value = t, se.getInstance().register(t), "subscribe" in t && t.subscribe(P), d && u(d);
32
- let f = null;
33
- if (n.value && (n.value instanceof Element ? f = n.value : n.value.$el instanceof Element && (f = n.value.$el)), f && "bindRectProvider" in t && t.bindRectProvider(() => f.getBoundingClientRect()), "onPointerDown" in t) {
34
- const v = ke(t, i);
35
- l.value = { ...v };
30
+ return ye(() => {
31
+ n.value = t, ae.getInstance().register(t), "subscribe" in t && t.subscribe(d), u && y(u);
32
+ let a = null;
33
+ 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) {
34
+ const b = De(t, s);
35
+ i.value = { ...b };
36
36
  }
37
- }), ye(() => {
38
- o.value && o.value.destroy();
37
+ }), Pe(() => {
38
+ n.value && n.value.destroy();
39
39
  }), {
40
- core: o,
41
- state: a,
42
- elementRef: n,
43
- domEvents: l,
44
- bindDelegates: u
40
+ core: n,
41
+ state: r,
42
+ elementRef: p,
43
+ domEvents: i,
44
+ bindDelegates: y
45
45
  };
46
46
  }
47
- const xe = { class: "omnipad-virtual-layer-base omnipad-prevent" }, Ae = /* @__PURE__ */ x({
47
+ const xe = { class: "omnipad-virtual-layer-base omnipad-prevent" }, Ee = /* @__PURE__ */ E({
48
48
  __name: "VirtualLayerBase",
49
49
  props: {
50
50
  nodes: {}
51
51
  },
52
52
  setup(e) {
53
- const i = e, d = w(() => (i.nodes || []).map((t) => {
54
- let o = ee(t.type);
55
- return !o && t.config?.baseType && (o = ee(t.config.baseType)), o || (o = oe(t.type)), {
53
+ const s = e, u = _(() => (s.nodes || []).map((t) => {
54
+ let n = te(t.type);
55
+ return !n && t.config?.baseType && (n = te(t.config.baseType)), n || (n = ne(t.type)), {
56
56
  node: t,
57
- component: o
57
+ component: n
58
58
  };
59
59
  }));
60
- return (t, o) => (h(), D("div", xe, [
61
- (h(!0), D(Pe, null, ge(d.value, (a) => (h(), M(J(a.component), {
62
- key: a.node.uid,
63
- "tree-node": a.node
60
+ return (t, n) => (w(), A("div", xe, [
61
+ (w(!0), A(ge, null, be(u.value, (r) => (w(), L(X(r.component), {
62
+ key: r.node.uid,
63
+ "tree-node": r.node
64
64
  }, null, 8, ["tree-node"]))), 128)),
65
- b(t.$slots, "default", {}, void 0, !0)
65
+ g(t.$slots, "default", {}, void 0, !0)
66
66
  ]));
67
67
  }
68
- }), U = (e, i) => {
69
- const d = e.__vccOpts || e;
70
- for (const [t, o] of i)
71
- d[t] = o;
72
- return d;
73
- }, ne = /* @__PURE__ */ U(Ae, [["__scopeId", "data-v-d67cc501"]]);
74
- function F(e, i, d = {}) {
75
- const t = i.treeNode, o = t && t.config?.baseType === e || t?.type === e ? t : void 0;
76
- t && !o && console.warn(
68
+ }), O = (e, s) => {
69
+ const u = e.__vccOpts || e;
70
+ for (const [t, n] of s)
71
+ u[t] = n;
72
+ return u;
73
+ }, se = /* @__PURE__ */ O(Ee, [["__scopeId", "data-v-d67cc501"]]);
74
+ function Y(e, s, u = {}) {
75
+ const t = s.treeNode, n = t && t.config?.baseType === e || t?.type === e ? t : void 0;
76
+ t && !n && console.warn(
77
77
  `[OmniPad-Validation] Type mismatch! Component expected "${e}", but received "${t.type}". Config ignored.`
78
78
  );
79
- const a = be(H.PARENT_ID_KEY, O(void 0)), n = w(() => i.parentId || o?.config?.parentId || a.value), l = w(() => i.widgetId || o?.uid || De(e));
80
- he(H.PARENT_ID_KEY, l);
81
- const P = w(() => {
82
- const u = o?.config || {}, f = Object.fromEntries(
83
- Object.entries(i).filter(([v, c]) => c !== void 0 && v !== "treeNode" && v !== "widgetId")
79
+ 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));
80
+ we(ee.PARENT_ID_KEY, i);
81
+ const d = _(() => {
82
+ const a = n?.config || {}, b = Object.fromEntries(
83
+ Object.entries(s).filter(([P, l]) => l !== void 0 && P !== "treeNode" && P !== "widgetId")
84
84
  );
85
85
  return {
86
- ...d,
87
86
  ...u,
88
- ...f,
89
- id: l.value,
87
+ ...a,
88
+ ...b,
89
+ id: i.value,
90
90
  baseType: e,
91
- parentId: n.value,
91
+ parentId: p.value,
92
92
  // 特殊处理 Layout:深度合并,确保即便只传了 { width: 100 } 也不丢失原来的 left/top
93
93
  layout: {
94
- ...d.layout || {},
95
94
  ...u.layout || {},
96
- ...f.layout || {}
95
+ ...a.layout || {},
96
+ ...b.layout || {}
97
97
  }
98
98
  };
99
+ }), y = _(() => {
100
+ const a = d.value.cssClasses;
101
+ return a ? Array.isArray(a) ? a : [a] : [];
99
102
  });
100
- return { uid: l, config: P };
103
+ return { uid: i, config: d, customClasses: y };
101
104
  }
102
- const Ee = ["id"], Se = /* @__PURE__ */ x({
105
+ const Se = ["id"], Ue = /* @__PURE__ */ E({
103
106
  __name: "InputZone",
104
107
  props: {
105
108
  treeNode: {},
@@ -108,100 +111,103 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
108
111
  preventFocusLoss: {}
109
112
  },
110
113
  setup(e) {
111
- const i = e, d = we(), t = O(null), { uid: o, config: a } = F(C.INPUT_ZONE, i), { core: n, state: l, elementRef: P, domEvents: u, bindDelegates: f } = Z(() => new ae(o.value, a.value), { requireDirectHit: !0 }), v = w(() => {
112
- const p = i.treeNode?.config?.dynamicWidgetId;
113
- return i.treeNode?.children?.filter((E) => E.uid !== p) || [];
114
- }), c = w(() => {
115
- const E = (d.dynamicWidget?.() || []).filter((q) => !(q.type === Comment || q.type === Text)), T = i.treeNode?.children?.find(
116
- (q) => q.uid === i.treeNode?.config?.dynamicWidgetId
117
- ), Y = E.length > 0;
118
- return E.length > 1 && console.error(
119
- `[OmniPad-Validation] InputZone ${o.value} has multiple dynamic widgets in slot. Only the first one will be activated.`
120
- ), Y && T && console.warn(
121
- `[OmniPad-Validation] InputZone ${o.value} has both Slot and Config dynamic widgets. Config ignored.`
114
+ const s = e, u = _e(), t = V(null), { uid: n, config: r, customClasses: p } = Y(
115
+ D.INPUT_ZONE,
116
+ s
117
+ ), { core: i, state: d, elementRef: y, domEvents: a, bindDelegates: b } = F(() => new re(n.value, r.value), { requireDirectHit: !0 }), P = _(() => {
118
+ const v = s.treeNode?.config?.dynamicWidgetId;
119
+ return s.treeNode?.children?.filter((U) => U.uid !== v) || [];
120
+ }), l = _(() => {
121
+ const U = (u.dynamicWidget?.() || []).filter((Q) => !(Q.type === Comment || Q.type === Text)), I = s.treeNode?.children?.find(
122
+ (Q) => Q.uid === s.treeNode?.config?.dynamicWidgetId
123
+ ), K = U.length > 0;
124
+ return U.length > 1 && console.error(
125
+ `[OmniPad-Validation] InputZone ${n.value} has multiple dynamic widgets in slot. Only the first one will be activated.`
126
+ ), K && I && console.warn(
127
+ `[OmniPad-Validation] InputZone ${n.value} has both Slot and Config dynamic widgets. Config ignored.`
122
128
  ), {
123
- nodeToRender: Y ? E[0] : T || null,
124
- isFromSlot: Y
129
+ nodeToRender: K ? U[0] : I || null,
130
+ isFromSlot: K
125
131
  };
126
- }), g = w(() => {
127
- const p = c.value.nodeToRender;
128
- return oe(p.config?.baseType || p.type);
132
+ }), h = _(() => {
133
+ const v = l.value.nodeToRender;
134
+ return ne(v.config?.baseType || v.type);
129
135
  });
130
- _e(
136
+ Ce(
131
137
  t,
132
- (p) => {
138
+ (v) => {
133
139
  $e(() => {
134
- p && p?.uid && (n.value?.updateConfig({
135
- dynamicWidgetId: p.uid
136
- }), f({
137
- dynamicWidgetPointerDown: p.onPointerDown,
138
- dynamicWidgetPointerMove: p.onPointerMove,
139
- dynamicWidgetPointerUp: p.onPointerUp,
140
- dynamicWidgetPointerCancel: p.onPointerCancel
140
+ v && v?.uid && (i.value?.updateConfig({
141
+ dynamicWidgetId: v.uid
142
+ }), b({
143
+ dynamicWidgetPointerDown: v.onPointerDown,
144
+ dynamicWidgetPointerMove: v.onPointerMove,
145
+ dynamicWidgetPointerUp: v.onPointerUp,
146
+ dynamicWidgetPointerCancel: v.onPointerCancel
141
147
  }));
142
148
  });
143
149
  },
144
150
  { immediate: !0 }
145
151
  );
146
- const $ = w(() => z(a.value.layout)), R = j(), m = w(() => {
147
- if (!l.value) return { display: "none" };
148
- if (!l.value?.isDynamicActive) return { visibility: "hidden", opacity: 0 };
149
- let p, E;
150
- const T = l?.value?.dynamicPosition;
151
- if (R)
152
- p = `${T.x}cqw`, E = `${T.y}cqh`;
152
+ const R = _(() => j(r.value.layout)), k = q(), m = _(() => {
153
+ if (!d.value) return { display: "none" };
154
+ if (!d.value?.isDynamicActive) return { visibility: "hidden", opacity: 0 };
155
+ let v, U;
156
+ const I = d?.value?.dynamicPosition;
157
+ if (k)
158
+ v = `${I.x}cqw`, U = `${I.y}cqh`;
153
159
  else {
154
- const Y = n?.value?.rect;
155
- p = `${Q(T?.x || 0, 0, 100, 0, Y?.width || 0)}px`, E = `${Q(T?.y || 0, 0, 100, 0, Y?.height || 0)}px`;
160
+ const K = i?.value?.rect;
161
+ v = `${W(I?.x || 0, 0, 100, 0, K?.width || 0)}px`, U = `${W(I?.y || 0, 0, 100, 0, K?.height || 0)}px`;
156
162
  }
157
163
  return {
158
164
  zIndex: 100,
159
- "--dynamic-widget-mount-x": p,
160
- "--dynamic-widget-mount-y": E,
165
+ "--dynamic-widget-mount-x": v,
166
+ "--dynamic-widget-mount-y": U,
161
167
  visibility: "visible",
162
168
  opacity: 1,
163
169
  pointerEvents: "auto"
164
170
  };
165
- }), r = (p) => u.value?.onPointerDown(p), A = (p) => u.value?.onPointerMove(p), y = (p) => u.value?.onPointerUp(p), G = (p) => u.value?.onPointerCancel(p);
166
- return (p, E) => (h(), D("div", {
167
- id: s(o),
171
+ }), c = (v) => a.value?.onPointerDown(v), S = (v) => a.value?.onPointerMove(v), f = (v) => a.value?.onPointerUp(v), H = (v) => a.value?.onPointerCancel(v);
172
+ return (v, U) => (w(), A("div", {
173
+ id: o(n),
168
174
  ref_key: "elementRef",
169
- ref: P,
170
- class: "omnipad-input-zone omnipad-prevent",
171
- style: S($.value)
175
+ ref: y,
176
+ class: C(["omnipad-input-zone omnipad-prevent", o(p)]),
177
+ style: B(R.value)
172
178
  }, [
173
- W(ne, { nodes: v.value }, {
174
- default: _(() => [
175
- b(p.$slots, "default", {}, void 0, !0)
179
+ J(se, { nodes: P.value }, {
180
+ default: $(() => [
181
+ g(v.$slots, "default", {}, void 0, !0)
176
182
  ]),
177
183
  _: 3
178
184
  }, 8, ["nodes"]),
179
- c.value.nodeToRender || s(n)?.isInterceptorRequired ? (h(), D("div", {
185
+ l.value.nodeToRender || o(i)?.isInterceptorRequired ? (w(), A("div", {
180
186
  key: 0,
181
187
  class: "omnipad-input-zone-trigger omnipad-prevent",
182
- onPointerdown: r,
183
- onPointermove: A,
184
- onPointerup: y,
185
- onPointercancel: G,
186
- onLostpointercapture: G
188
+ onPointerdown: c,
189
+ onPointermove: S,
190
+ onPointerup: f,
191
+ onPointercancel: H,
192
+ onLostpointercapture: H
187
193
  }, [
188
- k("div", {
194
+ T("div", {
189
195
  class: "dynamic-widget-mount",
190
- style: S(m.value)
196
+ style: B(m.value)
191
197
  }, [
192
- c.value.isFromSlot ? (h(), M(J(c.value.nodeToRender), {
198
+ l.value.isFromSlot ? (w(), L(X(l.value.nodeToRender), {
193
199
  key: 0,
194
- ref: (T) => t.value = T
195
- }, null, 512)) : c.value.nodeToRender ? (h(), M(J(g.value), {
200
+ ref: (I) => t.value = I
201
+ }, null, 512)) : l.value.nodeToRender ? (w(), L(X(h.value), {
196
202
  key: 1,
197
- ref: (T) => t.value = T,
198
- "tree-node": c.value.nodeToRender
199
- }, null, 8, ["tree-node"])) : V("", !0)
203
+ ref: (I) => t.value = I,
204
+ "tree-node": l.value.nodeToRender
205
+ }, null, 8, ["tree-node"])) : M("", !0)
200
206
  ], 4)
201
- ], 32)) : V("", !0)
202
- ], 12, Ee));
207
+ ], 32)) : M("", !0)
208
+ ], 14, Se));
203
209
  }
204
- }), Ue = /* @__PURE__ */ U(Se, [["__scopeId", "data-v-020d0ab6"]]), Be = ["id"], Oe = /* @__PURE__ */ x({
210
+ }), Be = /* @__PURE__ */ O(Ue, [["__scopeId", "data-v-b4ae3724"]]), Oe = ["id"], Ve = /* @__PURE__ */ E({
205
211
  __name: "RootLayer",
206
212
  props: {
207
213
  treeNode: {},
@@ -209,28 +215,28 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
209
215
  layout: {}
210
216
  },
211
217
  setup(e) {
212
- const i = e, { uid: d, config: t } = F(C.ROOT_LAYER, i), { elementRef: o } = Z(() => new re(d.value, t.value)), a = w(() => z(t.value.layout));
213
- return (n, l) => (h(), D("div", {
214
- id: s(d),
218
+ 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));
219
+ return (i, d) => (w(), A("div", {
220
+ id: o(u),
215
221
  ref_key: "elementRef",
216
- ref: o,
217
- class: "omnipad-root-layer omnipad-prevent",
218
- style: S(a.value)
222
+ ref: r,
223
+ class: C(["omnipad-root-layer omnipad-prevent", o(n)]),
224
+ style: B(p.value)
219
225
  }, [
220
- W(ne, {
226
+ J(se, {
221
227
  nodes: e.treeNode?.children || []
222
228
  }, {
223
- default: _(() => [
224
- b(n.$slots, "default", {}, void 0, !0)
229
+ default: $(() => [
230
+ g(i.$slots, "default", {}, void 0, !0)
225
231
  ]),
226
232
  _: 3
227
233
  }, 8, ["nodes"])
228
- ], 12, Be));
234
+ ], 14, Oe));
229
235
  }
230
- }), Ve = /* @__PURE__ */ U(Oe, [["__scopeId", "data-v-c836f838"]]), Me = ["id"], Le = {
236
+ }), Me = /* @__PURE__ */ O(Ve, [["__scopeId", "data-v-e53747a9"]]), Le = ["id"], Ze = {
231
237
  key: 0,
232
238
  class: "omnipad-default-focus-border-feedback"
233
- }, Ze = /* @__PURE__ */ x({
239
+ }, Fe = /* @__PURE__ */ E({
234
240
  __name: "TargetZone",
235
241
  props: {
236
242
  treeNode: {},
@@ -240,100 +246,100 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
240
246
  layout: {}
241
247
  },
242
248
  setup(e) {
243
- const i = e, d = {
249
+ const s = e, u = {
244
250
  cursorAutoDelay: 2500
245
- }, { uid: t, config: o } = F(
246
- C.TARGET_ZONE,
247
- i,
248
- d
249
- ), { core: a, state: n, elementRef: l, domEvents: P } = Z(
250
- () => new ce(t.value, o.value),
251
+ }, { uid: t, config: n, customClasses: r } = Y(
252
+ D.TARGET_ZONE,
253
+ s,
254
+ u
255
+ ), { core: p, state: i, elementRef: d, domEvents: y } = F(
256
+ () => new le(t.value, n.value),
251
257
  {},
252
258
  {
253
259
  dispatchKeyboardEvent: Ne,
254
260
  dispatchPointerEventAtPos: Ie,
255
- reclaimFocusAtPos: Te
261
+ reclaimFocusAtPos: Ae
256
262
  }
257
- ), u = w(() => z(o.value.layout)), f = j(), v = w(() => {
258
- if (!n.value) return { display: "none" };
259
- let m, r;
260
- const A = n?.value?.position;
261
- if (f)
262
- m = `${A.x}cqw`, r = `${A.y}cqh`;
263
+ ), a = _(() => j(n.value.layout)), b = q(), P = _(() => {
264
+ if (!i.value) return { display: "none" };
265
+ let m, c;
266
+ const S = i?.value?.position;
267
+ if (b)
268
+ m = `${S.x}cqw`, c = `${S.y}cqh`;
263
269
  else {
264
- const y = a?.value?.rect;
265
- m = `${Q(A?.x || 0, 0, 100, 0, y?.width || 0)}px`, r = `${Q(A?.y || 0, 0, 100, 0, y?.height || 0)}px`;
270
+ const f = p?.value?.rect;
271
+ m = `${W(S?.x || 0, 0, 100, 0, f?.width || 0)}px`, c = `${W(S?.y || 0, 0, 100, 0, f?.height || 0)}px`;
266
272
  }
267
273
  return {
268
274
  "--omnipad-virtual-cursor-x": m,
269
- "--omnipad-virtual-cursor-y": r,
270
- opacity: n.value.isVisible ? 1 : 0
275
+ "--omnipad-virtual-cursor-y": c,
276
+ opacity: i.value.isVisible ? 1 : 0
271
277
  };
272
- }), c = (m) => P.value?.onPointerDown(m), g = (m) => P.value?.onPointerMove(m), $ = (m) => P.value?.onPointerUp(m), R = (m) => P.value?.onPointerCancel(m);
273
- return (m, r) => (h(), D("div", {
274
- id: s(t),
278
+ }), l = (m) => y.value?.onPointerDown(m), h = (m) => y.value?.onPointerMove(m), R = (m) => y.value?.onPointerUp(m), k = (m) => y.value?.onPointerCancel(m);
279
+ return (m, c) => (w(), A("div", {
280
+ id: o(t),
275
281
  ref_key: "elementRef",
276
- ref: l,
277
- class: "omnipad-target-zone omnipad-prevent",
278
- style: S(u.value),
279
- onPointerdown: c,
280
- onPointermove: g,
281
- onPointerup: $,
282
- onPointercancel: R,
283
- onLostpointercapture: R
282
+ ref: d,
283
+ class: C(["omnipad-target-zone omnipad-prevent", o(r)]),
284
+ style: B(a.value),
285
+ onPointerdown: l,
286
+ onPointermove: h,
287
+ onPointerup: R,
288
+ onPointercancel: k,
289
+ onLostpointercapture: k
284
290
  }, [
285
- b(m.$slots, "focus-feedback", {
286
- state: s(n),
287
- isReturning: s(n)?.isFocusReturning,
288
- cursorPos: s(n)?.position
291
+ g(m.$slots, "focus-feedback", {
292
+ state: o(i),
293
+ isReturning: o(i)?.isFocusReturning,
294
+ cursorPos: o(i)?.position
289
295
  }, () => [
290
- W(Re, { name: "omnipad-default-focus-fade" }, {
291
- default: _(() => [
292
- s(n)?.isFocusReturning ? (h(), D("div", Le)) : V("", !0)
296
+ J(Re, { name: "omnipad-default-focus-fade" }, {
297
+ default: $(() => [
298
+ o(i)?.isFocusReturning ? (w(), A("div", Ze)) : M("", !0)
293
299
  ]),
294
300
  _: 1
295
301
  })
296
302
  ], !0),
297
- s(o).cursorEnabled ? (h(), D("div", {
303
+ o(n).cursorEnabled ? (w(), A("div", {
298
304
  key: 0,
299
305
  class: "omnipad-virtual-cursor",
300
- style: S(v.value)
306
+ style: B(P.value)
301
307
  }, [
302
- b(m.$slots, "cursor", {
303
- state: s(n),
304
- isDown: s(n)?.isPointerDown,
305
- isReturning: s(n)?.isFocusReturning,
306
- cursorPos: s(n)?.position
308
+ g(m.$slots, "cursor", {
309
+ state: o(i),
310
+ isDown: o(i)?.isPointerDown,
311
+ isReturning: o(i)?.isFocusReturning,
312
+ cursorPos: o(i)?.position
307
313
  }, () => [
308
- k("div", {
309
- class: B(["omnipad-default-cursor-dot", { "is-down": s(n)?.isPointerDown }])
314
+ T("div", {
315
+ class: C(["omnipad-default-cursor-dot", { "is-down": o(i)?.isPointerDown }])
310
316
  }, null, 2)
311
317
  ], !0)
312
- ], 4)) : V("", !0),
313
- s(o).cursorEnabled ? (h(), D("div", {
318
+ ], 4)) : M("", !0),
319
+ o(n).cursorEnabled ? (w(), A("div", {
314
320
  key: 1,
315
321
  class: "omnipad-virtual-cursor",
316
- style: S(v.value)
322
+ style: B(P.value)
317
323
  }, [
318
- b(m.$slots, "with-cursor", {
319
- state: s(n),
320
- isDown: s(n)?.isPointerDown,
321
- isReturning: s(n)?.isFocusReturning,
322
- cursorPos: s(n)?.position
324
+ g(m.$slots, "with-cursor", {
325
+ state: o(i),
326
+ isDown: o(i)?.isPointerDown,
327
+ isReturning: o(i)?.isFocusReturning,
328
+ cursorPos: o(i)?.position
323
329
  }, void 0, !0)
324
- ], 4)) : V("", !0),
325
- b(m.$slots, "default", {
326
- state: s(n),
327
- isDown: s(n)?.isPointerDown,
328
- isReturning: s(n)?.isFocusReturning,
329
- cursorPos: s(n)?.position
330
+ ], 4)) : M("", !0),
331
+ g(m.$slots, "default", {
332
+ state: o(i),
333
+ isDown: o(i)?.isPointerDown,
334
+ isReturning: o(i)?.isFocusReturning,
335
+ cursorPos: o(i)?.position
330
336
  }, void 0, !0)
331
- ], 44, Me));
337
+ ], 46, Le));
332
338
  }
333
- }), Fe = /* @__PURE__ */ U(Ze, [["__scopeId", "data-v-f072b1fb"]]), Ye = { class: "omnipad-button-content-layer" }, Ke = {
339
+ }), Ye = /* @__PURE__ */ O(Fe, [["__scopeId", "data-v-44c28c60"]]), Ke = { class: "omnipad-button-content-layer" }, ze = {
334
340
  key: 0,
335
341
  class: "omnipad-default-button-label"
336
- }, ze = /* @__PURE__ */ x({
342
+ }, je = /* @__PURE__ */ E({
337
343
  __name: "VirtualButtonBase",
338
344
  props: {
339
345
  layout: {},
@@ -341,31 +347,31 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
341
347
  label: {}
342
348
  },
343
349
  setup(e) {
344
- const i = e, d = w(() => i.layout ? z(i.layout) : {});
345
- return (t, o) => (h(), D("div", {
350
+ const s = e, u = _(() => s.layout ? j(s.layout) : {});
351
+ return (t, n) => (w(), A("div", {
346
352
  class: "omnipad-button-base omnipad-prevent",
347
- style: S(d.value),
353
+ style: B(u.value),
348
354
  tabindex: "-1"
349
355
  }, [
350
- b(t.$slots, "base", {
356
+ g(t.$slots, "base", {
351
357
  isActive: e.isActive,
352
358
  label: e.label
353
359
  }, () => [
354
- k("div", {
355
- class: B(["omnipad-default-button-base", { "is-active": e.isActive }])
360
+ T("div", {
361
+ class: C(["omnipad-default-button-base", { "is-active": e.isActive }])
356
362
  }, null, 2)
357
363
  ], !0),
358
- k("div", Ye, [
359
- b(t.$slots, "default", {
364
+ T("div", Ke, [
365
+ g(t.$slots, "default", {
360
366
  isActive: e.isActive,
361
367
  label: e.label
362
368
  }, () => [
363
- e.label ? (h(), D("span", Ke, Ce(e.label), 1)) : V("", !0)
369
+ e.label ? (w(), A("span", ze, ke(e.label), 1)) : M("", !0)
364
370
  ], !0)
365
371
  ])
366
372
  ], 4));
367
373
  }
368
- }), X = /* @__PURE__ */ U(ze, [["__scopeId", "data-v-f6a6e082"]]), je = /* @__PURE__ */ x({
374
+ }), G = /* @__PURE__ */ O(je, [["__scopeId", "data-v-f6a6e082"]]), qe = /* @__PURE__ */ E({
369
375
  __name: "VirtualButton",
370
376
  props: {
371
377
  treeNode: {},
@@ -375,41 +381,45 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
375
381
  mapping: {},
376
382
  layout: {}
377
383
  },
378
- setup(e, { expose: i }) {
379
- const d = e, t = {
384
+ setup(e, { expose: s }) {
385
+ const u = e, t = {
380
386
  label: "BTN"
381
- }, { uid: o, config: a } = F(C.BUTTON, d, t), { state: n, elementRef: l, domEvents: P } = Z(
382
- () => new le(o.value, a.value)
383
- ), u = (g) => P.value?.onPointerDown(g), f = (g) => P.value?.onPointerMove(g), v = (g) => P.value?.onPointerUp(g), c = (g) => P.value?.onPointerCancel(g);
384
- return i({
385
- uid: o,
386
- onPointerDown: u,
387
- onPointerMove: f,
388
- onPointerUp: v,
389
- onPointerCancel: c
390
- }), (g, $) => (h(), M(X, {
391
- id: s(o),
387
+ }, { uid: n, config: r, customClasses: p } = Y(
388
+ D.BUTTON,
389
+ u,
390
+ t
391
+ ), { state: i, elementRef: d, domEvents: y } = F(
392
+ () => new ue(n.value, r.value)
393
+ ), a = (h) => y.value?.onPointerDown(h), b = (h) => y.value?.onPointerMove(h), P = (h) => y.value?.onPointerUp(h), l = (h) => y.value?.onPointerCancel(h);
394
+ return s({
395
+ uid: n,
396
+ onPointerDown: a,
397
+ onPointerMove: b,
398
+ onPointerUp: P,
399
+ onPointerCancel: l
400
+ }), (h, R) => (w(), L(G, {
401
+ id: o(n),
392
402
  ref_key: "elementRef",
393
- ref: l,
394
- class: "omnipad-button omnipad-prevent",
395
- layout: s(a).layout,
396
- label: s(a).label,
397
- "is-active": s(n)?.isPressed,
398
- onPointerdown: u,
399
- onPointerup: v,
400
- onPointercancel: c,
401
- onLostpointercapture: c
403
+ ref: d,
404
+ class: C(["omnipad-button omnipad-prevent", o(p)]),
405
+ layout: o(r).layout,
406
+ label: o(r).label,
407
+ "is-active": o(i)?.isPressed,
408
+ onPointerdown: a,
409
+ onPointerup: P,
410
+ onPointercancel: l,
411
+ onLostpointercapture: l
402
412
  }, {
403
- base: _((R) => [
404
- b(g.$slots, "base", I(N(R)))
413
+ base: $((k) => [
414
+ g(h.$slots, "base", N(x(k)))
405
415
  ]),
406
- default: _((R) => [
407
- b(g.$slots, "default", I(N(R)))
416
+ default: $((k) => [
417
+ g(h.$slots, "default", N(x(k)))
408
418
  ]),
409
419
  _: 3
410
- }, 8, ["id", "layout", "label", "is-active"]));
420
+ }, 8, ["id", "class", "layout", "label", "is-active"]));
411
421
  }
412
- }), qe = { class: "omnipad-axis-bg" }, Qe = { class: "omnipad-axis-content-layer" }, We = /* @__PURE__ */ x({
422
+ }), Qe = { class: "omnipad-axis-bg" }, We = { class: "omnipad-axis-content-layer" }, Je = /* @__PURE__ */ E({
413
423
  __name: "VirtualAxisBase",
414
424
  props: {
415
425
  layout: {},
@@ -419,51 +429,51 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
419
429
  baseRadius: {}
420
430
  },
421
431
  setup(e) {
422
- const i = e, d = w(() => i.layout ? z(i.layout) : {}), t = j(), o = w(() => {
423
- const a = i.vector?.x || 0, n = i.vector?.y || 0, l = i.baseRadius?.x || 0, P = i.baseRadius?.y || 0, u = t ? `${a * 50}cqw` : `${a * l}px`, f = t ? `${n * 50}cqh` : `${n * P}px`, v = t ? "100cqw" : `${l * 2}px`, c = t ? "100cqh" : `${P * 2}px`;
432
+ const s = e, u = _(() => s.layout ? j(s.layout) : {}), t = q(), n = _(() => {
433
+ 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`;
424
434
  return {
425
- "--omnipad-axis-stick-container-x": u,
426
- "--omnipad-axis-stick-container-y": f,
427
- "--omnipad-axis-stick-width": v,
428
- "--omnipad-axis-stick-height": c,
435
+ "--omnipad-axis-stick-container-x": y,
436
+ "--omnipad-axis-stick-container-y": a,
437
+ "--omnipad-axis-stick-width": b,
438
+ "--omnipad-axis-stick-height": P,
429
439
  // 松手时加一点回弹过渡,活动时取消过渡保证绝对跟手
430
- transition: i.isActive ? "none" : "transform 0.1s ease-out"
440
+ transition: s.isActive ? "none" : "transform 0.1s ease-out"
431
441
  };
432
442
  });
433
- return (a, n) => (h(), D("div", {
434
- class: B(["omnipad-axis-base omnipad-prevent", { "is-active": e.isActive }]),
435
- style: S(d.value),
443
+ return (r, p) => (w(), A("div", {
444
+ class: C(["omnipad-axis-base omnipad-prevent", { "is-active": e.isActive }]),
445
+ style: B(u.value),
436
446
  tabindex: "-1"
437
447
  }, [
438
- k("div", qe, [
439
- b(a.$slots, "base", {
448
+ T("div", Qe, [
449
+ g(r.$slots, "base", {
440
450
  isActive: e.isActive,
441
451
  vector: e.vector
442
452
  }, void 0, !0)
443
453
  ]),
444
- e.showStick ? (h(), D("div", {
454
+ e.showStick ? (w(), A("div", {
445
455
  key: 0,
446
456
  class: "omnipad-axis-stick-container",
447
- style: S(o.value)
457
+ style: B(n.value)
448
458
  }, [
449
- b(a.$slots, "stick", {
459
+ g(r.$slots, "stick", {
450
460
  isActive: e.isActive,
451
461
  vector: e.vector
452
462
  }, () => [
453
- k("div", {
454
- class: B(["omnipad-default-axis-stick", { "is-active": e.isActive }])
463
+ T("div", {
464
+ class: C(["omnipad-default-axis-stick", { "is-active": e.isActive }])
455
465
  }, null, 2)
456
466
  ], !0)
457
- ], 4)) : V("", !0),
458
- k("div", Qe, [
459
- b(a.$slots, "default", {
467
+ ], 4)) : M("", !0),
468
+ T("div", We, [
469
+ g(r.$slots, "default", {
460
470
  isActive: e.isActive,
461
471
  vector: e.vector
462
472
  }, void 0, !0)
463
473
  ])
464
474
  ], 6));
465
475
  }
466
- }), ie = /* @__PURE__ */ U(We, [["__scopeId", "data-v-95bb429e"]]), Je = { class: "omnipad-dpad-cross-bg" }, Xe = /* @__PURE__ */ x({
476
+ }), ie = /* @__PURE__ */ O(Je, [["__scopeId", "data-v-95bb429e"]]), Xe = { class: "omnipad-dpad-cross-bg" }, Ge = /* @__PURE__ */ E({
467
477
  __name: "VirtualDPad",
468
478
  props: {
469
479
  treeNode: {},
@@ -474,68 +484,72 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
474
484
  showStick: {},
475
485
  layout: {}
476
486
  },
477
- setup(e, { expose: i }) {
478
- const d = e, t = {
487
+ setup(e, { expose: s }) {
488
+ const u = e, t = {
479
489
  showStick: !1,
480
490
  threshold: 0.3
481
- }, { uid: o, config: a } = F(C.D_PAD, d, t), { core: n, state: l, elementRef: P, domEvents: u } = Z(
482
- () => new ue(o.value, a.value)
483
- ), f = j(), v = O({ x: 0, y: 0 }), c = te(() => {
484
- const r = n.value?.rect;
485
- r && (v.value = { x: r.width / 2, y: r.height / 2 });
491
+ }, { uid: n, config: r, customClasses: p } = Y(
492
+ D.D_PAD,
493
+ u,
494
+ t
495
+ ), { core: i, state: d, elementRef: y, domEvents: a } = F(
496
+ () => new de(n.value, r.value)
497
+ ), b = q(), P = V({ x: 0, y: 0 }), l = oe(() => {
498
+ const c = i.value?.rect;
499
+ c && (P.value = { x: c.width / 2, y: c.height / 2 });
486
500
  });
487
- f && c();
488
- const g = (r) => u.value?.onPointerDown(r), $ = (r) => u.value?.onPointerMove(r), R = (r) => u.value?.onPointerUp(r), m = (r) => u.value?.onPointerCancel(r);
489
- return i({
490
- uid: o,
491
- onPointerDown: g,
492
- onPointerMove: $,
493
- onPointerUp: R,
501
+ b && l();
502
+ 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);
503
+ return s({
504
+ uid: n,
505
+ onPointerDown: h,
506
+ onPointerMove: R,
507
+ onPointerUp: k,
494
508
  onPointerCancel: m
495
- }), (r, A) => (h(), M(ie, {
509
+ }), (c, S) => (w(), L(ie, {
496
510
  ref_key: "elementRef",
497
- ref: P,
498
- class: "omnipad-dpad omnipad-prevent",
499
- layout: s(a).layout,
500
- "is-active": s(l)?.isActive,
501
- vector: s(l)?.vector,
502
- "show-stick": s(a).showStick,
503
- "base-radius": v.value,
504
- onPointerdown: g,
505
- onPointermove: $,
506
- onPointerup: R,
511
+ ref: y,
512
+ class: C(["omnipad-dpad omnipad-prevent", o(p)]),
513
+ layout: o(r).layout,
514
+ "is-active": o(d)?.isActive,
515
+ vector: o(d)?.vector,
516
+ "show-stick": o(r).showStick,
517
+ "base-radius": P.value,
518
+ onPointerdown: h,
519
+ onPointermove: R,
520
+ onPointerup: k,
507
521
  onPointercancel: m,
508
522
  onLostpointercapture: m
509
523
  }, {
510
- base: _((y) => [
511
- b(r.$slots, "base", I(N(y)), () => [
512
- k("div", Je, [
513
- k("div", {
514
- class: B(["dpad-arm top", { on: y.vector && y.vector.y < -s(a).threshold }])
524
+ base: $((f) => [
525
+ g(c.$slots, "base", N(x(f)), () => [
526
+ T("div", Xe, [
527
+ T("div", {
528
+ class: C(["dpad-arm top", { on: f.vector && f.vector.y < -o(r).threshold }])
515
529
  }, null, 2),
516
- k("div", {
517
- class: B(["dpad-arm bottom", { on: y.vector && y.vector.y > s(a).threshold }])
530
+ T("div", {
531
+ class: C(["dpad-arm bottom", { on: f.vector && f.vector.y > o(r).threshold }])
518
532
  }, null, 2),
519
- k("div", {
520
- class: B(["dpad-arm left", { on: y.vector && y.vector.x < -s(a).threshold }])
533
+ T("div", {
534
+ class: C(["dpad-arm left", { on: f.vector && f.vector.x < -o(r).threshold }])
521
535
  }, null, 2),
522
- k("div", {
523
- class: B(["dpad-arm right", { on: y.vector && y.vector.x > s(a).threshold }])
536
+ T("div", {
537
+ class: C(["dpad-arm right", { on: f.vector && f.vector.x > o(r).threshold }])
524
538
  }, null, 2),
525
- A[0] || (A[0] = k("div", { class: "dpad-center" }, null, -1))
539
+ S[0] || (S[0] = T("div", { class: "dpad-center" }, null, -1))
526
540
  ])
527
541
  ], !0)
528
542
  ]),
529
- stick: _((y) => [
530
- b(r.$slots, "stick", I(N(y)), void 0, !0)
543
+ stick: $((f) => [
544
+ g(c.$slots, "stick", N(x(f)), void 0, !0)
531
545
  ]),
532
- default: _((y) => [
533
- b(r.$slots, "default", I(N(y)), void 0, !0)
546
+ default: $((f) => [
547
+ g(c.$slots, "default", N(x(f)), void 0, !0)
534
548
  ]),
535
549
  _: 3
536
- }, 8, ["layout", "is-active", "vector", "show-stick", "base-radius"]));
550
+ }, 8, ["class", "layout", "is-active", "vector", "show-stick", "base-radius"]));
537
551
  }
538
- }), Ge = /* @__PURE__ */ U(Xe, [["__scopeId", "data-v-d141d62c"]]), He = /* @__PURE__ */ x({
552
+ }), He = /* @__PURE__ */ O(Ge, [["__scopeId", "data-v-671bfba1"]]), et = /* @__PURE__ */ E({
539
553
  __name: "VirtualTrackpad",
540
554
  props: {
541
555
  treeNode: {},
@@ -546,43 +560,43 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
546
560
  mapping: {},
547
561
  layout: {}
548
562
  },
549
- setup(e, { expose: i }) {
550
- const d = e, { uid: t, config: o } = F(C.TRACKPAD, d, {
563
+ setup(e, { expose: s }) {
564
+ const u = e, { uid: t, config: n, customClasses: r } = Y(D.TRACKPAD, u, {
551
565
  label: "TRACKPAD",
552
566
  sensitivity: 1
553
- }), { state: a, elementRef: n, domEvents: l } = Z(
554
- () => new de(t.value, o.value)
555
- ), P = (c) => l.value?.onPointerDown(c), u = (c) => l.value?.onPointerMove(c), f = (c) => l.value?.onPointerUp(c), v = (c) => l.value?.onPointerCancel(c);
556
- return i({
567
+ }), { state: p, elementRef: i, domEvents: d } = F(
568
+ () => new ve(t.value, n.value)
569
+ ), y = (l) => d.value?.onPointerDown(l), a = (l) => d.value?.onPointerMove(l), b = (l) => d.value?.onPointerUp(l), P = (l) => d.value?.onPointerCancel(l);
570
+ return s({
557
571
  uid: t,
558
- onPointerDown: P,
559
- onPointerMove: u,
560
- onPointerUp: f,
561
- onPointerCancel: v
562
- }), (c, g) => (h(), M(X, {
563
- id: s(t),
572
+ onPointerDown: y,
573
+ onPointerMove: a,
574
+ onPointerUp: b,
575
+ onPointerCancel: P
576
+ }), (l, h) => (w(), L(G, {
577
+ id: o(t),
564
578
  ref_key: "elementRef",
565
- ref: n,
566
- class: "omnipad-trackpad omnipad-prevent",
567
- layout: s(o).layout,
568
- label: s(o).label,
569
- "is-active": s(a)?.isPressed,
570
- onPointerdown: P,
571
- onPointermove: u,
572
- onPointerup: f,
573
- onPointercancel: v,
574
- onLostpointercapture: v
579
+ ref: i,
580
+ class: C(["omnipad-trackpad omnipad-prevent", o(r)]),
581
+ layout: o(n).layout,
582
+ label: o(n).label,
583
+ "is-active": o(p)?.isPressed,
584
+ onPointerdown: y,
585
+ onPointermove: a,
586
+ onPointerup: b,
587
+ onPointercancel: P,
588
+ onLostpointercapture: P
575
589
  }, {
576
- base: _(($) => [
577
- b(c.$slots, "base", I(N($)), void 0, !0)
590
+ base: $((R) => [
591
+ g(l.$slots, "base", N(x(R)), void 0, !0)
578
592
  ]),
579
- default: _(($) => [
580
- b(c.$slots, "default", I(N($)), void 0, !0)
593
+ default: $((R) => [
594
+ g(l.$slots, "default", N(x(R)), void 0, !0)
581
595
  ]),
582
596
  _: 3
583
- }, 8, ["id", "layout", "label", "is-active"]));
597
+ }, 8, ["id", "class", "layout", "label", "is-active"]));
584
598
  }
585
- }), et = /* @__PURE__ */ U(He, [["__scopeId", "data-v-d23c7e6d"]]), tt = /* @__PURE__ */ x({
599
+ }), tt = /* @__PURE__ */ O(et, [["__scopeId", "data-v-09cbc089"]]), ot = /* @__PURE__ */ E({
586
600
  __name: "VirtualJoystick",
587
601
  props: {
588
602
  treeNode: {},
@@ -595,83 +609,87 @@ const Ee = ["id"], Se = /* @__PURE__ */ x({
595
609
  mapping: {},
596
610
  layout: {}
597
611
  },
598
- setup(e, { expose: i }) {
599
- const d = e, t = {
612
+ setup(e, { expose: s }) {
613
+ const u = e, t = {
600
614
  label: "PUSH",
601
615
  threshold: 0.2,
602
616
  cursorMode: !1,
603
617
  cursorSensitivity: 1
604
- }, { uid: o, config: a } = F(C.JOYSTICK, d, t), { core: n, state: l, elementRef: P, domEvents: u } = Z(
605
- () => new ve(o.value, a.value)
606
- ), f = j(), v = O({ x: 0, y: 0 }), c = te(() => {
607
- const r = n.value?.rect;
608
- r && (v.value = { x: r.width / 2, y: r.height / 2 });
618
+ }, { uid: n, config: r, customClasses: p } = Y(
619
+ D.JOYSTICK,
620
+ u,
621
+ t
622
+ ), { core: i, state: d, elementRef: y, domEvents: a } = F(
623
+ () => new pe(n.value, r.value)
624
+ ), b = q(), P = V({ x: 0, y: 0 }), l = oe(() => {
625
+ const c = i.value?.rect;
626
+ c && (P.value = { x: c.width / 2, y: c.height / 2 });
609
627
  });
610
- f && c();
611
- const g = (r) => u.value?.onPointerDown(r), $ = (r) => u.value?.onPointerMove(r), R = (r) => u.value?.onPointerUp(r), m = (r) => u.value?.onPointerCancel(r);
612
- return i({
613
- uid: o,
614
- onPointerDown: g,
615
- onPointerMove: $,
616
- onPointerUp: R,
628
+ b && l();
629
+ 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);
630
+ return s({
631
+ uid: n,
632
+ onPointerDown: h,
633
+ onPointerMove: R,
634
+ onPointerUp: k,
617
635
  onPointerCancel: m
618
- }), (r, A) => (h(), M(ie, {
636
+ }), (c, S) => (w(), L(ie, {
619
637
  ref_key: "elementRef",
620
- ref: P,
621
- class: "omnipad-joystick omnipad-prevent",
622
- layout: s(a).layout,
623
- "is-active": s(l)?.isActive,
624
- vector: s(l)?.vector,
638
+ ref: y,
639
+ class: C(["omnipad-joystick omnipad-prevent", o(p)]),
640
+ layout: o(r).layout,
641
+ "is-active": o(d)?.isActive,
642
+ vector: o(d)?.vector,
625
643
  "show-stick": "",
626
- "base-radius": v.value,
627
- onPointerdown: g,
628
- onPointermove: $,
629
- onPointerup: R,
644
+ "base-radius": P.value,
645
+ onPointerdown: h,
646
+ onPointermove: R,
647
+ onPointerup: k,
630
648
  onPointercancel: m,
631
649
  onLostpointercapture: m
632
650
  }, {
633
- base: _((y) => [
634
- b(r.$slots, "base", I(N(y)), void 0, !0)
651
+ base: $((f) => [
652
+ g(c.$slots, "base", N(x(f)), void 0, !0)
635
653
  ]),
636
- stick: _(() => [
637
- W(X, {
654
+ stick: $(() => [
655
+ J(G, {
638
656
  layout: { height: "100%", width: "100%" },
639
- "is-active": s(l)?.isPressed,
640
- label: s(a).label
657
+ "is-active": o(d)?.isPressed,
658
+ label: o(r).label
641
659
  }, {
642
- base: _((y) => [
643
- b(r.$slots, "stick-base", I(N(y)), void 0, !0)
660
+ base: $((f) => [
661
+ g(c.$slots, "stick-base", N(x(f)), void 0, !0)
644
662
  ]),
645
- default: _((y) => [
646
- b(r.$slots, "stick", I(N(y)), void 0, !0)
663
+ default: $((f) => [
664
+ g(c.$slots, "stick", N(x(f)), void 0, !0)
647
665
  ]),
648
666
  _: 3
649
667
  }, 8, ["is-active", "label"])
650
668
  ]),
651
- default: _((y) => [
652
- b(r.$slots, "default", I(N(y)), void 0, !0)
669
+ default: $((f) => [
670
+ g(c.$slots, "default", N(x(f)), void 0, !0)
653
671
  ]),
654
672
  _: 3
655
- }, 8, ["layout", "is-active", "vector", "base-radius"]));
673
+ }, 8, ["class", "layout", "is-active", "vector", "base-radius"]));
656
674
  }
657
- }), ot = /* @__PURE__ */ U(tt, [["__scopeId", "data-v-fb7cd5c1"]]);
658
- L(C.BUTTON, je);
659
- L(C.INPUT_ZONE, Ue);
660
- L(C.ROOT_LAYER, Ve);
661
- L(C.TARGET_ZONE, Fe);
662
- L(C.TRACKPAD, et);
663
- L(C.D_PAD, Ge);
664
- L(C.JOYSTICK, ot);
675
+ }), nt = /* @__PURE__ */ O(ot, [["__scopeId", "data-v-00e7d4c0"]]);
676
+ Z(D.BUTTON, qe);
677
+ Z(D.INPUT_ZONE, Be);
678
+ Z(D.ROOT_LAYER, Me);
679
+ Z(D.TARGET_ZONE, Ye);
680
+ Z(D.TRACKPAD, tt);
681
+ Z(D.D_PAD, He);
682
+ Z(D.JOYSTICK, nt);
665
683
  export {
666
- Ue as InputZone,
667
- Ve as RootLayer,
668
- Fe as TargetZone,
669
- je as VirtualButton,
670
- Ge as VirtualDPad,
671
- ot as VirtualJoystick,
672
- et as VirtualTrackpad,
673
- oe as getComponent,
674
- ee as getComponentSafe,
675
- at as hasRegisteredComponent,
676
- L as registerComponent
684
+ Be as InputZone,
685
+ Me as RootLayer,
686
+ Ye as TargetZone,
687
+ qe as VirtualButton,
688
+ He as VirtualDPad,
689
+ nt as VirtualJoystick,
690
+ tt as VirtualTrackpad,
691
+ ne as getComponent,
692
+ te as getComponentSafe,
693
+ rt as hasRegisteredComponent,
694
+ Z as registerComponent
677
695
  };
@@ -1 +1 @@
1
- (function(b,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):(b=typeof globalThis<"u"?globalThis:b||self,m(b.OmnipadVue={},b.OmniPadCore,b.Vue,b.OmniPadCoreUtils))})(this,(function(b,m,e,_){"use strict";const D={};function B(t,i){D[t]=i}function x(t){const i=D[t];return i||e.defineComponent({render:()=>e.h("div",{style:"color:red"},`[Unknown: ${t}]`)})}function A(t){return!t||!D[t]?null:D[t]}function K(t){return t?!!D[t]:!1}function N(t,i={},p){const o=t(),n=e.shallowRef(),a=e.ref(),r=e.ref(null),l=e.ref({}),g=y=>{a.value=y},d=y=>{if(!n.value)return;const u=n.value;typeof u.bindDelegate=="function"&&Object.entries(y).forEach(([c,h])=>{u.bindDelegate(c,h)})};return e.onMounted(()=>{n.value=o,m.Registry.getInstance().register(o),"subscribe"in o&&o.subscribe(g),p&&d(p);let y=null;if(r.value&&(r.value instanceof Element?y=r.value:r.value.$el instanceof Element&&(y=r.value.$el)),y&&"bindRectProvider"in o&&o.bindRectProvider(()=>y.getBoundingClientRect()),"onPointerDown"in o){const u=_.createPointerBridge(o,i);l.value={...u}}}),e.onUnmounted(()=>{n.value&&n.value.destroy()}),{core:n,state:a,elementRef:r,domEvents:l,bindDelegates:d}}const j={class:"omnipad-virtual-layer-base omnipad-prevent"},J=e.defineComponent({__name:"VirtualLayerBase",props:{nodes:{}},setup(t){const i=t,p=e.computed(()=>(i.nodes||[]).map(o=>{let n=A(o.type);return!n&&o.config?.baseType&&(n=A(o.config.baseType)),n||(n=x(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(p.value,a=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.component),{key:a.node.uid,"tree-node":a.node},null,8,["tree-node"]))),128)),e.renderSlot(o.$slots,"default",{},void 0,!0)]))}}),R=(t,i)=>{const p=t.__vccOpts||t;for(const[o,n]of i)p[o]=n;return p},z=R(J,[["__scopeId","data-v-d67cc501"]]);function T(t,i,p={}){const o=i.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 a=e.inject(m.CONTEXT.PARENT_ID_KEY,e.ref(void 0)),r=e.computed(()=>i.parentId||n?.config?.parentId||a.value),l=e.computed(()=>i.widgetId||n?.uid||_.generateUID(t));e.provide(m.CONTEXT.PARENT_ID_KEY,l);const g=e.computed(()=>{const d=n?.config||{},y=Object.fromEntries(Object.entries(i).filter(([u,c])=>c!==void 0&&u!=="treeNode"&&u!=="widgetId"));return{...p,...d,...y,id:l.value,baseType:t,parentId:r.value,layout:{...p.layout||{},...d.layout||{},...y.layout||{}}}});return{uid:l,config:g}}const W=["id"],M=R(e.defineComponent({__name:"InputZone",props:{treeNode:{},widgetId:{},layout:{},preventFocusLoss:{}},setup(t){const i=t,p=e.useSlots(),o=e.ref(null),{uid:n,config:a}=T(m.CMP_TYPES.INPUT_ZONE,i),{core:r,state:l,elementRef:g,domEvents:d,bindDelegates:y}=N(()=>new m.InputZoneCore(n.value,a.value),{requireDirectHit:!0}),u=e.computed(()=>{const f=i.treeNode?.config?.dynamicWidgetId;return i.treeNode?.children?.filter($=>$.uid!==f)||[]}),c=e.computed(()=>{const $=(p.dynamicWidget?.()||[]).filter(V=>!(V.type===Comment||V.type===Text)),S=i.treeNode?.children?.find(V=>V.uid===i.treeNode?.config?.dynamicWidgetId),v=$.length>0;return $.length>1&&console.error(`[OmniPad-Validation] InputZone ${n.value} has multiple dynamic widgets in slot. Only the first one will be activated.`),v&&S&&console.warn(`[OmniPad-Validation] InputZone ${n.value} has both Slot and Config dynamic widgets. Config ignored.`),{nodeToRender:v?$[0]:S||null,isFromSlot:v}}),h=e.computed(()=>{const f=c.value.nodeToRender;return x(f.config?.baseType||f.type)});e.watch(o,f=>{e.nextTick(()=>{f&&f?.uid&&(r.value?.updateConfig({dynamicWidgetId:f.uid}),y({dynamicWidgetPointerDown:f.onPointerDown,dynamicWidgetPointerMove:f.onPointerMove,dynamicWidgetPointerUp:f.onPointerUp,dynamicWidgetPointerCancel:f.onPointerCancel}))})},{immediate:!0});const k=e.computed(()=>_.resolveLayoutStyle(a.value.layout)),w=_.supportsContainerQueries(),P=e.computed(()=>{if(!l.value)return{display:"none"};if(!l.value?.isDynamicActive)return{visibility:"hidden",opacity:0};let f,$;const S=l?.value?.dynamicPosition;if(w)f=`${S.x}cqw`,$=`${S.y}cqh`;else{const v=r?.value?.rect;f=`${_.remap(S?.x||0,0,100,0,v?.width||0)}px`,$=`${_.remap(S?.y||0,0,100,0,v?.height||0)}px`}return{zIndex:100,"--dynamic-widget-mount-x":f,"--dynamic-widget-mount-y":$,visibility:"visible",opacity:1,pointerEvents:"auto"}}),s=f=>d.value?.onPointerDown(f),E=f=>d.value?.onPointerMove(f),C=f=>d.value?.onPointerUp(f),q=f=>d.value?.onPointerCancel(f);return(f,$)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(n),ref_key:"elementRef",ref:g,class:"omnipad-input-zone omnipad-prevent",style:e.normalizeStyle(k.value)},[e.createVNode(z,{nodes:u.value},{default:e.withCtx(()=>[e.renderSlot(f.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"]),c.value.nodeToRender||e.unref(r)?.isInterceptorRequired?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-input-zone-trigger omnipad-prevent",onPointerdown:s,onPointermove:E,onPointerup:C,onPointercancel:q,onLostpointercapture:q},[e.createElementVNode("div",{class:"dynamic-widget-mount",style:e.normalizeStyle(P.value)},[c.value.isFromSlot?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(c.value.nodeToRender),{key:0,ref:S=>o.value=S},null,512)):c.value.nodeToRender?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(h.value),{key:1,ref:S=>o.value=S,"tree-node":c.value.nodeToRender},null,8,["tree-node"])):e.createCommentVNode("",!0)],4)],32)):e.createCommentVNode("",!0)],12,W))}}),[["__scopeId","data-v-020d0ab6"]]),X=["id"],U=R(e.defineComponent({__name:"RootLayer",props:{treeNode:{},widgetId:{},layout:{}},setup(t){const i=t,{uid:p,config:o}=T(m.CMP_TYPES.ROOT_LAYER,i),{elementRef:n}=N(()=>new m.RootLayerCore(p.value,o.value)),a=e.computed(()=>_.resolveLayoutStyle(o.value.layout));return(r,l)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(p),ref_key:"elementRef",ref:n,class:"omnipad-root-layer omnipad-prevent",style:e.normalizeStyle(a.value)},[e.createVNode(z,{nodes:t.treeNode?.children||[]},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"])],12,X))}}),[["__scopeId","data-v-c836f838"]]),G=["id"],H={key:0,class:"omnipad-default-focus-border-feedback"},O=R(e.defineComponent({__name:"TargetZone",props:{treeNode:{},widgetId:{},cursorEnabled:{type:Boolean},cursorAutoDelay:{},layout:{}},setup(t){const i=t,p={cursorAutoDelay:2500},{uid:o,config:n}=T(m.CMP_TYPES.TARGET_ZONE,i,p),{core:a,state:r,elementRef:l,domEvents:g}=N(()=>new m.TargetZoneCore(o.value,n.value),{},{dispatchKeyboardEvent:_.dispatchKeyboardEvent,dispatchPointerEventAtPos:_.dispatchPointerEventAtPos,reclaimFocusAtPos:_.reclaimFocusAtPos}),d=e.computed(()=>_.resolveLayoutStyle(n.value.layout)),y=_.supportsContainerQueries(),u=e.computed(()=>{if(!r.value)return{display:"none"};let P,s;const E=r?.value?.position;if(y)P=`${E.x}cqw`,s=`${E.y}cqh`;else{const C=a?.value?.rect;P=`${_.remap(E?.x||0,0,100,0,C?.width||0)}px`,s=`${_.remap(E?.y||0,0,100,0,C?.height||0)}px`}return{"--omnipad-virtual-cursor-x":P,"--omnipad-virtual-cursor-y":s,opacity:r.value.isVisible?1:0}}),c=P=>g.value?.onPointerDown(P),h=P=>g.value?.onPointerMove(P),k=P=>g.value?.onPointerUp(P),w=P=>g.value?.onPointerCancel(P);return(P,s)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(o),ref_key:"elementRef",ref:l,class:"omnipad-target-zone omnipad-prevent",style:e.normalizeStyle(d.value),onPointerdown:c,onPointermove:h,onPointerup:k,onPointercancel:w,onLostpointercapture:w},[e.renderSlot(P.$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",H)):e.createCommentVNode("",!0)]),_:1})],!0),e.unref(n).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-virtual-cursor",style:e.normalizeStyle(u.value)},[e.renderSlot(P.$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(u.value)},[e.renderSlot(P.$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(P.$slots,"default",{state:e.unref(r),isDown:e.unref(r)?.isPointerDown,isReturning:e.unref(r)?.isFocusReturning,cursorPos:e.unref(r)?.position},void 0,!0)],44,G))}}),[["__scopeId","data-v-f072b1fb"]]),ee={class:"omnipad-button-content-layer"},te={key:0,class:"omnipad-default-button-label"},I=R(e.defineComponent({__name:"VirtualButtonBase",props:{layout:{},isActive:{type:Boolean},label:{}},setup(t){const i=t,p=e.computed(()=>i.layout?_.resolveLayoutStyle(i.layout):{});return(o,n)=>(e.openBlock(),e.createElementBlock("div",{class:"omnipad-button-base omnipad-prevent",style:e.normalizeStyle(p.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",ee,[e.renderSlot(o.$slots,"default",{isActive:t.isActive,label:t.label},()=>[t.label?(e.openBlock(),e.createElementBlock("span",te,e.toDisplayString(t.label),1)):e.createCommentVNode("",!0)],!0)])],4))}}),[["__scopeId","data-v-f6a6e082"]]),Y=e.defineComponent({__name:"VirtualButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:i}){const p=t,o={label:"BTN"},{uid:n,config:a}=T(m.CMP_TYPES.BUTTON,p,o),{state:r,elementRef:l,domEvents:g}=N(()=>new m.ButtonCore(n.value,a.value)),d=h=>g.value?.onPointerDown(h),y=h=>g.value?.onPointerMove(h),u=h=>g.value?.onPointerUp(h),c=h=>g.value?.onPointerCancel(h);return i({uid:n,onPointerDown:d,onPointerMove:y,onPointerUp:u,onPointerCancel:c}),(h,k)=>(e.openBlock(),e.createBlock(I,{id:e.unref(n),ref_key:"elementRef",ref:l,class:"omnipad-button omnipad-prevent",layout:e.unref(a).layout,label:e.unref(a).label,"is-active":e.unref(r)?.isPressed,onPointerdown:d,onPointerup:u,onPointercancel:c,onLostpointercapture:c},{base:e.withCtx(w=>[e.renderSlot(h.$slots,"base",e.normalizeProps(e.guardReactiveProps(w)))]),default:e.withCtx(w=>[e.renderSlot(h.$slots,"default",e.normalizeProps(e.guardReactiveProps(w)))]),_:3},8,["id","layout","label","is-active"]))}}),oe={class:"omnipad-axis-bg"},ne={class:"omnipad-axis-content-layer"},L=R(e.defineComponent({__name:"VirtualAxisBase",props:{layout:{},isActive:{type:Boolean},vector:{},showStick:{type:Boolean},baseRadius:{}},setup(t){const i=t,p=e.computed(()=>i.layout?_.resolveLayoutStyle(i.layout):{}),o=_.supportsContainerQueries(),n=e.computed(()=>{const a=i.vector?.x||0,r=i.vector?.y||0,l=i.baseRadius?.x||0,g=i.baseRadius?.y||0,d=o?`${a*50}cqw`:`${a*l}px`,y=o?`${r*50}cqh`:`${r*g}px`,u=o?"100cqw":`${l*2}px`,c=o?"100cqh":`${g*2}px`;return{"--omnipad-axis-stick-container-x":d,"--omnipad-axis-stick-container-y":y,"--omnipad-axis-stick-width":u,"--omnipad-axis-stick-height":c,transition:i.isActive?"none":"transform 0.1s ease-out"}});return(a,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["omnipad-axis-base omnipad-prevent",{"is-active":t.isActive}]),style:e.normalizeStyle(p.value),tabindex:"-1"},[e.createElementVNode("div",oe,[e.renderSlot(a.$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(a.$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",ne,[e.renderSlot(a.$slots,"default",{isActive:t.isActive,vector:t.vector},void 0,!0)])],6))}}),[["__scopeId","data-v-95bb429e"]]),re={class:"omnipad-dpad-cross-bg"},Z=R(e.defineComponent({__name:"VirtualDPad",props:{treeNode:{},widgetId:{},targetStageId:{},mapping:{},threshold:{},showStick:{},layout:{}},setup(t,{expose:i}){const p=t,o={showStick:!1,threshold:.3},{uid:n,config:a}=T(m.CMP_TYPES.D_PAD,p,o),{core:r,state:l,elementRef:g,domEvents:d}=N(()=>new m.DPadCore(n.value,a.value)),y=_.supportsContainerQueries(),u=e.ref({x:0,y:0}),c=e.watchEffect(()=>{const s=r.value?.rect;s&&(u.value={x:s.width/2,y:s.height/2})});y&&c();const h=s=>d.value?.onPointerDown(s),k=s=>d.value?.onPointerMove(s),w=s=>d.value?.onPointerUp(s),P=s=>d.value?.onPointerCancel(s);return i({uid:n,onPointerDown:h,onPointerMove:k,onPointerUp:w,onPointerCancel:P}),(s,E)=>(e.openBlock(),e.createBlock(L,{ref_key:"elementRef",ref:g,class:"omnipad-dpad omnipad-prevent",layout:e.unref(a).layout,"is-active":e.unref(l)?.isActive,vector:e.unref(l)?.vector,"show-stick":e.unref(a).showStick,"base-radius":u.value,onPointerdown:h,onPointermove:k,onPointerup:w,onPointercancel:P,onLostpointercapture:P},{base:e.withCtx(C=>[e.renderSlot(s.$slots,"base",e.normalizeProps(e.guardReactiveProps(C)),()=>[e.createElementVNode("div",re,[e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm top",{on:C.vector&&C.vector.y<-e.unref(a).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm bottom",{on:C.vector&&C.vector.y>e.unref(a).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm left",{on:C.vector&&C.vector.x<-e.unref(a).threshold}])},null,2),e.createElementVNode("div",{class:e.normalizeClass(["dpad-arm right",{on:C.vector&&C.vector.x>e.unref(a).threshold}])},null,2),E[0]||(E[0]=e.createElementVNode("div",{class:"dpad-center"},null,-1))])],!0)]),stick:e.withCtx(C=>[e.renderSlot(s.$slots,"stick",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),default:e.withCtx(C=>[e.renderSlot(s.$slots,"default",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),_:3},8,["layout","is-active","vector","show-stick","base-radius"]))}}),[["__scopeId","data-v-d141d62c"]]),F=R(e.defineComponent({__name:"VirtualTrackpad",props:{treeNode:{},widgetId:{},label:{},sensitivity:{},targetStageId:{},mapping:{},layout:{}},setup(t,{expose:i}){const p=t,{uid:o,config:n}=T(m.CMP_TYPES.TRACKPAD,p,{label:"TRACKPAD",sensitivity:1}),{state:a,elementRef:r,domEvents:l}=N(()=>new m.TrackpadCore(o.value,n.value)),g=c=>l.value?.onPointerDown(c),d=c=>l.value?.onPointerMove(c),y=c=>l.value?.onPointerUp(c),u=c=>l.value?.onPointerCancel(c);return i({uid:o,onPointerDown:g,onPointerMove:d,onPointerUp:y,onPointerCancel:u}),(c,h)=>(e.openBlock(),e.createBlock(I,{id:e.unref(o),ref_key:"elementRef",ref:r,class:"omnipad-trackpad omnipad-prevent",layout:e.unref(n).layout,label:e.unref(n).label,"is-active":e.unref(a)?.isPressed,onPointerdown:g,onPointermove:d,onPointerup:y,onPointercancel:u,onLostpointercapture:u},{base:e.withCtx(k=>[e.renderSlot(c.$slots,"base",e.normalizeProps(e.guardReactiveProps(k)),void 0,!0)]),default:e.withCtx(k=>[e.renderSlot(c.$slots,"default",e.normalizeProps(e.guardReactiveProps(k)),void 0,!0)]),_:3},8,["id","layout","label","is-active"]))}}),[["__scopeId","data-v-d23c7e6d"]]),Q=R(e.defineComponent({__name:"VirtualJoystick",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},threshold:{},cursorMode:{},cursorSensitivity:{},mapping:{},layout:{}},setup(t,{expose:i}){const p=t,o={label:"PUSH",threshold:.2,cursorMode:!1,cursorSensitivity:1},{uid:n,config:a}=T(m.CMP_TYPES.JOYSTICK,p,o),{core:r,state:l,elementRef:g,domEvents:d}=N(()=>new m.JoystickCore(n.value,a.value)),y=_.supportsContainerQueries(),u=e.ref({x:0,y:0}),c=e.watchEffect(()=>{const s=r.value?.rect;s&&(u.value={x:s.width/2,y:s.height/2})});y&&c();const h=s=>d.value?.onPointerDown(s),k=s=>d.value?.onPointerMove(s),w=s=>d.value?.onPointerUp(s),P=s=>d.value?.onPointerCancel(s);return i({uid:n,onPointerDown:h,onPointerMove:k,onPointerUp:w,onPointerCancel:P}),(s,E)=>(e.openBlock(),e.createBlock(L,{ref_key:"elementRef",ref:g,class:"omnipad-joystick omnipad-prevent",layout:e.unref(a).layout,"is-active":e.unref(l)?.isActive,vector:e.unref(l)?.vector,"show-stick":"","base-radius":u.value,onPointerdown:h,onPointermove:k,onPointerup:w,onPointercancel:P,onLostpointercapture:P},{base:e.withCtx(C=>[e.renderSlot(s.$slots,"base",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),stick:e.withCtx(()=>[e.createVNode(I,{layout:{height:"100%",width:"100%"},"is-active":e.unref(l)?.isPressed,label:e.unref(a).label},{base:e.withCtx(C=>[e.renderSlot(s.$slots,"stick-base",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),default:e.withCtx(C=>[e.renderSlot(s.$slots,"stick",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),_:3},8,["is-active","label"])]),default:e.withCtx(C=>[e.renderSlot(s.$slots,"default",e.normalizeProps(e.guardReactiveProps(C)),void 0,!0)]),_:3},8,["layout","is-active","vector","base-radius"]))}}),[["__scopeId","data-v-fb7cd5c1"]]);B(m.CMP_TYPES.BUTTON,Y),B(m.CMP_TYPES.INPUT_ZONE,M),B(m.CMP_TYPES.ROOT_LAYER,U),B(m.CMP_TYPES.TARGET_ZONE,O),B(m.CMP_TYPES.TRACKPAD,F),B(m.CMP_TYPES.D_PAD,Z),B(m.CMP_TYPES.JOYSTICK,Q),b.InputZone=M,b.RootLayer=U,b.TargetZone=O,b.VirtualButton=Y,b.VirtualDPad=Z,b.VirtualJoystick=Q,b.VirtualTrackpad=F,b.getComponent=x,b.getComponentSafe=A,b.hasRegisteredComponent=K,b.registerComponent=B,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})}));
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"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omnipad/vue",
3
- "version": "0.3.0",
3
+ "version": "0.4.1",
4
4
  "description": "",
5
5
  "main": "./dist/omnipad-vue.umd.js",
6
6
  "module": "./dist/omnipad-vue.mjs",
@@ -26,8 +26,11 @@
26
26
  "vite-plugin-dts": "^4.5.4",
27
27
  "vue": "^3.5.27"
28
28
  },
29
+ "peerDependencies": {
30
+ "vue": "^3.2.0"
31
+ },
29
32
  "dependencies": {
30
- "@omnipad/core": "0.3.0"
33
+ "@omnipad/core": "0.4.1"
31
34
  },
32
35
  "publishConfig": {
33
36
  "access": "public",