UNPKG

openclaw

Version:

Multi-channel AI gateway with extensible messaging integrations

1 lines • 5.14 kB
import{n as e}from"./rolldown-runtime-8BhlS34s.js";import{Ru as t}from"./control-ui-core-BncvAZjR.js";function n(){try{let e=JSON.parse(t()?.getItem(i)??`null`);if(e&&typeof e==`object`&&`x`in e&&typeof e.x==`number`&&Number.isFinite(e.x)&&`y`in e&&typeof e.y==`number`&&Number.isFinite(e.y))return{x:e.x,y:e.y}}catch{}}function r(e,t){return e.x===t?.x&&e.y===t.y&&e.width===t.width&&e.height===t.height}var i,a;function o(){return(o=e((()=>{i=`openclaw.debug-overlay.position`,a=class{constructor(e){this.element=e,this.position=n(),this.frame=0,this.resize=()=>{this.transitionFrom=void 0,this.cancelAnimation(),this.place()},this.pointerDown=e=>{let t=e.target;if(e.button!==0||!e.isPrimary||this.drag||!(t instanceof Element)||!t.closest(`.debug-overlay__header`)||t.closest(`button`))return;this.cancelAnimation();let n=this.element;n.setPointerCapture(e.pointerId),this.drag={id:e.pointerId,start:{x:e.clientX,y:e.clientY},bounds:n.getBoundingClientRect(),previous:this.position,moved:!1},n.classList.add(`debug-overlay--dragging`),e.preventDefault()},this.pointerMove=e=>{let t=this.drag;if(!t||e.pointerId!==t.id)return;let n=e.clientX-t.start.x,r=e.clientY-t.start.y;!t.moved&&Math.hypot(n,r)<3||(t.moved=!0,this.position=this.clamp({x:t.bounds.x+n,y:t.bounds.y+r}),this.place())},this.pointerUp=e=>{e.pointerId===this.drag?.id&&(this.pointerMove(e),this.drag?.moved&&this.save(),this.finishDrag())},this.pointerCancel=e=>{e.pointerId===this.drag?.id&&this.cancelDrag()},this.cancelDrag=()=>{this.drag&&(this.position=this.drag.previous,this.finishDrag(),this.place())},this.keyDown=e=>{if(!(e.target instanceof HTMLElement)||!e.target.matches(`.debug-overlay__header`)||e.altKey||e.ctrlKey||e.metaKey)return;let t=e.shiftKey?40:10,n=0,r=0;switch(e.key){case`ArrowLeft`:n=-t;break;case`ArrowRight`:n=t;break;case`ArrowUp`:r=-t;break;case`ArrowDown`:r=t;break;default:return}e.preventDefault(),this.cancelAnimation();let i=this.element.getBoundingClientRect();this.position=this.clamp({x:i.x+n,y:i.y+r}),this.place(),this.save()}}update(e){let t=this.element;this.mode&&this.mode!==e&&(this.transitionFrom??=t.getBoundingClientRect(),this.cancelAnimation()),this.mode=e,!this.frame&&(this.frame=requestAnimationFrame(()=>{if(this.frame=0,!t.isConnected)return;this.connect();let e=this.animation;if(e){let n=t.getBoundingClientRect(),i=this.measureSettled(e);r(i,this.animationTarget)||(this.cancelAnimation(),this.animate(n,i));return}this.place();let n=this.transitionFrom;this.transitionFrom=void 0,n&&this.animate(n,t.getBoundingClientRect())}))}animate(e,t){if(matchMedia(`(prefers-reduced-motion: reduce)`).matches)return;let n=e=>({left:e.x+`px`,top:e.y+`px`,width:e.width+`px`,height:e.height+`px`,right:`auto`,bottom:`auto`,maxHeight:`none`});this.animationTarget=t;let r=this.element.animate([n(e),n(t)],{duration:160,easing:`cubic-bezier(0.2, 0, 0, 1)`});this.animation=r,r.onfinish=()=>{this.animation=void 0,this.place()}}measureSettled(e){let t=e.effect instanceof KeyframeEffect?e.effect:void 0;t&&(t.target=null);try{return this.place(),this.element.getBoundingClientRect()}finally{t&&(t.target=this.element)}}connect(){let e=this.element;e.addEventListener(`pointerdown`,this.pointerDown),e.addEventListener(`pointermove`,this.pointerMove),e.addEventListener(`pointerup`,this.pointerUp),e.addEventListener(`pointercancel`,this.pointerCancel),e.addEventListener(`lostpointercapture`,this.pointerCancel),e.addEventListener(`keydown`,this.keyDown),window.addEventListener(`resize`,this.resize),window.addEventListener(`blur`,this.cancelDrag),this.observer??=new ResizeObserver(()=>{!this.animation&&!this.frame&&this.place()}),this.observer.observe(e)}clamp(e){let t=this.element;return{x:Math.max(8,Math.min(e.x,window.innerWidth-t.offsetWidth-8)),y:Math.max(8,Math.min(e.y,window.innerHeight-t.offsetHeight-8))}}place(){let e=this.element;if(!this.position){e.style.removeProperty(`left`),e.style.removeProperty(`top`),e.style.removeProperty(`right`),e.style.removeProperty(`bottom`);return}let t=this.clamp(this.position);e.style.left=t.x+`px`,e.style.top=t.y+`px`,e.style.right=`auto`,e.style.bottom=`auto`}save(){if(this.position)try{t()?.setItem(i,JSON.stringify(this.position))}catch{}}cancelAnimation(){this.animation?.cancel(),this.animation=void 0}finishDrag(){let e=this.drag;this.drag=void 0;let t=this.element;t.classList.remove(`debug-overlay--dragging`),e&&t.hasPointerCapture(e.id)&&t.releasePointerCapture(e.id)}disconnect(){cancelAnimationFrame(this.frame),this.frame=0,this.transitionFrom=void 0,this.cancelAnimation(),this.cancelDrag(),this.observer?.disconnect();let e=this.element;e?.removeEventListener(`pointerdown`,this.pointerDown),e?.removeEventListener(`pointermove`,this.pointerMove),e?.removeEventListener(`pointerup`,this.pointerUp),e?.removeEventListener(`pointercancel`,this.pointerCancel),e?.removeEventListener(`lostpointercapture`,this.pointerCancel),e?.removeEventListener(`keydown`,this.keyDown),window.removeEventListener(`resize`,this.resize),window.removeEventListener(`blur`,this.cancelDrag)}reconnect(){this.connect(),this.place()}}})))()}o();export{a as DebugOverlayLayout};