var __decorate=this&&this.__decorate||function(t,e,i,o){var s,n=arguments.length,c=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)c=Reflect.decorate(t,e,i,o);else for(var h=t.length-1;h>=0;h--)(s=t[h])&&(c=(n<3?s(c):n>3?s(e,i,c):s(e,i))||c);return n>3&&c&&Object.defineProperty(e,i,c),c};import{LitElement as t,html as e,css as i}from"lit";import{customElement as o,property as s}from"lit/decorators.js";import{Utilities as n}from"../utils";import{input as c}from"./flow-editor";let SelectionBox=class extends t{constructor(){super(...arguments),this.distanceTreshold=20,this.isSelecting=!1,this.selectionStartPosition={x:0,y:0},this.selectionBox={x:0,y:0,width:0,height:0},this.workspaceMouseDown=t=>{1===t.buttons&&(this.selectionBox.x=t.offsetX,this.selectionBox.y=t.offsetY,this.selectionStartPosition.x=this.selectionBox.x,this.selectionStartPosition.y=this.selectionBox.y,window.addEventListener("mousemove",this.mouseMove))},this.mouseMove=t=>{let e=t.pageX-this.workspace.clientRect.left-this.selectionStartPosition.x,i=t.pageY-this.workspace.clientRect.top-this.selectionStartPosition.y;e<0?(this.selectionBox.x=t.pageX-this.workspace.clientRect.left,this.selectionBox.width=Math.abs(this.selectionBox.x-this.selectionStartPosition.x)):(this.selectionBox.x=this.selectionStartPosition.x,this.selectionBox.width=Math.abs(e)),i<0?(this.selectionBox.y=t.pageY-this.workspace.clientRect.top,this.selectionBox.height=Math.abs(this.selectionBox.y-this.selectionStartPosition.y)):(this.selectionBox.y=this.selectionStartPosition.y,this.selectionBox.height=Math.abs(i)),this.selectionBox.width+this.selectionBox.height>this.distanceTreshold&&(this.isSelecting=!0),this.requestUpdate()},this.workspaceMouseUp=()=>{window.removeEventListener("mousemove",this.mouseMove),this.isSelecting&&(this.selectInBounds(),this.isSelecting=!1)}}static get styles(){return i`
        svg{
            fill: none;  
            overflow: visible;
            position: absolute;
            pointer-events: all;
            stroke-linejoin: round;
            transition: stroke-width 120ms;
            z-index: 1000;
            width: 100vw;
            height: 100vh;
        }
        rect{
            fill: var(--highlight-faded);
            outline: solid 1px var(--highlight);
        }`}firstUpdated(){this.workspace.addEventListener("mousedown",this.workspaceMouseDown),window.addEventListener("mouseup",this.workspaceMouseUp)}render(){return this.isSelecting?e`<svg><rect x="${this.selectionBox.x}px" y="${this.selectionBox.y}px" width="${this.selectionBox.width}px" height="${this.selectionBox.height}px"></rect></svg>`:e``}selectInBounds(){c.clearSelection();let t={x:this.selectionBox.x+this.workspace.clientRect.left,y:this.selectionBox.y+this.workspace.clientRect.top,width:this.selectionBox.width,height:this.selectionBox.height};for(let e of c.selectables){let i=e.handle.getBoundingClientRect();n.isBoxInsideBox({x:i.left,y:i.top,width:i.width,height:i.height},t)&&c.select(e,!0)}}};__decorate([s({attribute:!1})],SelectionBox.prototype,"workspace",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"isSelecting",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"selectionStartPosition",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"selectionBox",void 0),SelectionBox=__decorate([o("selection-box")],SelectionBox);export{SelectionBox};