var __decorate=this&&this.__decorate||function(e,t,i,o){var n,s=arguments.length,r=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,o);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(r=(s<3?n(r):s>3?n(t,i,r):n(t,i))||r);return s>3&&r&&Object.defineProperty(t,i,r),r},__awaiter=this&&this.__awaiter||function(e,t,i,o){return new(i||(i=Promise))(function(n,s){function r(e){try{d(o.next(e))}catch(e){s(e)}}function a(e){try{d(o.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?n(e.value):((t=e.value)instanceof i?t:new i(function(e){e(t)})).then(r,a)}d((o=o.apply(e,t||[])).next())})};import{css as e,html as t}from"lit";import{customElement as i,property as o}from"lit/decorators.js";import{IdentityDomLink as n}from"../node-structure";import{FlowNodeStyle as s}from"../styles/flow-node-style";import{i18next as r}from"@openremote/or-translate";import{nodeConverter as a}from"../converters/node-converter";import{SelectableElement as d}from"./selectable-element";import{newIds as l,project as h}from"./flow-editor";let FlowNode=class extends d{constructor(){super(),this.frozen=!1,this.minimal=!1,this.isBeingDragged=!1,this.forceUpdate=()=>{this.requestUpdate()},this.setTranslate=()=>{let e=this.workspace.worldToOffset(this.node.position);this.style.transform=`translate(${e.x}px, ${e.y}px) scale(${this.workspace.camera.zoom})`,this.dispatchEvent(new CustomEvent("updated"))},this.startDrag=e=>{this.frozen||1===e.buttons&&(h.createUndoSnapshot(),this.bringToFront(),window.addEventListener("mouseup",this.stopDrag),window.addEventListener("mousemove",this.onDrag),this.isBeingDragged=!0)},this.onDrag=e=>{this.node.position={x:this.node.position.x+e.movementX/this.workspace.camera.zoom,y:this.node.position.y+e.movementY/this.workspace.camera.zoom},this.setTranslate()},this.stopDrag=()=>{window.removeEventListener("mouseup",this.stopDrag),window.removeEventListener("mousemove",this.onDrag),this.isBeingDragged=!1,h.notifyChange()},this.linkIdentity=()=>{n.map[this.node.id]=this}}static get styles(){return[s,e`
            .internal-item {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                flex: 0 0 auto;
            }
            .internal-title {
                font-size: 0.8em;
                margin-bottom: 0;
                margin-top:3px;
                text-align: left;
            }
        `]}disconnectedCallback(){this.workspace.removeEventListener("pan",this.setTranslate),this.workspace.removeEventListener("zoom",this.setTranslate),h.removeListener("cleared",this.forceUpdate),h.removeListener("connectionremoved",this.linkIdentity),super.disconnectedCallback()}bringToFront(){this.frozen||(this.style.zIndex=`${this.workspace.topNodeZindex++}`)}firstUpdated(){let e=Object.create(null,{firstUpdated:{get:()=>super.firstUpdated}});return __awaiter(this,void 0,void 0,function*(){if(e.firstUpdated.call(this),this.linkIdentity(),this.workspace.addEventListener("pan",this.setTranslate),this.workspace.addEventListener("zoom",this.setTranslate),h.addListener("cleared",this.forceUpdate),h.addListener("connectionremoved",this.linkIdentity),this.minimal=0!==(this.node.displayCharacter||"").length,this.bringToFront(),l.has(this.node.id)){yield this.updateComplete,yield this.updateComplete;let e=this.getBoundingClientRect();this.node.position.x-=e.width/2/this.workspace.camera.zoom,this.node.position.y-=e.height/2/this.workspace.camera.zoom,this.setTranslate(),l.delete(this.node.id)}this.minimal&&this.addEventListener("mousedown",this.startDrag)})}updated(){return __awaiter(this,void 0,void 0,function*(){this.linkIdentity(),this.dispatchEvent(new CustomEvent("updated"))})}render(){this.minimal?this.style.background=`var(--${this.node.type.toLowerCase()}-color)`:this.style.background="",this.setTranslate(),this.style.boxShadow=this.selected?"var(--highlight) 0 0 0 3px":"";let e=this.minimal?t`<div class="title minimal" ?singlechar="${1===this.node.displayCharacter.length}">${r.t("flow."+this.node.displayCharacter,this.node.displayCharacter)}</div>`:t`<div class="title ${this.node.type.toLowerCase()}" @mousedown="${this.startDrag}">${r.t("flow."+this.node.name)||"invalid"}</div>`,i=t`<div class="socket-side inputs">${this.node.inputs.map(e=>t`<flow-node-socket ?renderlabel="${!this.minimal}" .socket="${e}" side="input"></flow-node-socket>`)}</div>`,o=t`<div class="socket-side outputs">${this.node.outputs.map(e=>t`<flow-node-socket ?renderlabel="${!this.minimal}" .socket="${e}" side="output"></flow-node-socket>`)}</div>`,n=t`<div style="width: 10px"></div>`;return t`
        ${e}
        ${this.node.inputs.length>0?i:n}
        ${this.minimal?null:t`
            <div class="internal-container" style="padding-top: 8px">
            ${this.node.internals.reduce((e,t,i,o)=>(e[e.length-1].push(t),"NEW_LINE"===t.breakType&&i<o.length-1&&e.push([]),e),[[]]).map(e=>t`
            <div class="internal-group" style="max-width: fit-content; min-width: fit-content; padding-bottom: 8px;">
                ${e.map(e=>t`
                    <div class="internal-item" style="display: inline-block">
                        <internal-picker style="pointer-events: ${this.frozen?"none":"normal"};" @picked="${()=>__awaiter(this,void 0,void 0,function*(){this.forceUpdate(),yield this.updateComplete,h.removeInvalidConnections()})}" .node="${this.node}" .internalIndex="${this.node.internals.indexOf(e)}"></internal-picker>
                    </div>
                `)}
            </div>
        `)}
        </div>`}
        ${this.node.outputs.length>0?o:n}
        ${this.frozen?t`<or-icon class="lock-icon ${this.node.type.toLowerCase()}" icon="lock"></or-icon>`:""}
        `}};__decorate([o({converter:a})],FlowNode.prototype,"node",void 0),__decorate([o({attribute:!1})],FlowNode.prototype,"workspace",void 0),__decorate([o({type:Boolean,reflect:!0})],FlowNode.prototype,"frozen",void 0),__decorate([o({type:Boolean,reflect:!0})],FlowNode.prototype,"minimal",void 0),__decorate([o({attribute:!1})],FlowNode.prototype,"isBeingDragged",void 0),FlowNode=__decorate([i("flow-node")],FlowNode);export{FlowNode};