@omnipad/vue 0.1.1-alpha.0 → 0.2.0-alpha.2

package/dist/omnipad-vue.umd.js

@@ -1 +1 @@
-(function(m,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(m=typeof globalThis<"u"?globalThis:m||self,n(m.OmnipadVue={},m.Vue))})(this,(function(m,n){"use strict";var G=Object.defineProperty,j=(e,t,o)=>t in e?G(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,y=(e,t,o)=>j(e,typeof t!="symbol"?t+"":t,o),h={INPUT_ZONE:"input-zone",TARGET_ZONE:"target-zone",KEYBOARD_BUTTON:"keyboard-button",ROOT_LAYER:"root-layer"},p={KEYDOWN:"keydown",KEYUP:"keyup",POINTER:"pointer",POINTERMOVE:"pointermove",POINTERDOWN:"pointerdown",POINTERUP:"pointerup",MOUSE:"mouse",MOUSEMOVE:"mousemove",MOUSEDOWN:"mousedown",MOUSEUP:"mouseup",CLICK:"click"},B={PARENT_ID_KEY:"omnipad-parent-id-link"},U=(e,t=2)=>{const o=Math.pow(10,t);return Math.round(e*o)/o},T=(e,t)=>U(e*t/100),$=(e,t)=>t===0?0:U(e*100/t),x=(e,t)=>{let o=document.elementFromPoint(e,t);for(;o&&o.shadowRoot;){const i=o.shadowRoot.elementFromPoint(e,t);if(!i||i===o)break;o=i}return o},M=()=>{let e=document.activeElement;for(;e&&e.shadowRoot&&e.shadowRoot.activeElement;)e=e.shadowRoot.activeElement;return e},X=e=>{M()!==e&&(e.hasAttribute("tabindex")||e.setAttribute("tabindex","-1"),e.focus())},H=(e,t)=>{const o=new KeyboardEvent(e,{...t,which:t.keyCode,bubbles:!0,cancelable:!0,view:window});window.dispatchEvent(o)},q=(e,t,o,i={})=>{const r=x(t,o);if(!r)return;const s={bubbles:!0,cancelable:!0,composed:!0,clientX:t,clientY:o,view:window,...i};if(e.startsWith("pointer")){r.dispatchEvent(new PointerEvent(e,{isPrimary:!0,pointerId:1,pointerType:"mouse",...s}));const a=e.replace("pointer","mouse");r.dispatchEvent(new MouseEvent(a,s))}else r.dispatchEvent(new MouseEvent(e,s))},J=(e="omnipad")=>{const t=Date.now().toString(36),o=Math.random().toString(36).substring(2,6);return`${e}-${t}-${o}`},N=e=>{if(!e)return{};const t={};t.position="absolute",["left","top","right","bottom","width","height"].forEach(r=>{const s=e[r];s!==void 0&&(t[r]=typeof s=="number"?`${s}px`:s)}),e.zIndex!==void 0&&(t.zIndex=e.zIndex);const i={"top-left":"translate(0, 0)","top-center":"translate(-50%, 0)","top-right":"translate(-100%, 0)","center-left":"translate(0, -50%)",center:"translate(-50%, -50%)","center-right":"translate(-100%, -50%)","bottom-left":"translate(0, -100%)","bottom-center":"translate(-50%, -100%)","bottom-right":"translate(-100%, -100%)"};return e.anchor&&(t.transform=i[e.anchor]),t},Q=class{constructor(){y(this,"listeners",new Set)}subscribe(e){return this.listeners.add(e),()=>this.listeners.delete(e)}emit(e){this.listeners.forEach(t=>{try{t(e)}catch(o){console.error("[OmniPad-Core] Emitter callback error:",o)}})}clear(){this.listeners.clear()}},b=class{constructor(e,t,o,i){y(this,"uid"),y(this,"type"),y(this,"config"),y(this,"state"),y(this,"rect",null),y(this,"stateEmitter",new Q),this.uid=e,this.type=t,this.config=o,this.state=i}subscribe(e){return e(this.state),this.stateEmitter.subscribe(e)}setState(e){this.state={...this.state,...e},this.stateEmitter.emit(this.state)}destroy(){this.reset(),this.stateEmitter.clear(),k.getInstance().unregister(this.uid)}updateRect(e){this.rect=e}updateConfig(e){this.config={...this.config,...e},this.stateEmitter.emit(this.state)}getState(){return this.state}getConfig(){return this.config}},C=Symbol.for("omnipad.registry.instance"),k=class W{constructor(){y(this,"entities",new Map)}static getInstance(){const t=globalThis;return t[C]||(t[C]=new W),t[C]}register(t){if(!t.uid){console.warn("[OmniPad-Core] Registry: Attempted to register entity without UID.",t);return}this.entities.has(t.uid),this.entities.set(t.uid,t)}unregister(t){this.entities.has(t)&&this.entities.delete(t)}getEntity(t){return this.entities.get(t)}getAllEntities(){return Array.from(this.entities.values())}getEntitiesByRoot(t){const o=this.getAllEntities();if(!t)return o;if(!this.entities.get(t))return console.warn(`[OmniPad-Core] Registry: Root entity ${t} not found.`),[];const r=new Map;o.forEach(l=>{if(l instanceof b){const d=l.getConfig();d.parentId&&(r.has(d.parentId)||r.set(d.parentId,[]),r.get(d.parentId).push(l))}});const s=[],a=[t],c=new Set;for(;a.length>0;){const l=a.shift();if(c.has(l))continue;c.add(l);const d=this.entities.get(l);if(d){s.push(d);const u=r.get(l);u&&u.forEach(g=>a.push(g.uid))}}return s}destroyByRoot(t){const o=this.getEntitiesByRoot(t);for(let i=o.length-1;i>=0;i--){const r=o[i];try{r.destroy()}catch(s){console.error(`[OmniPad-Core] Error during destroyByRoot at ${r.uid}:`,s)}}}clear(){this.entities.clear()}resetAll(){this.entities.forEach(t=>{"reset"in t&&t.reset()})}debugGetSnapshot(){return new Map(this.entities)}},ee={isDynamicActive:!1,dynamicPointerId:null,dynamicPosition:{x:0,y:0}},te=class extends b{constructor(e,t){super(e,h.INPUT_ZONE,t,ee)}onPointerDown(e){if(this.state.isDynamicActive||e.target!==e.currentTarget)return;e.cancelable&&e.preventDefault();const t=this.calculateRelativePosition(e.clientX,e.clientY);this.setState({isDynamicActive:!0,dynamicPointerId:e.pointerId,dynamicPosition:t})}onPointerMove(e){!this.state.isDynamicActive||(e.pointerId,this.state.dynamicPointerId)}onPointerUp(e){this.handleRelease(e)}onPointerCancel(e){this.handleRelease(e)}handleRelease(e){if(e.pointerId===this.state.dynamicPointerId){try{e.currentTarget.releasePointerCapture(e.pointerId)}catch{}this.setState({isDynamicActive:!1,dynamicPointerId:null})}}calculateRelativePosition(e,t){return this.rect?{x:$(e-this.rect.left,this.rect.width),y:$(t-this.rect.top,this.rect.height)}:{x:0,y:0}}get isInterceptorRequired(){return!!(this.config.dynamicWidgetId||this.config.preventFocusLoss)}reset(){this.setState({isDynamicActive:!1,dynamicPointerId:null})}},A={isActive:!1,isPressed:!1,pointerId:null,value:0},ne=class extends b{constructor(e,t){super(e,h.KEYBOARD_BUTTON,t,A)}onPointerDown(e){e.cancelable&&e.preventDefault(),e.target.setPointerCapture(e.pointerId),this.setState({isActive:!0,isPressed:!0,pointerId:e.pointerId}),this.sendInputSignal(p.KEYDOWN)}onPointerUp(e){e.cancelable&&e.preventDefault(),this.handleRelease(e)}onPointerCancel(e){this.handleRelease(e)}onPointerMove(e){e.cancelable&&e.preventDefault()}handleRelease(e){this.state.pointerId===e.pointerId&&(e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId),this.setState(A),this.sendInputSignal(p.KEYUP))}sendInputSignal(e){const t=this.config.targetStageId;if(!t)return;const o=k.getInstance().getEntity(t);if(o&&typeof o.handleSignal=="function"){const i={targetStageId:t,type:e,payload:{key:this.config.mapping.key,code:this.config.mapping.code,keyCode:this.config.mapping.keyCode}};o.handleSignal(i)}}reset(){this.state.isPressed&&this.sendInputSignal(p.KEYUP),this.setState(A)}},oe={isHighlighted:!1},ie=class extends b{constructor(e,t){super(e,h.ROOT_LAYER,t,oe)}reset(){}},re={position:{x:50,y:50},isVisible:!1,isPointerDown:!1,isFocusReturning:!1},se=class extends b{constructor(e,t){super(e,h.TARGET_ZONE,t,re),y(this,"hideTimer",null),y(this,"focusFeedbackTimer",null)}handleSignal(e){const{type:t,payload:o}=e;switch(this.ensureFocus(),t){case p.KEYDOWN:case p.KEYUP:H(t,o);break;case p.MOUSEMOVE:o.point&&(this.updateCursorPosition(o.point),this.config.cursorEnabled&&this.showCursor(),this.executeMouseAction(p.POINTERMOVE,o));break;case p.MOUSEDOWN:case p.MOUSEUP:case p.CLICK:this.config.cursorEnabled&&this.showCursor(),this.executeMouseAction(t.startsWith(p.MOUSE)?t.replace(p.MOUSE,p.POINTER):t,o);break}}executeMouseAction(e,t){if(!this.rect)return;e===p.POINTERDOWN&&this.setState({isPointerDown:!0}),e===p.POINTERUP&&this.setState({isPointerDown:!1});const o=t.point||this.state.position,i=this.rect.left+T(o.x,this.rect.width),r=this.rect.top+T(o.y,this.rect.height);q(e,i,r,{button:t.button??0,buttons:this.state.isPointerDown?1:0})}ensureFocus(){if(!this.rect)return;const e=this.rect.left+T(this.state.position.x,this.rect.width),t=this.rect.top+T(this.state.position.y,this.rect.height),o=x(e,t);o&&M()!==o&&(X(o),this.triggerFocusFeedback())}triggerFocusFeedback(){this.setState({isFocusReturning:!0}),this.focusFeedbackTimer&&clearTimeout(this.focusFeedbackTimer),this.focusFeedbackTimer=setTimeout(()=>this.setState({isFocusReturning:!1}),500)}updateCursorPosition(e){this.setState({position:{...e}})}showCursor(){this.setState({isVisible:!0}),this.hideTimer&&clearTimeout(this.hideTimer),this.config.cursorAutoDelay&&this.config.cursorAutoDelay>0&&(this.hideTimer=setTimeout(()=>this.setState({isVisible:!1}),this.config.cursorAutoDelay))}reset(){this.state.isPointerDown&&this.executeMouseAction(p.POINTERUP,{}),this.hideTimer&&clearTimeout(this.hideTimer),this.focusFeedbackTimer&&clearTimeout(this.focusFeedbackTimer),this.setState({isVisible:!1,isPointerDown:!1,isFocusReturning:!1})}};const V={};function I(e,t){V[e]=t}function F(e){const t=V[e];return t||n.defineComponent({render:()=>n.h("div",{style:"color:red"},`[Unknown: ${e}]`)})}function v(e){const t=n.shallowRef(),o=n.ref(),i=n.ref(null),r=a=>{o.value=a};let s=null;return n.onMounted(()=>{const a=e();t.value=a,k.getInstance().register(a),"subscribe"in a&&a.subscribe(r);let c=null;i.value&&(i.value instanceof Element?c=i.value:i.value.$el instanceof Element&&(c=i.value.$el)),c&&"updateRect"in a&&(s=new ResizeObserver(l=>{for(const d of l)a.updateRect(d.target.getBoundingClientRect())}),s.observe(c),a.updateRect(c.getBoundingClientRect()))}),n.onUnmounted(()=>{s&&s.disconnect(),t.value&&t.value.destroy()}),{core:t,state:o,elementRef:i}}const ae={class:"omnipad-virtual-layer-base omnipad-prevent"},ce=n.defineComponent({__name:"VirtualLayerBase",props:{nodes:{}},setup(e){return(t,o)=>(n.openBlock(),n.createElementBlock("div",ae,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(e.nodes||[],i=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(n.unref(F)(i.type)),{key:i.uid,"tree-node":i},null,8,["tree-node"]))),128)),n.renderSlot(t.$slots,"default",{},void 0,!0)]))}}),_=(e,t)=>{const o=e.__vccOpts||e;for(const[i,r]of t)o[i]=r;return o},L=_(ce,[["__scopeId","data-v-6f1860f6"]]);function R(e,t,o={}){const i=t.treeNode,r=i&&i.type===e?i:void 0;i&&i.type!==e&&console.warn(`[OmniPad-Validation] Type mismatch! Component expected "${e}", but received "${i.type}". Config ignored.`);const s=n.inject(B.PARENT_ID_KEY,n.ref(void 0)),a=n.computed(()=>t.parentId||r?.config?.parentId||s.value),c=n.computed(()=>t.widgetId||r?.uid||J(e));n.provide(B.PARENT_ID_KEY,c);const l=n.computed(()=>{const d=r?.config||{},u=Object.fromEntries(Object.entries(t).filter(([g,w])=>w!==void 0&&g!=="treeNode"&&g!=="widgetId"));return{...o,...d,...u,id:c.value,type:e,parentId:a.value,layout:{...o.layout||{},...d.layout||{},...u.layout||{}}}});return{uid:c,config:l}}const le=["id"],Y=_(n.defineComponent({__name:"InputZone",props:{treeNode:{},widgetId:{},layout:{},preventFocusLoss:{}},setup(e){const t=e,o=n.useSlots(),i=n.ref(null),{uid:r,config:s}=R(h.INPUT_ZONE,t),{core:a,state:c,elementRef:l}=v(()=>new te(r.value,s.value)),d=n.computed(()=>{const f=t.treeNode?.config?.dynamicWidgetId;return t.treeNode?.children?.filter(E=>E.uid!==f)||[]}),u=n.computed(()=>{const E=(o.dynamicWidget?.()||[]).filter(O=>!(O.type===Comment||O.type===Text)),P=t.treeNode?.children?.find(O=>O.uid===t.treeNode?.config?.dynamicWidgetId),D=E.length>0;return E.length>1&&console.error(`[OmniPad-Validation] InputZone ${r.value} has multiple dynamic widgets in slot. Only the first one will be activated.`),D&&P&&console.warn(`[OmniPad-Validation] InputZone ${r.value} has both Slot and Config dynamic widgets. Config ignored.`),{nodeToRender:D?E[0]:P||null,isFromSlot:D}});n.watch(i,f=>{n.nextTick(()=>{f&&f?.uid&&a.value?.updateConfig({dynamicWidgetId:f.uid})})},{immediate:!0});const g=n.computed(()=>N(s.value.layout)),w=n.computed(()=>c.value?.isDynamicActive?{position:"absolute",left:`${c.value.dynamicPosition.x}%`,top:`${c.value.dynamicPosition.y}%`,zIndex:100,pointerEvents:"auto"}:{display:"none"}),he=f=>{a.value&&(a.value.onPointerDown(f),c.value?.isDynamicActive&&i.value&&typeof i.value.onPointerDown=="function"&&i.value.onPointerDown(f))},me=f=>{a.value&&(a.value.onPointerMove(f),c.value?.isDynamicActive&&i.value&&typeof i.value.onPointerMove=="function"&&i.value.onPointerMove(f))},S=f=>{c.value?.isDynamicActive&&i.value&&typeof i.value.onPointerUp=="function"&&i.value.onPointerUp(f),a.value&&a.value.onPointerUp(f)};return(f,E)=>(n.openBlock(),n.createElementBlock("div",{id:n.unref(r),ref_key:"elementRef",ref:l,class:"omnipad-input-zone omnipad-prevent",style:n.normalizeStyle(g.value)},[n.createVNode(L,{nodes:d.value},{default:n.withCtx(()=>[n.renderSlot(f.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"]),n.unref(a)?.isInterceptorRequired?(n.openBlock(),n.createElementBlock("div",{key:0,class:"omnipad-input-zone-trigger",onPointerdown:he,onPointermove:me,onPointerup:S,onPointercancel:S,onLostpointercapture:S,onPointerleave:S},[n.createElementVNode("div",{class:"dynamic-widget-mount",style:n.normalizeStyle(w.value)},[u.value.isFromSlot?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(u.value.nodeToRender),{key:0,ref:P=>i.value=P},null,512)):u.value.nodeToRender?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(n.unref(F)(u.value.nodeToRender.type)),{key:1,ref:P=>i.value=P,"tree-node":u.value.nodeToRender},null,8,["tree-node"])):n.createCommentVNode("",!0)],4)],32)):n.createCommentVNode("",!0)],12,le))}}),[["__scopeId","data-v-02669919"]]),de=["id"],K=_(n.defineComponent({__name:"RootLayer",props:{treeNode:{},widgetId:{}},setup(e){const t=e,{uid:o,config:i}=R(h.ROOT_LAYER,t),{elementRef:r}=v(()=>new ie(o.value,i.value));return(s,a)=>(n.openBlock(),n.createElementBlock("div",{id:n.unref(o),ref_key:"elementRef",ref:r,class:"omnipad-virtual-layer"},[n.createVNode(L,{nodes:e.treeNode?.children||[]},{default:n.withCtx(()=>[n.renderSlot(s.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"])],8,de))}}),[["__scopeId","data-v-a509fd6e"]]),ue=["id"],z=_(n.defineComponent({__name:"TargetZone",props:{treeNode:{},widgetId:{},cursorEnabled:{type:Boolean},cursorAutoDelay:{},layout:{}},setup(e){const t=e,o={cursorAutoDelay:2500},{uid:i,config:r}=R(h.TARGET_ZONE,t,o),{state:s,elementRef:a}=v(()=>new se(i.value,r.value)),c=n.computed(()=>N(r.value.layout)),l=n.computed(()=>s.value?{left:`${s.value.position.x}%`,top:`${s.value.position.y}%`,opacity:s.value.isVisible?1:0}:{display:"none"});return(d,u)=>(n.openBlock(),n.createElementBlock("div",{id:n.unref(i),ref_key:"elementRef",ref:a,class:"omnipad-target-zone",style:n.normalizeStyle(c.value)},[n.createVNode(n.Transition,{name:"pulse"},{default:n.withCtx(()=>[n.unref(s)?.isFocusReturning?(n.openBlock(),n.createElementBlock("div",{key:0,class:"focus-feedback-ring",style:n.normalizeStyle({left:`${n.unref(s).position.x}%`,top:`${n.unref(s).position.y}%`})},null,4)):n.createCommentVNode("",!0)]),_:1}),n.unref(r).cursorEnabled?(n.openBlock(),n.createElementBlock("div",{key:0,class:"omnipad-virtual-cursor",style:n.normalizeStyle(l.value)},[n.createElementVNode("div",{class:n.normalizeClass(["cursor-dot",{"is-down":n.unref(s)?.isPointerDown}])},null,2)],4)):n.createCommentVNode("",!0)],12,ue))}}),[["__scopeId","data-v-b9d49b97"]]),fe={key:0,class:"omnipad-button-label"},pe=_(n.defineComponent({__name:"VirtualButtonBase",props:{layout:{},isActive:{type:Boolean},label:{}},setup(e){const t=e,o=n.computed(()=>t.layout?N(t.layout):{});return(i,r)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["omnipad-button-base",{"omnipad-is-active":e.isActive}]),style:n.normalizeStyle(o.value),tabindex:"-1"},[n.renderSlot(i.$slots,"default",{},()=>[e.label?(n.openBlock(),n.createElementBlock("span",fe,n.toDisplayString(e.label),1)):n.createCommentVNode("",!0)],!0)],6))}}),[["__scopeId","data-v-6cbe805c"]]),Z=n.defineComponent({__name:"VirtualKeyboardButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},mapping:{},layout:{}},setup(e,{expose:t}){const o=e,i={label:"BTN"},{uid:r,config:s}=R(h.KEYBOARD_BUTTON,o,i),{core:a,state:c,elementRef:l}=v(()=>new ne(r.value,s.value)),d=g=>a.value?.onPointerDown(g),u=g=>a.value?.onPointerUp(g);return t({uid:r,onPointerDown:d,onPointerUp:u}),(g,w)=>(n.openBlock(),n.createBlock(pe,{id:n.unref(r),ref_key:"elementRef",ref:l,layout:n.unref(s).layout,label:n.unref(s).label,"is-active":n.unref(c)?.isPressed,onPointerdown:d,onPointerup:u,onPointercancel:u,onLostpointercapture:u},null,8,["id","layout","label","is-active"]))}});I(h.INPUT_ZONE,Y),I(h.ROOT_LAYER,K),I(h.TARGET_ZONE,z),I(h.KEYBOARD_BUTTON,Z),m.InputZone=Y,m.RootLayer=K,m.TargetZone=z,m.VirtualKeyboardButton=Z,m.registerComponent=I,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"})}));
+(function(y,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("@omnipad/core"),require("vue")):typeof define=="function"&&define.amd?define(["exports","@omnipad/core","vue"],l):(y=typeof globalThis<"u"?globalThis:y||self,l(y.OmnipadVue={},y.OmniPadCore,y.Vue))})(this,(function(y,l,e){"use strict";const N={};function C(r,t){N[r]=t}function v(r){const t=N[r];return t||e.defineComponent({render:()=>e.h("div",{style:"color:red"},`[Unknown: ${r}]`)})}function T(r){const t=e.shallowRef(),s=e.ref(),n=e.ref(null),i=a=>{s.value=a};return e.onMounted(()=>{const a=r();t.value=a,l.Registry.getInstance().register(a),"subscribe"in a&&a.subscribe(i);let o=null;n.value&&(n.value instanceof Element?o=n.value:n.value.$el instanceof Element&&(o=n.value.$el)),o&&"bindRectProvider"in a&&a.bindRectProvider(()=>o.getBoundingClientRect())}),e.onUnmounted(()=>{t.value&&t.value.destroy()}),{core:t,state:s,elementRef:n}}const L={class:"omnipad-virtual-layer-base omnipad-prevent"},Y=e.defineComponent({__name:"VirtualLayerBase",props:{nodes:{}},setup(r){return(t,s)=>(e.openBlock(),e.createElementBlock("div",L,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.nodes||[],n=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(v)(n.type)),{key:n.uid,"tree-node":n},null,8,["tree-node"]))),128)),e.renderSlot(t.$slots,"default",{},void 0,!0)]))}}),B=(r,t)=>{const s=r.__vccOpts||r;for(const[n,i]of t)s[n]=i;return s},I=B(Y,[["__scopeId","data-v-6f1860f6"]]);function k(r,t,s={}){const n=t.treeNode,i=n&&n.type===r?n:void 0;n&&n.type!==r&&console.warn(`[OmniPad-Validation] Type mismatch! Component expected "${r}", but received "${n.type}". Config ignored.`);const a=e.inject(l.CONTEXT.PARENT_ID_KEY,e.ref(void 0)),o=e.computed(()=>t.parentId||i?.config?.parentId||a.value),f=e.computed(()=>t.widgetId||i?.uid||l.generateUID(r));e.provide(l.CONTEXT.PARENT_ID_KEY,f);const P=e.computed(()=>{const m=i?.config||{},d=Object.fromEntries(Object.entries(t).filter(([p,c])=>c!==void 0&&p!=="treeNode"&&p!=="widgetId"));return{...s,...m,...d,id:f.value,type:r,parentId:o.value,layout:{...s.layout||{},...m.layout||{},...d.layout||{}}}});return{uid:f,config:P}}const x=["id"],$=B(e.defineComponent({__name:"InputZone",props:{treeNode:{},widgetId:{},layout:{},preventFocusLoss:{}},setup(r){const t=r,s=e.useSlots(),n=e.ref(null),{uid:i,config:a}=k(l.CMP_TYPES.INPUT_ZONE,t),{core:o,state:f,elementRef:P}=T(()=>new l.InputZoneCore(i.value,a.value)),m=e.computed(()=>{const u=t.treeNode?.config?.dynamicWidgetId;return t.treeNode?.children?.filter(b=>b.uid!==u)||[]}),d=e.computed(()=>{const b=(s.dynamicWidget?.()||[]).filter(w=>!(w.type===Comment||w.type===Text)),E=t.treeNode?.children?.find(w=>w.uid===t.treeNode?.config?.dynamicWidgetId),S=b.length>0;return b.length>1&&console.error(`[OmniPad-Validation] InputZone ${i.value} has multiple dynamic widgets in slot. Only the first one will be activated.`),S&&E&&console.warn(`[OmniPad-Validation] InputZone ${i.value} has both Slot and Config dynamic widgets. Config ignored.`),{nodeToRender:S?b[0]:E||null,isFromSlot:S}});e.watch(n,u=>{e.nextTick(()=>{u&&u?.uid&&o.value?.updateConfig({dynamicWidgetId:u.uid})})},{immediate:!0});const p=e.computed(()=>l.resolveLayoutStyle(a.value.layout)),c=e.computed(()=>f.value?.isDynamicActive?{position:"absolute",left:`${f.value.dynamicPosition.x}%`,top:`${f.value.dynamicPosition.y}%`,zIndex:100,pointerEvents:"auto"}:{display:"none"}),g=u=>{o.value&&(o.value.onPointerDown(u),f.value?.isDynamicActive&&n.value&&typeof n.value.onPointerDown=="function"&&n.value.onPointerDown(u))},_=u=>{o.value&&(o.value.onPointerMove(u),f.value?.isDynamicActive&&n.value&&typeof n.value.onPointerMove=="function"&&n.value.onPointerMove(u))},U=u=>{f.value?.isDynamicActive&&n.value&&typeof n.value.onPointerUp=="function"&&n.value.onPointerUp(u),o.value&&o.value.onPointerUp(u)},A=u=>{f.value?.isDynamicActive&&n.value&&typeof n.value.onPointerCancel=="function"&&n.value.onPointerCancel(u),o.value&&o.value.onPointerCancel(u)};return(u,b)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(i),ref_key:"elementRef",ref:P,class:"omnipad-input-zone omnipad-prevent",style:e.normalizeStyle(p.value)},[e.createVNode(I,{nodes:m.value},{default:e.withCtx(()=>[e.renderSlot(u.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"]),d.value.nodeToRender||e.unref(o)?.isInterceptorRequired?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-input-zone-trigger",onPointerdown:g,onPointermove:_,onPointerup:U,onPointercancel:A,onLostpointercapture:A},[e.createElementVNode("div",{class:"dynamic-widget-mount",style:e.normalizeStyle(c.value)},[d.value.isFromSlot?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(d.value.nodeToRender),{key:0,ref:E=>n.value=E},null,512)):d.value.nodeToRender?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(v)(d.value.nodeToRender.type)),{key:1,ref:E=>n.value=E,"tree-node":d.value.nodeToRender},null,8,["tree-node"])):e.createCommentVNode("",!0)],4)],32)):e.createCommentVNode("",!0)],12,x))}}),[["__scopeId","data-v-e0c28ebd"]]),Z=["id"],h=B(e.defineComponent({__name:"RootLayer",props:{treeNode:{},widgetId:{}},setup(r){const t=r,{uid:s,config:n}=k(l.CMP_TYPES.ROOT_LAYER,t),{elementRef:i}=T(()=>new l.RootLayerCore(s.value,n.value));return(a,o)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(s),ref_key:"elementRef",ref:i,class:"omnipad-virtual-layer"},[e.createVNode(I,{nodes:r.treeNode?.children||[]},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"default",{},void 0,!0)]),_:3},8,["nodes"])],8,Z))}}),[["__scopeId","data-v-9e46ef9c"]]),z=["id"],K={key:0,class:"omnipad-default-focus-border-feedback"},D=B(e.defineComponent({__name:"TargetZone",props:{treeNode:{},widgetId:{},cursorEnabled:{type:Boolean},cursorAutoDelay:{},layout:{}},setup(r){const t=r,s={cursorAutoDelay:2500},{uid:n,config:i}=k(l.CMP_TYPES.TARGET_ZONE,t,s),{core:a,state:o,elementRef:f}=T(()=>new l.TargetZoneCore(n.value,i.value)),P=e.computed(()=>l.resolveLayoutStyle(i.value.layout)),m=e.computed(()=>o.value?{left:`${o.value.position.x}%`,top:`${o.value.position.y}%`,opacity:o.value.isVisible?1:0}:{display:"none"}),d=_=>a.value?.onPointerDown(_),p=_=>a.value?.onPointerMove(_),c=_=>a.value?.onPointerUp(_),g=_=>a.value?.onPointerCancel(_);return(_,U)=>(e.openBlock(),e.createElementBlock("div",{id:e.unref(n),ref_key:"elementRef",ref:f,class:"omnipad-target-zone",style:e.normalizeStyle(P.value),onPointerdown:d,onPointermove:p,onPointerup:c,onPointercancel:g,onLostpointercapture:g},[e.renderSlot(_.$slots,"focus-feedback",{state:e.unref(o),isReturning:e.unref(o)?.isFocusReturning,cursorPos:e.unref(o)?.position},()=>[e.createVNode(e.Transition,{name:"omnipad-default-focus-fade"},{default:e.withCtx(()=>[e.unref(o)?.isFocusReturning?(e.openBlock(),e.createElementBlock("div",K)):e.createCommentVNode("",!0)]),_:1})],!0),e.unref(i).cursorEnabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"omnipad-virtual-cursor",style:e.normalizeStyle(m.value)},[e.renderSlot(_.$slots,"cursor",{state:e.unref(o),isDown:e.unref(o)?.isPointerDown,cursorPos:e.unref(o)?.position},()=>[e.createElementVNode("div",{class:e.normalizeClass(["omnipad-default-cursor-dot",{"is-down":e.unref(o)?.isPointerDown}])},null,2)],!0)],4)):e.createCommentVNode("",!0)],44,z))}}),[["__scopeId","data-v-70b706ac"]]),j={key:0,class:"omnipad-button-label"},R=B(e.defineComponent({__name:"VirtualButtonBase",props:{layout:{},isActive:{type:Boolean},label:{}},setup(r){const t=r,s=e.computed(()=>t.layout?l.resolveLayoutStyle(t.layout):{});return(n,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["omnipad-button-base",{"is-active":r.isActive}]),style:e.normalizeStyle(s.value),tabindex:"-1"},[e.renderSlot(n.$slots,"default",{},()=>[r.label?(e.openBlock(),e.createElementBlock("span",j,e.toDisplayString(r.label),1)):e.createCommentVNode("",!0)],!0)],6))}}),[["__scopeId","data-v-3db6d4f9"]]),M=e.defineComponent({__name:"VirtualKeyboardButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},mapping:{},layout:{}},setup(r,{expose:t}){const s=r,n={label:"BTN"},{uid:i,config:a}=k(l.CMP_TYPES.KEYBOARD_BUTTON,s,n),{core:o,state:f,elementRef:P}=T(()=>new l.KeyboardButtonCore(i.value,a.value)),m=c=>o.value?.onPointerDown(c),d=c=>o.value?.onPointerUp(c),p=c=>o.value?.onPointerCancel(c);return t({uid:i,onPointerDown:m,onPointerUp:d,onPointerCancel:p}),(c,g)=>(e.openBlock(),e.createBlock(R,{id:e.unref(i),ref_key:"elementRef",ref:P,layout:e.unref(a).layout,label:e.unref(a).label,"is-active":e.unref(f)?.isPressed,onPointerdown:m,onPointerup:d,onPointercancel:p,onLostpointercapture:p},null,8,["id","layout","label","is-active"]))}}),O=e.defineComponent({__name:"VirtualMouseButton",props:{treeNode:{},widgetId:{},label:{},targetStageId:{},button:{},fixedPoint:{},layout:{}},setup(r,{expose:t}){const s=r,n={label:"LMB",button:0},{uid:i,config:a}=k(l.CMP_TYPES.MOUSE_BUTTON,s,n),{core:o,state:f,elementRef:P}=T(()=>new l.MouseButtonCore(i.value,a.value)),m=c=>o.value?.onPointerDown(c),d=c=>o.value?.onPointerUp(c),p=c=>o.value?.onPointerCancel(c);return t({uid:i,onPointerDown:m,onPointerUp:d,onPointerCancel:p}),(c,g)=>(e.openBlock(),e.createBlock(R,{id:e.unref(i),ref_key:"elementRef",ref:P,layout:e.unref(a).layout,label:e.unref(a).label,"is-active":e.unref(f)?.isPressed,onPointerdown:m,onPointerup:d,onPointercancel:p,onLostpointercapture:p},null,8,["id","layout","label","is-active"]))}}),V=B(e.defineComponent({__name:"VirtualTrackpad",props:{treeNode:{},widgetId:{},label:{},sensitivity:{},targetStageId:{},layout:{}},setup(r,{expose:t}){const s=r,{uid:n,config:i}=k(l.CMP_TYPES.TRACKPAD,s,{label:"TRACKPAD",sensitivity:1}),{core:a,state:o,elementRef:f}=T(()=>new l.TrackpadCore(n.value,i.value)),P=c=>a.value?.onPointerDown(c),m=c=>a.value?.onPointerMove(c),d=c=>a.value?.onPointerUp(c),p=c=>a.value?.onPointerCancel(c);return t({uid:n,onPointerDown:P,onPointerMove:m,onPointerUp:d,onPointerCancel:p}),(c,g)=>(e.openBlock(),e.createBlock(R,{id:e.unref(n),ref_key:"elementRef",ref:f,class:"omnipad-trackpad",layout:e.unref(i).layout,label:e.unref(i).label,"is-active":e.unref(o)?.isPressed,onPointerdown:P,onPointermove:m,onPointerup:d,onPointercancel:p,onLostpointercapture:p},null,8,["id","layout","label","is-active"]))}}),[["__scopeId","data-v-c28e3a2e"]]);C(l.CMP_TYPES.INPUT_ZONE,$),C(l.CMP_TYPES.ROOT_LAYER,h),C(l.CMP_TYPES.TARGET_ZONE,D),C(l.CMP_TYPES.KEYBOARD_BUTTON,M),C(l.CMP_TYPES.MOUSE_BUTTON,O),C(l.CMP_TYPES.TRACKPAD,V),y.InputZone=$,y.RootLayer=h,y.TargetZone=D,y.VirtualKeyboardButton=M,y.VirtualMouseButton=O,y.VirtualTrackpad=V,y.registerComponent=C,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omnipad/vue",
-  "version": "0.1.1-alpha.0",
+  "version": "0.2.0-alpha.2",
   "description": "",
   "main": "./dist/omnipad-vue.umd.js",
   "module": "./dist/omnipad-vue.mjs",
@@ -27,7 +27,7 @@
     "vue": "^3.5.27"
   },
   "dependencies": {
-    "@omnipad/core": "0.1.1-alpha.0"
+    "@omnipad/core": "0.2.0-alpha.2"
   },
   "publishConfig": {
     "access": "public",