@node-projects/web-component-designer-visualization-addons 0.1.140 → 0.1.141

package/dist/blockly/BlocklyScriptEditor.js

@@ -33,7 +33,7 @@ export class BlocklyScriptEditor extends BaseCustomWebComponentConstructorAppend
         //@ts-ignore
         const theme = Blockly.Theme.defineTheme(themename, {
             //@ts-ignore
-            'base': Blockly.Themes.Classic,
+            'base': Blockly.Themes.Zelos,
             'blockStyles': {
                 "hat_blocks": {
                     "colourPrimary": "#4a148c"

package/dist/index-min.js

@@ -6,7 +6,7 @@ Blockly.Blocks.console={init:function(){this.appendDummyInput().appendField("con
 `:t==="STYLE"&&(n+=s+".style["+e+"] = "+i+`;
 `),n};Blockly.Blocks.set_state={init:function(){this.appendValueInput("OID").setCheck("String").appendField("set_state"),this.appendValueInput("VALUE").setCheck(null).appendField("with"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.set_state=function(r){let t=Blockly.JavaScript.valueToCode(r,"OID",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(r,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`await visualizationHandler.setState((${t}[0] === '.' ? relativeSignalsPath : '') + ${t}, ${s});
 `};Blockly.defineBlocksWithJsonArray([{type:"start_event",message0:"Event %1",nextStatement:null,style:"hat_blocks",args0:[{type:"field_variable",name:"EVENTVAR",variable:"event"}]}]);Blockly.JavaScript.forBlock.start_event=function(r){return Blockly.JavaScript.getVariableName(r.getField("EVENTVAR").variable.name)+` = eventData;
-`};var de=`function extractPart(obj, propertyPath) {
+`};var me=`function extractPart(obj, propertyPath) {
     let retVal = obj;
     for (let p of propertyPath.split('.')) {
         retVal = retVal?.[p];
@@ -21,16 +21,16 @@ function delay(ms) {
 }
 
 export async function run(eventData, shadowRoot, parameters, relativeSignalsPath, visualizationHandler, context) {
-`,he="}";async function X(r){let t=new Blockly.Workspace;Blockly.serialization.workspaces.load(r,t),Blockly.JavaScript.addReservedWords("eventData"),Blockly.JavaScript.addReservedWords("shadowRoot"),Blockly.JavaScript.addReservedWords("extractPart"),Blockly.JavaScript.addReservedWords("parameters"),Blockly.JavaScript.addReservedWords("relativeSignalsPath"),Blockly.JavaScript.addReservedWords("delay"),Blockly.JavaScript.addReservedWords("visualizationHandler"),Blockly.JavaScript.addReservedWords("context");let s=Blockly.JavaScript.workspaceToCode(t);return(await import(URL.createObjectURL(new Blob([de+s+he],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as me,html as ge,css as ye}from"@node-projects/base-custom-webcomponent";var C=class r extends me{static template=ge`
+`,ge="}";async function G(r){let t=new Blockly.Workspace;Blockly.serialization.workspaces.load(r,t),Blockly.JavaScript.addReservedWords("eventData"),Blockly.JavaScript.addReservedWords("shadowRoot"),Blockly.JavaScript.addReservedWords("extractPart"),Blockly.JavaScript.addReservedWords("parameters"),Blockly.JavaScript.addReservedWords("relativeSignalsPath"),Blockly.JavaScript.addReservedWords("delay"),Blockly.JavaScript.addReservedWords("visualizationHandler"),Blockly.JavaScript.addReservedWords("context");let s=Blockly.JavaScript.workspaceToCode(t);return(await import(URL.createObjectURL(new Blob([me+s+ge],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as ye,html as fe,css as ve}from"@node-projects/base-custom-webcomponent";var C=class r extends ye{static template=fe`
         <div id="blocklyDiv" style="position: absolute; width: 100%; height: 100%;"></div>
-    `;static style=ye`
+    `;static style=ve`
         :host {
             box-sizing: border-box;
             position: absolute;
             height: 100%;
             width: 100%;
             display: block;
-        }`;static is="node-projects-blockly-script-editor";blocklyDiv;workspace;static blocklyStyle1;static blocklyStyle2;resizeObserver;_toolbox;constructor(t){super(),super._restoreCachedInititalValues(),this._toolbox=t,this.blocklyDiv=this._getDomElement("blocklyDiv"),this._assignEvents(),this.createBlockly()}createBlockly(){let t="zelos",s="webui",e=Blockly.Theme.defineTheme(s,{base:Blockly.Themes.Classic,blockStyles:{hat_blocks:{colourPrimary:"#4a148c"}},categoryStyles:{start_category:{colour:"#4a148c"},system_category:{colour:"#01579b"}}});this.workspace=Blockly.inject(this.blocklyDiv,{theme:e,toolbox:this._toolbox,renderer:t,trashcan:!0,zoom:{controls:!0,wheel:!1,startScale:.7,maxScale:3,minScale:.3,scaleSpeed:1.2,pinch:!1},move:{scrollbars:{horizontal:!0,vertical:!0},drag:!0,wheel:!0},maxInstances:{start_event:1}}),r.blocklyStyle1||(r.blocklyStyle1=new CSSStyleSheet,r.blocklyStyle1.replaceSync(document.getElementById("blockly-renderer-style-"+t+"-"+s).innerText),r.blocklyStyle2=new CSSStyleSheet,r.blocklyStyle2.replaceSync(document.getElementById("blockly-common-style").innerText)),this.shadowRoot.adoptedStyleSheets=[r.blocklyStyle1,r.blocklyStyle2,r.style],new ZoomToFitControl(this.workspace).init()}ready(){Blockly.svgResize(this.workspace),this.resizeObserver=new ResizeObserver(t=>{Blockly.svgResize(this.workspace)}),this.resizeObserver.observe(this)}save(){return Blockly.serialization.workspaces.save(this.workspace)}load(t){Blockly.serialization.workspaces.load(t,this.workspace)}};customElements.define(C.is,C);import{BaseCustomWebComponentConstructorAppend as xe,html as we,css as ke}from"@node-projects/base-custom-webcomponent";import{BindingMode as Se,BindingTarget as G}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as fe,html as ve,css as be}from"@node-projects/base-custom-webcomponent";var E=class extends fe{static template=ve`
+        }`;static is="node-projects-blockly-script-editor";blocklyDiv;workspace;static blocklyStyle1;static blocklyStyle2;resizeObserver;_toolbox;constructor(t){super(),super._restoreCachedInititalValues(),this._toolbox=t,this.blocklyDiv=this._getDomElement("blocklyDiv"),this._assignEvents(),this.createBlockly()}createBlockly(){let t="zelos",s="webui",e=Blockly.Theme.defineTheme(s,{base:Blockly.Themes.Zelos,blockStyles:{hat_blocks:{colourPrimary:"#4a148c"}},categoryStyles:{start_category:{colour:"#4a148c"},system_category:{colour:"#01579b"}}});this.workspace=Blockly.inject(this.blocklyDiv,{theme:e,toolbox:this._toolbox,renderer:t,trashcan:!0,zoom:{controls:!0,wheel:!1,startScale:.7,maxScale:3,minScale:.3,scaleSpeed:1.2,pinch:!1},move:{scrollbars:{horizontal:!0,vertical:!0},drag:!0,wheel:!0},maxInstances:{start_event:1}}),r.blocklyStyle1||(r.blocklyStyle1=new CSSStyleSheet,r.blocklyStyle1.replaceSync(document.getElementById("blockly-renderer-style-"+t+"-"+s).innerText),r.blocklyStyle2=new CSSStyleSheet,r.blocklyStyle2.replaceSync(document.getElementById("blockly-common-style").innerText)),this.shadowRoot.adoptedStyleSheets=[r.blocklyStyle1,r.blocklyStyle2,r.style],new ZoomToFitControl(this.workspace).init()}ready(){Blockly.svgResize(this.workspace),this.resizeObserver=new ResizeObserver(t=>{Blockly.svgResize(this.workspace)}),this.resizeObserver.observe(this)}save(){return Blockly.serialization.workspaces.save(this.workspace)}load(t){Blockly.serialization.workspaces.load(t,this.workspace)}};customElements.define(C.is,C);import{BaseCustomWebComponentConstructorAppend as ke,html as Se,css as _e}from"@node-projects/base-custom-webcomponent";import{BindingMode as Te,BindingTarget as $}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as be,html as xe,css as we}from"@node-projects/base-custom-webcomponent";var E=class extends be{static template=xe`
         <span style="position:absolute;left:30px;top:26px;">from</span>
         <span style="position:absolute;left:30px;top:77px;">count</span>
         <span style="position:absolute;left:30px;top:123px;">limit</span>
@@ -97,10 +97,10 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         <input css:visibility="[[this.historic.aggregate == 'quantile' ? 'visible' : 'collapse']]" value="{{this.historic.quantile}}" type="number" id="quantile" style="position:absolute;left:107px;top:325px;width:153px;">
         <span css:visibility="[[this.historic.aggregate == 'quantile' ? 'visible' : 'collapse']]" id="lblQuantile" style="position:absolute;left:30px;top:325px;">quantile</span>
         <span style="position:absolute;left:34px;top:417px;">instance</span>
-        <input type="text" value="{{?this.historic.instance}}" style="position:absolute;left:104px;top:419px;width:155px;">`;static style=be`
+        <input type="text" value="{{?this.historic.instance}}" style="position:absolute;left:104px;top:419px;width:155px;">`;static style=we`
         :host {
             box-sizing: border-box;
-        }`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(t){super(),this._restoreCachedInititalValues(),this.historic=t??{reloadInterval:2e3}}ready(){this._bindingsParse()}#e=!1;refresh(){this.#e||(this.#e=!0,this._bindingsRefresh(null,!0),this.#e=!1)}};customElements.define(E.is,E);var D=class extends xe{static template=we`
+        }`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(t){super(),this._restoreCachedInititalValues(),this.historic=t??{reloadInterval:2e3}}ready(){this._bindingsParse()}#e=!1;refresh(){this.#e||(this.#e=!0,this._bindingsRefresh(null,!0),this.#e=!1)}};customElements.define(E.is,E);var D=class extends ke{static template=Se`
         <div id="root">
             <div class="vertical-grid">
                 <div style="grid-column: 1/3">
@@ -183,7 +183,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
                     </button>
                 </div>
             </div>
-        </div>`;static style=ke`
+        </div>`;static style=_e`
         :host {
             box-sizing: border-box;
         }
@@ -256,11 +256,11 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         
         node-projects-code-view-monaco[readonly] {
             border: 1px lightgray solid;
-        }`;static is="node-projects-visualization-bindings-editor";static properties={twoWayPossible:Boolean,twoWay:Boolean,expression:String,objectNames:String,events:String,invert:Boolean,converters:Array,historic:Object};twoWayPossible=!1;twoWay=!1;expression="";writeBackSignal="";expressionTwoWay="";historic;objectNames="";events="";invert=!1;converters=[];convertersString;objectValueType;_property;_binding;_bindingTarget;_serviceContainer;_instanceServiceContainer;_shell;_activeRow=-1;_objNmInput;constructor(t,s,e,i,n,l,a={namedConverters:!0}){super(),super._restoreCachedInititalValues(),this._objNmInput=this._getDomElement("objectName"),this._property=t,this._binding=s,this._bindingTarget=e,this._serviceContainer=i,this._instanceServiceContainer=n,this._shell=l,a?.namedConverters||(this._getDomElement("namedConverterInput").style.display="none")}ready(){if(this._parseAttributesToProperties(),this._assignEvents(),this.twoWayPossible=!1,(this._bindingTarget==G.property||this._bindingTarget==G.attribute)&&(this.twoWayPossible=!0),this._binding){if(this.twoWay=this._binding.mode==Se.twoWay,this.expression=this._binding.expression,this.writeBackSignal=this._binding.writeBackSignal,this.expressionTwoWay=this._binding.expressionTwoWay,this.historic=this._binding.historic,this.invert=this._binding.invert,this.objectValueType=this._binding.type,this._binding.bindableObjectNames&&(this.objectNames=this._binding.bindableObjectNames.join(";")),this._binding.converter)if(typeof this._binding.converter=="string")this.convertersString=this._binding.converter;else for(let t in this._binding.converter)this.converters.push({key:t,value:this._binding.converter[t]});this._binding.changedEvents&&this._binding.changedEvents.length&&(this.events=this._binding.changedEvents.join(";"))}if(this.expression){let t=this._getDomElement("expression");this.expression.indexOf(`
+        }`;static is="node-projects-visualization-bindings-editor";static properties={twoWayPossible:Boolean,twoWay:Boolean,expression:String,objectNames:String,events:String,invert:Boolean,converters:Array,historic:Object};twoWayPossible=!1;twoWay=!1;expression="";writeBackSignal="";expressionTwoWay="";historic;objectNames="";events="";invert=!1;converters=[];convertersString;objectValueType;_property;_binding;_bindingTarget;_serviceContainer;_instanceServiceContainer;_shell;_activeRow=-1;_objNmInput;constructor(t,s,e,i,n,l,a={namedConverters:!0}){super(),super._restoreCachedInititalValues(),this._objNmInput=this._getDomElement("objectName"),this._property=t,this._binding=s,this._bindingTarget=e,this._serviceContainer=i,this._instanceServiceContainer=n,this._shell=l,a?.namedConverters||(this._getDomElement("namedConverterInput").style.display="none")}ready(){if(this._parseAttributesToProperties(),this._assignEvents(),this.twoWayPossible=!1,(this._bindingTarget==$.property||this._bindingTarget==$.attribute)&&(this.twoWayPossible=!0),this._binding){if(this.twoWay=this._binding.mode==Te.twoWay,this.expression=this._binding.expression,this.writeBackSignal=this._binding.writeBackSignal,this.expressionTwoWay=this._binding.expressionTwoWay,this.historic=this._binding.historic,this.invert=this._binding.invert,this.objectValueType=this._binding.type,this._binding.bindableObjectNames&&(this.objectNames=this._binding.bindableObjectNames.join(";")),this._binding.converter)if(typeof this._binding.converter=="string")this.convertersString=this._binding.converter;else for(let t in this._binding.converter)this.converters.push({key:t,value:this._binding.converter[t]});this._binding.changedEvents&&this._binding.changedEvents.length&&(this.events=this._binding.changedEvents.join(";"))}if(this.expression){let t=this._getDomElement("expression");this.expression.indexOf(`
 `)>=0&&(t.style.height="51px")}if(this.expressionTwoWay){let t=this._getDomElement("expression2way");this.expressionTwoWay.indexOf(`
-`)>=0&&(t.style.height="51px")}this._bindingsParse(),this._objNmInput.focus()}_focusRow(t){this._activeRow=t,this._updatefocusedRow()}_updatefocusedRow(){let t=this._getDomElement("converterGrid");t.querySelectorAll("div").forEach(s=>s.style.background=""),this._activeRow>=0&&(t.children[this._activeRow+1].style.background="gray")}_clear(){this.objectNames="",this._bindingsRefresh()}_refresh(){requestAnimationFrame(()=>{this._bindingsRefresh()})}async _select(){let t=this._shell.createBindableObjectBrowser();t.initialize(this._serviceContainer,this._instanceServiceContainer,"binding"),t.title="select signal...";let s=new AbortController;t.objectDoubleclicked.on(()=>{s.abort(),this.objectNames!=""&&(this.objectNames+=";"),t.selectedObject.specialType=="signalProperty"?this.objectNames+="?":t.selectedObject.bindabletype==="property"&&(this.objectNames+="??"),this.objectNames+=t.selectedObject.fullName,this._bindingsRefresh()}),await this._shell.openConfirmation(t,{x:100,y:100,width:400,height:300,parent:this,abortSignal:s.signal})&&(this.objectNames!=""&&(this.objectNames+=";"),this.objectNames+=t.selectedObject.fullName,this._bindingsRefresh())}async showHistoric(){let t=new E(this.historic),s=new AbortController;t.title="Edit historic binding to: "+this._property.name,await this._shell.openConfirmation(t,{x:100,y:100,width:420,height:510,parent:this,abortSignal:s.signal,disableResize:!0,cancelText:"Remove"})?this.historic=t.historic:this.historic=null,this._bindingsRefresh()}addConverter(){this.converters.push({key:"",value:""}),this._activeRow=this.converters.length-1,this._bindingsRefresh(),this._updatefocusedRow()}removeConverter(){this.converters.splice(this._activeRow,1),this._activeRow=-1,this._bindingsRefresh(),this._updatefocusedRow()}};customElements.define(D.is,D);import{BaseCustomWebComponentConstructorAppend as Ce,css as Ee,html as Ne}from"@node-projects/base-custom-webcomponent";import{ContextMenu as q}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as $}from"@node-projects/propertygrid.webcomponent";import{defaultOptions as Ie}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as Oe}from"wunderbaum";import Be from"wunderbaum/dist/wunderbaum.css"with{type:"css"};import{PropertyGrid as _e}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as Te}from"@node-projects/web-component-designer-codeview-monaco";var W=class extends _e{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;async getEditorForType(t,s,e,i,n){if(this.getSpecialEditorForType){let l=await this.getSpecialEditorForType(t,s,e,i,n);if(l)return l}switch(t.format){case"screen":{let l=document.createElement("select");l.style.width="100%";let a=document.createElement("option");a.value=s??"",a.innerText=s??"",l.appendChild(a);for(let p of await this.visualizationHandler.getAllNames("screen")){if(p==s)continue;let o=document.createElement("option");o.value=p,o.innerText=p,l.appendChild(o)}return l.onchange=()=>{this.setPropertyValue(e,l.value)},l.value=s,l}case"signal":{let l=document.createElement("div");l.style.display="flex";let a=document.createElement("input");a.value=s??"",a.style.flexGrow="1",a.style.width="0",a.onchange=o=>this.setPropertyValue(e,a.value),a.onfocus=o=>{a.selectionStart=0,a.selectionEnd=a.value?.length},l.appendChild(a);let p=document.createElement("button");return p.textContent="...",p.onclick=async()=>{let o=this.visualizationShell.createBindableObjectBrowser();o.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),o.title="select signal...";let u=new AbortController;o.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(o.selectedObject),u.abort(),a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value)}),await this.visualizationShell.openConfirmation(o,{x:100,y:100,width:400,height:300,parent:this,abortSignal:u.signal})&&(a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value))},l.appendChild(p),l}case"html":case"script":{let l=document.createElement("div");l.style.boxSizing="border-box",l.style.width="100%",l.style.display="flex";let a=document.createElement("textarea");a.style.boxSizing="border-box",a.value=s??"",a.style.width="100%",a.onblur=o=>{this.setPropertyValue(e,a.value)},l.appendChild(a);let p=document.createElement("button");return p.innerHTML="...",p.style.boxSizing="border-box",p.onclick=async()=>{let o=new Te;if(t.format=="html")o.language="html";else{let g={content:`declare global {
+`)>=0&&(t.style.height="51px")}this._bindingsParse(),this._objNmInput.focus()}_focusRow(t){this._activeRow=t,this._updatefocusedRow()}_updatefocusedRow(){let t=this._getDomElement("converterGrid");t.querySelectorAll("div").forEach(s=>s.style.background=""),this._activeRow>=0&&(t.children[this._activeRow+1].style.background="gray")}_clear(){this.objectNames="",this._bindingsRefresh()}_refresh(){requestAnimationFrame(()=>{this._bindingsRefresh()})}async _select(){let t=this._shell.createBindableObjectBrowser();t.initialize(this._serviceContainer,this._instanceServiceContainer,"binding"),t.title="select signal...";let s=new AbortController;t.objectDoubleclicked.on(()=>{s.abort(),this.objectNames!=""&&(this.objectNames+=";"),t.selectedObject.specialType=="signalProperty"?this.objectNames+="?":t.selectedObject.bindabletype==="property"&&(this.objectNames+="??"),this.objectNames+=t.selectedObject.fullName,this._bindingsRefresh()}),await this._shell.openConfirmation(t,{x:100,y:100,width:400,height:300,parent:this,abortSignal:s.signal})&&(this.objectNames!=""&&(this.objectNames+=";"),this.objectNames+=t.selectedObject.fullName,this._bindingsRefresh())}async showHistoric(){let t=new E(this.historic),s=new AbortController;t.title="Edit historic binding to: "+this._property.name,await this._shell.openConfirmation(t,{x:100,y:100,width:420,height:510,parent:this,abortSignal:s.signal,disableResize:!0,cancelText:"Remove"})?this.historic=t.historic:this.historic=null,this._bindingsRefresh()}addConverter(){this.converters.push({key:"",value:""}),this._activeRow=this.converters.length-1,this._bindingsRefresh(),this._updatefocusedRow()}removeConverter(){this.converters.splice(this._activeRow,1),this._activeRow=-1,this._bindingsRefresh(),this._updatefocusedRow()}};customElements.define(D.is,D);import{BaseCustomWebComponentConstructorAppend as Ne,css as Ie,html as Oe}from"@node-projects/base-custom-webcomponent";import{ContextMenu as q}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as Y}from"@node-projects/propertygrid.webcomponent";import{defaultOptions as Be}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as Re}from"wunderbaum";import Ve from"wunderbaum/dist/wunderbaum.css"with{type:"css"};import{PropertyGrid as Ce}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as Ee}from"@node-projects/web-component-designer-codeview-monaco";var j=class extends Ce{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;async getEditorForType(t,s,e,i,n){if(this.getSpecialEditorForType){let l=await this.getSpecialEditorForType(t,s,e,i,n);if(l)return l}switch(t.format){case"screen":{let l=document.createElement("select");l.style.width="100%";let a=document.createElement("option");a.value=s??"",a.innerText=s??"",l.appendChild(a);for(let c of await this.visualizationHandler.getAllNames("screen")){if(c==s)continue;let o=document.createElement("option");o.value=c,o.innerText=c,l.appendChild(o)}return l.onchange=()=>{this.setPropertyValue(e,l.value)},l.value=s,l}case"signal":{let l=document.createElement("div");l.style.display="flex";let a=document.createElement("input");a.value=s??"",a.style.flexGrow="1",a.style.width="0",a.onchange=o=>this.setPropertyValue(e,a.value),a.onfocus=o=>{a.selectionStart=0,a.selectionEnd=a.value?.length},l.appendChild(a);let c=document.createElement("button");return c.textContent="...",c.onclick=async()=>{let o=this.visualizationShell.createBindableObjectBrowser();o.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),o.title="select signal...";let p=new AbortController;o.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(o.selectedObject),p.abort(),a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value)}),await this.visualizationShell.openConfirmation(o,{x:100,y:100,width:400,height:300,parent:this,abortSignal:p.signal})&&(a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value))},l.appendChild(c),l}case"html":case"script":{let l=document.createElement("div");l.style.boxSizing="border-box",l.style.width="100%",l.style.display="flex";let a=document.createElement("textarea");a.style.boxSizing="border-box",a.value=s??"",a.style.width="100%",a.onblur=o=>{this.setPropertyValue(e,a.value)},l.appendChild(a);let c=document.createElement("button");return c.innerHTML="...",c.style.boxSizing="border-box",c.onclick=async()=>{let o=new Ee;if(t.format=="html")o.language="html";else{let m={content:`declare global {
                             var context: { event: Event, element: Element };
-                        }`,filePath:"global.d.ts"};monaco.languages.typescript.typescriptDefaults.setExtraLibs([g]),o.language="javascript"}o.code=a.value,o.style.position="relative",await this.visualizationShell.openConfirmation(o,{x:200,y:200,width:600,height:400,parent:this})&&(a.value=o.getText(),this.setPropertyValue(e,a.value))},l.appendChild(p),l}}return super.getEditorForType(t,s,e,i,n)}};customElements.define("node-projects-visualization-property-grid",W);import"@node-projects/splitview.webcomponent";var N=class r{static upgradeScriptCommand(t){return t.type==="SetElementProperty"?r.upgradeSetElementProperty(t):t}static upgradeSetElementProperty(t){return t.targetSelectorTarget==="currentScreen"?t.targetSelectorTarget="container":t.targetSelectorTarget==="parentScreen"?(t.targetSelectorTarget="container",t.parentIndex=1):t.targetSelectorTarget==="currentElement"?t.targetSelectorTarget="element":t.targetSelectorTarget==="parentElement"&&(t.targetSelectorTarget="element",t.parentIndex=1),t}};var I=class r extends Ce{static style=Ee`
+                        }`,filePath:"global.d.ts"};monaco.languages.typescript.typescriptDefaults.setExtraLibs([m]),o.language="javascript"}o.code=a.value,o.style.position="relative",await this.visualizationShell.openConfirmation(o,{x:200,y:200,width:600,height:400,parent:this})&&(a.value=o.getText(),this.setPropertyValue(e,a.value))},l.appendChild(c),l}}return super.getEditorForType(t,s,e,i,n)}};customElements.define("node-projects-visualization-property-grid",j);import"@node-projects/splitview.webcomponent";var N=class r{static upgradeScriptCommand(t){return t.type==="SetElementProperty"?r.upgradeSetElementProperty(t):t}static upgradeSetElementProperty(t){return t.targetSelectorTarget==="currentScreen"?t.targetSelectorTarget="container":t.targetSelectorTarget==="parentScreen"?(t.targetSelectorTarget="container",t.parentIndex=1):t.targetSelectorTarget==="currentElement"?t.targetSelectorTarget="element":t.targetSelectorTarget==="parentElement"&&(t.targetSelectorTarget="element",t.parentIndex=1),t}};var I=class r extends Ne{static style=Ie`
         :host {
             background: white;
         }
@@ -285,7 +285,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
             width: 100%;
             height: 100%;
         }
-    `;static template=Ne`
+    `;static template=Oe`
         <div style="width:100%; height:100%; overflow: hidden;">
             <node-projects-split-view style="height: 100%; width: 100%; position: relative;" orientation="horizontal">
                 <div style="width: 40%;  position: relative;">
@@ -302,7 +302,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
                 </div>
             </node-projects-split-view>
         </div>
-    `;static is="node-projects-visualization-simple-script-editor";serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;_script;_commandListDiv;_commandListFancyTree;_possibleCommands;_propertygrid;constructor(){super(),this._restoreCachedInititalValues(),this._commandListDiv=this._getDomElement("commandList"),this._possibleCommands=this._getDomElement("possibleCommands"),this._propertygrid=this._getDomElement("propertygrid"),this.shadowRoot.adoptedStyleSheets=[Be,r.style]}async ready(){this.addPossibleCommands(),this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents();let t=async s=>{let e=new W;e.visualizationHandler=this.visualizationHandler,e.visualizationShell=this.visualizationShell,e.serviceContainer=this.serviceContainer,e.instanceServiceContainer=this.instanceServiceContainer,e.bindableObjectsTarget="script",e.getTypeInfo=(n,l)=>$(this.propertiesTypeInfo,n,l),e.showHead=!1,e.typeName="IScriptMultiplexValue",e.title='Complex for "'+s.propertyPath+'"',typeof s.value=="object"?e.selectedObject=s.value??{}:e.selectedObject={},e.bindingDoubleClicked=n=>{n.bindabletype=="property"?e.setPropertyValue("source","property"):n.bindabletype=="context"?e.setPropertyValue("source","context"):e.setPropertyValue("source","signal"),e.setPropertyValue("name",n.fullName),e.refresh()},await this.visualizationShell.openConfirmation(e,{x:100,y:100,width:400,height:500,parent:this})&&(this._propertygrid.setPropertyValue(s.propertyPath,e.selectedObject),this._propertygrid.refresh())};this._propertygrid.visualizationHandler=this.visualizationHandler,this._propertygrid.visualizationShell=this.visualizationShell,this._propertygrid.serviceContainer=this.serviceContainer,this._propertygrid.instanceServiceContainer=this.instanceServiceContainer,this._propertygrid.bindableObjectsTarget="script",this._propertygrid.getTypeInfo=(s,e)=>$(this.scriptCommandsTypeInfo,s,e),this._propertygrid.getSpecialEditorForType=async(s,e,i,n,l)=>{if(!s.specialAllreadyAdded&&(s.specialAllreadyAdded=!0,s.format!=="collection"))if(typeof e=="object"&&e!==null||s.format==="complex"){let a=document.createElement("button");a.style.height="calc(100% - 6px)",a.style.position="relative",a.style.display="flex",a.style.justifyContent="center",a.style.width="20px",a.style.boxSizing="content-box",a.innerText="del",a.onclick=()=>{this._propertygrid.setPropertyValue(i,void 0),this._propertygrid.refresh()},n.nodeElem.insertAdjacentElement("afterbegin",a);let p=document.createElement("div");p.style.display="flex";let o=document.createElement("span");e?o.innerText=(e.source??"")+": "+(e.name??""):o.innerText="",o.style.overflow="hidden",o.style.whiteSpace="nowrap",o.style.textOverflow="ellipsis",o.style.flexGrow="1",o.title=JSON.stringify(e),p.appendChild(o);let u=document.createElement("button");return u.innerText="...",u.onclick=()=>{t({value:e,propertyPath:i})},p.appendChild(u),n.nodeElem.style.display="flex",p}else{let a=document.createElement("button");a.style.height="calc(100% - 6px)",a.style.position="relative",a.style.display="flex",a.style.justifyContent="center",a.style.width="20px",a.style.boxSizing="content-box",a.title="complex property value",a.style.opacity="0.2",a.innerText="...",a.onclick=()=>{t({value:e,propertyPath:i})},n.nodeElem.insertAdjacentElement("afterbegin",a),n.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(s=>{q.show([{title:"edit complex value",action:async()=>{t(s)}},{title:"edit string",action:async()=>{let e=prompt("enter value:");e&&(this._propertygrid.setPropertyValue(s.propertyPath,e),this._propertygrid.refresh())}},{title:"remove complex value",action:async()=>{this._propertygrid.setPropertyValue(s.propertyPath,void 0),this._propertygrid.refresh()}}],s.event)})}async addPossibleCommands(){let t=Object.keys(this.scriptCommandsTypeInfo.definitions).filter(s=>this.scriptCommandsTypeInfo.definitions[s].type=="object");for(let s of t){if(s=="ScriptCommands")continue;let e=document.createElement("option");e.innerText=s,this._possibleCommands.add(e)}}loadScript(t){this._script=t;let s=[];for(let e of this._script.commands)e=N.upgradeScriptCommand(e),s.push(this.createTreeItem(e));this._commandListFancyTree=new Oe({...Ie,element:this._commandListDiv,icon:!1,source:s,activate:e=>{this._propertygrid.selectedObject=e.node.data.data.item},render:e=>{if(e.isNew){let i=e.nodeElem;i.oncontextmenu=n=>(e.node.setActive(),e.node.data.contextMenu&&e.node.data.contextMenu(n,e.node.data,e.node),n.preventDefault(),!1)}},dnd:{guessDropEffect:!0,preventRecursion:!0,preventVoidMoves:!1,serializeClipboardData:!1,dragStart:e=>(e.event.dataTransfer.effectAllowed="move",e.event.dataTransfer.dropEffect="move",!0),dragEnter:e=>(e.event.dataTransfer.dropEffect="move",!0),dragOver:e=>{e.event.dataTransfer.dropEffect="move"},drop:async e=>{e.sourceNode.moveTo(e.node,e.region=="before"?"before":"after")}}})}createTreeItem(t){return{title:t.type,data:{item:t},contextMenu:(e,i,n)=>{q.show([{title:"Remove Item",action:l=>n.remove()}],e)}}}addItem(){let s={type:this._possibleCommands.value},e=this.createTreeItem(s);this._commandListFancyTree.addChildren(e)}getScriptCommands(){return this._commandListFancyTree.root.children.map(s=>s.data.data.item)}};customElements.define(I.is,I);import{BaseCustomWebComponentConstructorAppend as Re,css as Ve,html as Ae}from"@node-projects/base-custom-webcomponent";var O=class extends Re{static style=Ve`
+    `;static is="node-projects-visualization-simple-script-editor";serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;_script;_commandListDiv;_commandListFancyTree;_possibleCommands;_propertygrid;constructor(){super(),this._restoreCachedInititalValues(),this._commandListDiv=this._getDomElement("commandList"),this._possibleCommands=this._getDomElement("possibleCommands"),this._propertygrid=this._getDomElement("propertygrid"),this.shadowRoot.adoptedStyleSheets=[Ve,r.style]}async ready(){this.addPossibleCommands(),this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents();let t=async s=>{let e=new j;e.visualizationHandler=this.visualizationHandler,e.visualizationShell=this.visualizationShell,e.serviceContainer=this.serviceContainer,e.instanceServiceContainer=this.instanceServiceContainer,e.bindableObjectsTarget="script",e.getTypeInfo=(n,l)=>Y(this.propertiesTypeInfo,n,l),e.showHead=!1,e.typeName="IScriptMultiplexValue",e.title='Complex for "'+s.propertyPath+'"',typeof s.value=="object"?e.selectedObject=s.value??{}:e.selectedObject={},e.bindingDoubleClicked=n=>{n.bindabletype=="property"?e.setPropertyValue("source","property"):n.bindabletype=="context"?e.setPropertyValue("source","context"):e.setPropertyValue("source","signal"),e.setPropertyValue("name",n.fullName),e.refresh()},await this.visualizationShell.openConfirmation(e,{x:100,y:100,width:400,height:500,parent:this})&&(this._propertygrid.setPropertyValue(s.propertyPath,e.selectedObject),this._propertygrid.refresh())};this._propertygrid.visualizationHandler=this.visualizationHandler,this._propertygrid.visualizationShell=this.visualizationShell,this._propertygrid.serviceContainer=this.serviceContainer,this._propertygrid.instanceServiceContainer=this.instanceServiceContainer,this._propertygrid.bindableObjectsTarget="script",this._propertygrid.getTypeInfo=(s,e)=>Y(this.scriptCommandsTypeInfo,s,e),this._propertygrid.getSpecialEditorForType=async(s,e,i,n,l)=>{if(!s.specialAllreadyAdded&&(s.specialAllreadyAdded=!0,s.format!=="collection"))if(typeof e=="object"&&e!==null||s.format==="complex"){let a=document.createElement("button");a.style.height="calc(100% - 6px)",a.style.position="relative",a.style.display="flex",a.style.justifyContent="center",a.style.width="20px",a.style.boxSizing="content-box",a.innerText="del",a.onclick=()=>{this._propertygrid.setPropertyValue(i,void 0),this._propertygrid.refresh()},n.nodeElem.insertAdjacentElement("afterbegin",a);let c=document.createElement("div");c.style.display="flex";let o=document.createElement("span");e?o.innerText=(e.source??"")+": "+(e.name??""):o.innerText="",o.style.overflow="hidden",o.style.whiteSpace="nowrap",o.style.textOverflow="ellipsis",o.style.flexGrow="1",o.title=JSON.stringify(e),c.appendChild(o);let p=document.createElement("button");return p.innerText="...",p.onclick=()=>{t({value:e,propertyPath:i})},c.appendChild(p),n.nodeElem.style.display="flex",c}else{let a=document.createElement("button");a.style.height="calc(100% - 6px)",a.style.position="relative",a.style.display="flex",a.style.justifyContent="center",a.style.width="20px",a.style.boxSizing="content-box",a.title="complex property value",a.style.opacity="0.2",a.innerText="...",a.onclick=()=>{t({value:e,propertyPath:i})},n.nodeElem.insertAdjacentElement("afterbegin",a),n.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(s=>{q.show([{title:"edit complex value",action:async()=>{t(s)}},{title:"edit string",action:async()=>{let e=prompt("enter value:");e&&(this._propertygrid.setPropertyValue(s.propertyPath,e),this._propertygrid.refresh())}},{title:"remove complex value",action:async()=>{this._propertygrid.setPropertyValue(s.propertyPath,void 0),this._propertygrid.refresh()}}],s.event)})}async addPossibleCommands(){let t=Object.keys(this.scriptCommandsTypeInfo.definitions).filter(s=>this.scriptCommandsTypeInfo.definitions[s].type=="object");for(let s of t){if(s=="ScriptCommands")continue;let e=document.createElement("option");e.innerText=s,this._possibleCommands.add(e)}}loadScript(t){this._script=t;let s=[];for(let e of this._script.commands)e=N.upgradeScriptCommand(e),s.push(this.createTreeItem(e));this._commandListFancyTree=new Re({...Be,element:this._commandListDiv,icon:!1,source:s,activate:e=>{this._propertygrid.selectedObject=e.node.data.data.item},render:e=>{if(e.isNew){let i=e.nodeElem;i.oncontextmenu=n=>(e.node.setActive(),e.node.data.contextMenu&&e.node.data.contextMenu(n,e.node.data,e.node),n.preventDefault(),!1)}},dnd:{guessDropEffect:!0,preventRecursion:!0,preventVoidMoves:!1,serializeClipboardData:!1,dragStart:e=>(e.event.dataTransfer.effectAllowed="move",e.event.dataTransfer.dropEffect="move",!0),dragEnter:e=>(e.event.dataTransfer.dropEffect="move",!0),dragOver:e=>{e.event.dataTransfer.dropEffect="move"},drop:async e=>{e.sourceNode.moveTo(e.node,e.region=="before"?"before":"after")}}})}createTreeItem(t){return{title:t.type,data:{item:t},contextMenu:(e,i,n)=>{q.show([{title:"Remove Item",action:l=>n.remove()}],e)}}}addItem(){let s={type:this._possibleCommands.value},e=this.createTreeItem(s);this._commandListFancyTree.addChildren(e)}getScriptCommands(){return this._commandListFancyTree.root.children.map(s=>s.data.data.item)}};customElements.define(I.is,I);import{BaseCustomWebComponentConstructorAppend as Ae,css as We,html as je}from"@node-projects/base-custom-webcomponent";var O=class extends Ae{static style=We`
         :host {
             display: grid;
             grid-template-columns: 80px 80px 80px auto;
@@ -316,7 +316,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         
         span {
             font-size: 10px;
-        }`;static template=Ae`
+        }`;static template=je`
         <span></span>
         <span>name</span>
         <span>type</span>
@@ -335,7 +335,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
             <input hidden="[[item.type !== 'boolean']]" type="checkbox" checked="{{item.value}}">
             <div hidden="[[item.type !== 'null']]">-null-</div>
         </template>
-        <button @click="[[this._add()]]" style="width: 40px; height: 20px; align-self: center;">add</button>`;static is="node-projects-visualization-parameter-editor";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_parameterArray;setParametersObject(t){t!=null?this._parameterArray=Object.keys(t).map(s=>({key:s,type:typeof t[s]=="object"?"null":typeof t[s],value:t[s]})):this._parameterArray=[],this._bindingsRefresh()}getParametersObject(){let t=!1,s={};for(let e of this._parameterArray)if(e.key)switch(t=!0,s[e.key]=null,e.type){case"string":s[e.key]=e.value.toString();break;case"number":let i=parseFloat(e.value);s[e.key]=isNaN(i)?0:i;break;case"boolean":s[e.key]=!!e.value;break}return t?s:null}_remove(t){this._parameterArray.splice(t,1),this._bindingsRefresh()}_add(){this._parameterArray.push({type:"null"}),this._bindingsRefresh()}};customElements.define(O.is,O);import{BaseCustomWebComponentConstructorAppend as je,css as We,html as Y}from"@node-projects/base-custom-webcomponent";import{ContextMenu as K,copyTextToClipboard as Q,getTextFromClipboard as Z,PropertiesHelper as ze}from"@node-projects/web-component-designer";var L=class r extends je{static style=We`
+        <button @click="[[this._add()]]" style="width: 40px; height: 20px; align-self: center;">add</button>`;static is="node-projects-visualization-parameter-editor";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_parameterArray;setParametersObject(t){t!=null?this._parameterArray=Object.keys(t).map(s=>({key:s,type:typeof t[s]=="object"?"null":typeof t[s],value:t[s]})):this._parameterArray=[],this._bindingsRefresh()}getParametersObject(){let t=!1,s={};for(let e of this._parameterArray)if(e.key)switch(t=!0,s[e.key]=null,e.type){case"string":s[e.key]=e.value.toString();break;case"number":let i=parseFloat(e.value);s[e.key]=isNaN(i)?0:i;break;case"boolean":s[e.key]=!!e.value;break}return t?s:null}_remove(t){this._parameterArray.splice(t,1),this._bindingsRefresh()}_add(){this._parameterArray.push({type:"null"}),this._bindingsRefresh()}};customElements.define(O.is,O);import{BaseCustomWebComponentConstructorAppend as ze,css as De,html as Z}from"@node-projects/base-custom-webcomponent";import{ContextMenu as K,copyTextToClipboard as Q,getTextFromClipboard as ee,PropertiesHelper as Pe}from"@node-projects/web-component-designer";var P=class r extends ze{static style=De`
         :host {
             display: grid;
             grid-template-columns: 20px 1fr auto;
@@ -369,22 +369,22 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         }
         button {
             cursor: pointer;
-        }`;static template=Y`
+        }`;static template=Z`
         <template repeat:item="[[this.events]]">
             <div @click="[[this._ctxMenu(event, item)]]" @contextmenu="[[this._ctxMenu(event, item)]]" class="rect" title="[[this._getScriptType(item)]]" css:background-color="[[this._getScriptTypeColor(item)]]"></div>
             <a @click="[[this._showContextMenuAssignScript(event, item, false)]]" @contextmenu="[[this._ctxMenu(event, item)]]" title="[[item.name]]">[[item.name]]</a>
             <div>[[this._createControlsForScript(item)]]</div>
         </template>
         <span style="grid-column: 1 / span 3; margin-top: 8px; margin-left: 3px;">add event:</span>
-        <input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=Y`
+        <input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=Z`
         <div style="display: flex; justify-content: flex-end;">
             <input value="[[this._getScriptName(item)]]" @keypress="[[this._changeScriptName(event, item)]]" hidden="[[this._getScriptType(item) !== 'js']]" placeholder="name" title="name" style="min-width: 50px; flex-basis: 30px; flex-grow: 2;" class="mth" type="text">
             <input value="[[this._getRelativeSignalsPath(item)]]" @keypress="[[this._changeRelativeSignalsPath(event, item)]]" placeholder="relative signals path" title="relative signals path" style="min-width: 50px; flex-basis: 20px; flex-grow: 1;" class="mth" type="text">
             <button css:background="[[this._hasParameters(item) ? 'lime' : '']]" style="display: flex; padding: 0; flex-grow: 0;" title="parameter" @click="[[this._editParameter(event, item)]]">p</button>
-        </div>`;static scriptTypeColors={js:"purple",blockly:"yellow",script:"lightgreen",empty:"pink"};static is="node-projects-visualization-event-assignment";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_blocklyToolbox;_instanceServiceContainer;_selectionChangedHandler;_selectedItems;_visualizationHandler;_visualizationShell;_scriptCommandsTypeInfo;_propertiesTypeInfo;events;initialize(t,s,e,i,n){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=n}set instanceServiceContainer(t){this._instanceServiceContainer=t,this._selectionChangedHandler?.dispose(),this._selectionChangedHandler=this._instanceServiceContainer.selectionService.onSelectionChanged.on(s=>{this.selectedItems=s.selectedElements}),this.selectedItems=this._instanceServiceContainer.selectionService.selectedElements}_createControlsForScript(t){switch(this._getScriptType(t)){case"none":return""}return this.constructor.editRowTemplate.content.cloneNode(!0)}_getScriptName(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"){if(s.includes("name"))return JSON.parse(s).name}else return s}return null}async _changeScriptName(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.name=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else this._selectedItems[0].setAttribute("@"+s.name,e)}}_getRelativeSignalsPath(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"&&s.includes("relativeSignalsPath"))return JSON.parse(s).relativeSignalsPath}return null}async _changeRelativeSignalsPath(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.relativeSignalsPath=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else{let n={name:i,relativeSignalsPath:e};this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}}}_hasParameters(t){return this.selectedItems[0].hasAttribute("@"+t.name)?this.selectedItems[0].getAttribute("@"+t.name).includes("parameters"):!1}_getScriptTypeColor(t){let s=this._getScriptType(t);return r.scriptTypeColors[s]??"white"}_getScriptType(t){if(this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s.startsWith("{")){let e=JSON.parse(s);return"blocks"in e?"blockly":"commands"in e?"script":"js"}else return s==""?"empty":"js"}return"none"}_getEventMethodname(t){return this.selectedItems.length?this.selectedItems[0].getAttribute("@"+t.name):""}_inputMthName(t,s){let e=t.target;this.selectedItems[0].setAttribute("@"+s.name,e.value)}_ctxMenu(t,s){t.preventDefault();let e=this._getScriptType(s);if(e=="empty")this._showContextMenuAssignScript(t,s,!0);else if(e!="none"){let i=[{title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}},{title:"-"},{title:"copy",action:()=>{Q(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Z()),this._bindingsRefresh()}}];K.show(i,t)}else this._showContextMenuAssignScript(t,s,!0)}async _addEvent(t){if(t.key=="Enter"){let s=this._getDomElement("addEventInput");this._selectedItems[0].setAttribute("@"+ze.camelToDashCase(s.value.replaceAll(" ","-")),""),s.value="",this.scrollTop=0,this.refresh()}}_createAssignScriptContextMenu(t,s){let e=[{title:"Simple Script",action:()=>{this._editEvent("script",t,s)}},{title:"Javascript",action:()=>{let n=prompt("name of function ?");n&&(this._selectedItems[0].setAttribute("@"+s.name,n),this.refresh(),this._editEvent("js",null,s))}},{title:"Blockly",action:()=>{this._editBlockly(null,s)}}],i=this._getScriptType(s);return i!="none"&&(e.push({title:"-"}),e.push({title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}})),i!="empty"&&e.push({title:"-"},{title:"copy",action:()=>{Q(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Z()),this._bindingsRefresh()}}),e}async _showContextMenuAssignScript(t,s,e){t.preventDefault();let i=this._getScriptType(s);if(i!="none"&&i!="empty"&&!e)this._editEvent(i,t,s);else{let n=this._createAssignScriptContextMenu(t,s);K.show(n,t)}}async _editParameter(t,s){let e=this.selectedItems[0],i=new O,n={};i.title="ParameterEditor for '"+s.name+"' of '"+e.name+"'";let l=e.getAttribute("@"+s.name);if(l&&l[0]=="{")try{n=JSON.parse(l).parameters}catch{}if(i.setParametersObject(n),await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let p=i.getParametersObject(),o={name:l,parameters:p};l&&l[0]=="{"&&(o=JSON.parse(l),o.parameters=p),p==null&&delete o.parameters;let u=JSON.stringify(o);e.setAttribute("@"+s.name,u),this._bindingsRefresh()}}async _editBlockly(t,s){let e=this.selectedItems[0],i=new C(this._blocklyToolbox);i.title="Blockly Script for '"+s.name+"' of '"+e.name+"'";let n=e.getAttribute("@"+s.name),l=null,a=null;if(n){let o=JSON.parse(n);l=o.parameters,a=o.relativeSignalsPath,i.load(o)}if(await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let o=i.save();l&&(o.parameters=l),a&&(o.relativeSignalsPath=a),e.setAttribute("@"+s.name,JSON.stringify(o)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=this.selectedItems[0],i=e.getAttribute("@"+s.name);if(!i||i.startsWith("{")){let n={commands:[]},l=null,a=null;i&&(n=JSON.parse(i),l=n.parameters,a=n.relativeSignalsPath);let p=new I;if(p.serviceContainer=e.serviceContainer,p.instanceServiceContainer=e.instanceServiceContainer,p.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,p.propertiesTypeInfo=this._propertiesTypeInfo,p.visualizationShell=this._visualizationShell,p.visualizationHandler=this._visualizationHandler,p.loadScript(n),p.title="Script '"+s.name+"' on "+e.name,await this._visualizationShell.openConfirmation(p,{x:100,y:100,width:600,height:500})){let u=p.getScriptCommands();if(u&&u.length){let g={commands:u};l&&(g.parameters=l),a&&(g.relativeSignalsPath=a);let d=JSON.stringify(g);e.setAttribute("@"+s.name,d),this._bindingsRefresh()}}}}async _editEvent(t,s,e){t=="js"?this._editJavascript(s,e):t=="blockly"?this._editBlockly(s,e):this._editSimpleScript(s,e)}refresh(){this._selectedItems!=null&&this._selectedItems.length?this.events=this._selectedItems[0].serviceContainer.getLastServiceWhere("eventsService",t=>t.isHandledElementFromEventsService(this._selectedItems[0])).getPossibleEvents(this._selectedItems[0]):this.events=[],this._bindingsRefresh()}get selectedItems(){return this._selectedItems}set selectedItems(t){this._selectedItems!=t&&(this._selectedItems=t,this.refresh())}};customElements.define(L.is,L);import{TypedEvent as De,cssFromString as Le}from"@node-projects/base-custom-webcomponent";import{BindingTarget as f}from"@node-projects/web-component-designer/dist/elements/item/BindingTarget.js";import{PropertiesHelper as v}from"@node-projects/web-component-designer/dist/elements/services/propertiesService/services/PropertiesHelper.js";var S="bind-prop:",B="bind-attr:",R="bind-class:",V="bind-css:",A="bind-cssvar:",w="bind-content:",F="bind-visible:",Pe="bind(",Me="--tmpBinding_",Ft=/{{(.*)}}/;function z(r){return r.constructor?.elementProperties!=null}function J(r){let t=[],s=[],e="";for(let i=0;i<r.length;i++)r[i]=="{"?(t.push(e),e=""):r[i]=="}"?(s.push(e),e=""):e+=r[i];return t.push(e),{parts:t,signals:s}}function P(r,t){let s=t.split("."),e=r;for(let i of s){if(e==null||typeof e!="object")return;e=e[i]}return e}var H=class{parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(t,s,e,i,n,l,a,p){this.visualizationHandler=s,this.valueChangedCb=i,this.element=n,this.relativeSignalPath=l,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let o=0;o<this.signals.length;o++){let u=this.signals[o];if(u[0]==="?"&&u[1]==="?"){let h=u.substring(2);if(h.includes(".")){let c=P(a,h);this.handleValueChanged(c,o)}else{this.handleValueChanged(a[h],o);let c=()=>this.handleValueChanged(a[h],o),m=t.getChangedEventName(a,h);a.addEventListener(m,c),this.cleanupCalls.push(()=>a.removeEventListener(m,c))}continue}else if(u[0]==="#"&&u[1]==="#"){let h=u.substring(2);if(h.includes(".")){let c=P(n,h);this.handleValueChanged(c,o)}else{this.handleValueChanged(n[h],o);let c=()=>this.handleValueChanged(n[h],o),m=t.getChangedEventName(n,h);n.addEventListener(m,c),this.cleanupCalls.push(()=>n.removeEventListener(m,c))}continue}else if(u[0]==="\xA7"){let h=u.substring(1),c=p.valueProvider(h,{element:n,relativeSignalPath:l,root:a});c instanceof Promise?c.then(y=>this.handleValueChanged(y,o)):this.handleValueChanged(c,o),p.valueChangedCallbacks||(p.valueChangedCallbacks=new Map);let m=p.valueChangedCallbacks.get(h);m==null&&(m=[],p.valueChangedCallbacks.set(h,m)),m.push(()=>{let y=p.valueProvider(h,{element:n,relativeSignalPath:l,root:a});y instanceof Promise?y.then(x=>this.handleValueChanged(x,o)):this.handleValueChanged(y,o)})}else(u[0]==="?"||u[0]==="#")&&(u.includes(".")?u=P(a,u.substring(1)):u=a[u.substring(1)]);let g=(h,c)=>this.handleValueChanged(c.val,o),d=this.visualizationHandler.subscribeState(u,g);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[o],g,d))}}parseIndirectBinding(t){let{parts:s,signals:e}=J(t);this.parts=s,this.signals=e;for(let i=0;i<e.length;i++)e[i][0]=="."&&(e[i]=this.visualizationHandler.getNormalizedSignalName(e[i],this.relativeSignalPath,this.element))}handleValueChanged(t,s){this.values[s]=t;let e=this.parts[0];for(let i=0;i<this.parts.length-1;i++){let n=this.values[i];if(n==null)return;e+=n+this.parts[i+1]}if(e[0]=="."&&(e=this.visualizationHandler.getNormalizedSignalName(e,this.relativeSignalPath,this.element)),this.combinedName!=e&&(this.unsubscribeTargetValue&&this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),!this.disposed)){this.combinedName=e;let i=(n,l)=>this.valueChangedCb(l);this.unsubscribeTargetValue=[i,this.visualizationHandler.subscribeState(e,i)]}}dispose(){this.disposed=!0,this.unsubscribeTargetValue&&(this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),this.unsubscribeTargetValue=null);for(let t=0;t<this.signals.length;t++)this.cleanupCalls[t]()}setState(t){this.disposed||this.visualizationHandler.setState(this.combinedName,t)}},ee=class r{_visualizationHandler;namedConverterCallback;constructor(t){this._visualizationHandler=t}getChangedEventName(t,s){let e=s.indexOf("::");return e>=0?s.substring(e+2):t instanceof HTMLInputElement||t instanceof HTMLSelectElement?"change":z(t)?v.camelToDashCase(s):v.camelToDashCase(s)+"-changed"}parseBinding(t,s,e,i,n){let l=s.substring(n.length);if(i===f.cssvar&&(l="--"+l),!e.startsWith("{")){let p={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),p.signal=e,e.includes("::")){let o=e.split("::");e=o[0],p.signal=e,p.events=o[1].split(",")}p.twoWay=!0,p.events||(t instanceof HTMLInputElement?p.events=[this.getChangedEventName(t,l)]:t instanceof HTMLSelectElement?p.events=[this.getChangedEventName(t,l)]:z(t)?p.events=[this.getChangedEventName(t,l)]:(p.events=[this.getChangedEventName(t,l)],p.maybeLitElement=!0,p.litEventNames=[this.getChangedEventName(t,l)]))}if(e[0]==="!"&&(p.signal=e.substring(1),p.inverted=!0),p.signal.includes(";")){let o=p.signal.split(";");p.expression=o.pop(),p.signal=o.join(";")}return i===f.cssvar||i===f.class?[r.dotToCamelCase(l),p]:i===f.attribute?[l,p]:[v.dashToCamelCase(l),p]}let a=JSON.parse(e);return a.target=i,a.twoWay&&(a.events==null||a.events.length==0)&&(t instanceof HTMLInputElement?a.events=["change"]:t instanceof HTMLSelectElement?a.events=["change"]:a.events=[this.getChangedEventName(t,l)]),i===f.cssvar||i===f.class?[r.dotToCamelCase(l),a]:i===f.attribute?[l,a]:[v.dashToCamelCase(l),a]}serializeBinding(t,s,e){let i={...e};delete i.type,e.twoWay?e.events!=null&&e.events.length==1&&(t instanceof HTMLInputElement&&e.events?.[0]=="change"||t instanceof HTMLSelectElement&&e.events?.[0]=="change"||z(t)&&e.events?.[0]==s||!z(t)&&e.events?.[0]==s+"-changed")&&delete i.events:(delete i.events,delete i.expressionTwoWay);let n=i.twoWay&&i.events?.length>0?"::"+i.events.join(","):"",l=!1;return(n&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(l=!0),e.signal.trim()[0]=="{"&&(l=!0),!l&&e.target==f.property&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[w+"text",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:s=="innerHTML"?[w+"html",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:[S+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.property&&e.expression&&!e.expression.includes(`
+        </div>`;static scriptTypeColors={js:"purple",blockly:"yellow",script:"lightgreen",empty:"pink"};static is="node-projects-visualization-event-assignment";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_blocklyToolbox;_instanceServiceContainer;_selectionChangedHandler;_selectedItems;_visualizationHandler;_visualizationShell;_scriptCommandsTypeInfo;_propertiesTypeInfo;events;initialize(t,s,e,i,n){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=n}set instanceServiceContainer(t){this._instanceServiceContainer=t,this._selectionChangedHandler?.dispose(),this._selectionChangedHandler=this._instanceServiceContainer.selectionService.onSelectionChanged.on(s=>{this.selectedItems=s.selectedElements}),this.selectedItems=this._instanceServiceContainer.selectionService.selectedElements}_createControlsForScript(t){switch(this._getScriptType(t)){case"none":return""}return this.constructor.editRowTemplate.content.cloneNode(!0)}_getScriptName(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"){if(s.includes("name"))return JSON.parse(s).name}else return s}return null}async _changeScriptName(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.name=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else this._selectedItems[0].setAttribute("@"+s.name,e)}}_getRelativeSignalsPath(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"&&s.includes("relativeSignalsPath"))return JSON.parse(s).relativeSignalsPath}return null}async _changeRelativeSignalsPath(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.relativeSignalsPath=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else{let n={name:i,relativeSignalsPath:e};this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}}}_hasParameters(t){return this.selectedItems[0].hasAttribute("@"+t.name)?this.selectedItems[0].getAttribute("@"+t.name).includes("parameters"):!1}_getScriptTypeColor(t){let s=this._getScriptType(t);return r.scriptTypeColors[s]??"white"}_getScriptType(t){if(this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s.startsWith("{")){let e=JSON.parse(s);return"blocks"in e?"blockly":"commands"in e?"script":"js"}else return s==""?"empty":"js"}return"none"}_getEventMethodname(t){return this.selectedItems.length?this.selectedItems[0].getAttribute("@"+t.name):""}_inputMthName(t,s){let e=t.target;this.selectedItems[0].setAttribute("@"+s.name,e.value)}_ctxMenu(t,s){t.preventDefault();let e=this._getScriptType(s);if(e=="empty")this._showContextMenuAssignScript(t,s,!0);else if(e!="none"){let i=[{title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}},{title:"-"},{title:"copy",action:()=>{Q(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await ee()),this._bindingsRefresh()}}];K.show(i,t)}else this._showContextMenuAssignScript(t,s,!0)}async _addEvent(t){if(t.key=="Enter"){let s=this._getDomElement("addEventInput");this._selectedItems[0].setAttribute("@"+Pe.camelToDashCase(s.value.replaceAll(" ","-")),""),s.value="",this.scrollTop=0,this.refresh()}}_createAssignScriptContextMenu(t,s){let e=[{title:"Simple Script",action:()=>{this._editEvent("script",t,s)}},{title:"Javascript",action:()=>{let n=prompt("name of function ?");n&&(this._selectedItems[0].setAttribute("@"+s.name,n),this.refresh(),this._editEvent("js",null,s))}},{title:"Blockly",action:()=>{this._editBlockly(null,s)}}],i=this._getScriptType(s);return i!="none"&&(e.push({title:"-"}),e.push({title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}})),i!="empty"&&e.push({title:"-"},{title:"copy",action:()=>{Q(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await ee()),this._bindingsRefresh()}}),e}async _showContextMenuAssignScript(t,s,e){t.preventDefault();let i=this._getScriptType(s);if(i!="none"&&i!="empty"&&!e)this._editEvent(i,t,s);else{let n=this._createAssignScriptContextMenu(t,s);K.show(n,t)}}async _editParameter(t,s){let e=this.selectedItems[0],i=new O,n={};i.title="ParameterEditor for '"+s.name+"' of '"+e.name+"'";let l=e.getAttribute("@"+s.name);if(l&&l[0]=="{")try{n=JSON.parse(l).parameters}catch{}if(i.setParametersObject(n),await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let c=i.getParametersObject(),o={name:l,parameters:c};l&&l[0]=="{"&&(o=JSON.parse(l),o.parameters=c),c==null&&delete o.parameters;let p=JSON.stringify(o);e.setAttribute("@"+s.name,p),this._bindingsRefresh()}}async _editBlockly(t,s){let e=this.selectedItems[0],i=new C(this._blocklyToolbox);i.title="Blockly Script for '"+s.name+"' of '"+e.name+"'";let n=e.getAttribute("@"+s.name),l=null,a=null;if(n){let o=JSON.parse(n);l=o.parameters,a=o.relativeSignalsPath,i.load(o)}if(await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let o=i.save();l&&(o.parameters=l),a&&(o.relativeSignalsPath=a),e.setAttribute("@"+s.name,JSON.stringify(o)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=this.selectedItems[0],i=e.getAttribute("@"+s.name);if(!i||i.startsWith("{")){let n={commands:[]},l=null,a=null;i&&(n=JSON.parse(i),l=n.parameters,a=n.relativeSignalsPath);let c=new I;if(c.serviceContainer=e.serviceContainer,c.instanceServiceContainer=e.instanceServiceContainer,c.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,c.propertiesTypeInfo=this._propertiesTypeInfo,c.visualizationShell=this._visualizationShell,c.visualizationHandler=this._visualizationHandler,c.loadScript(n),c.title="Script '"+s.name+"' on "+e.name,await this._visualizationShell.openConfirmation(c,{x:100,y:100,width:600,height:500})){let p=c.getScriptCommands();if(p&&p.length){let m={commands:p};l&&(m.parameters=l),a&&(m.relativeSignalsPath=a);let d=JSON.stringify(m);e.setAttribute("@"+s.name,d),this._bindingsRefresh()}}}}async _editEvent(t,s,e){t=="js"?this._editJavascript(s,e):t=="blockly"?this._editBlockly(s,e):this._editSimpleScript(s,e)}refresh(){this._selectedItems!=null&&this._selectedItems.length?this.events=this._selectedItems[0].serviceContainer.getLastServiceWhere("eventsService",t=>t.isHandledElementFromEventsService(this._selectedItems[0])).getPossibleEvents(this._selectedItems[0]):this.events=[],this._bindingsRefresh()}get selectedItems(){return this._selectedItems}set selectedItems(t){this._selectedItems!=t&&(this._selectedItems=t,this.refresh())}};customElements.define(P.is,P);import{TypedEvent as Le,cssFromString as Me}from"@node-projects/base-custom-webcomponent";import{BindingTarget as f}from"@node-projects/web-component-designer/dist/elements/item/BindingTarget.js";import{PropertiesHelper as v}from"@node-projects/web-component-designer/dist/elements/services/propertiesService/services/PropertiesHelper.js";var S="bind-prop:",B="bind-attr:",R="bind-class:",V="bind-css:",A="bind-cssvar:",w="bind-content:",F="bind-visible:",He="bind(",Fe="--tmpBinding_",Ut=/{{(.*)}}/;function z(r){return r.constructor?.elementProperties!=null}function U(r){let t=[],s=[],e="";for(let i=0;i<r.length;i++)r[i]=="{"?(t.push(e),e=""):r[i]=="}"?(s.push(e),e=""):e+=r[i];return t.push(e),{parts:t,signals:s}}function L(r,t){let s=t.split("."),e=r;for(let i of s){if(e==null||typeof e!="object")return;e=e[i]}return e}var J=class{parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(t,s,e,i,n,l,a,c){this.visualizationHandler=s,this.valueChangedCb=i,this.element=n,this.relativeSignalPath=l,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let o=0;o<this.signals.length;o++){let p=this.signals[o];if(p[0]==="?"&&p[1]==="?"){let h=p.substring(2);if(h.includes(".")){let u=L(a,h);this.handleValueChanged(u,o)}else{this.handleValueChanged(a[h],o);let u=()=>this.handleValueChanged(a[h],o),g=t.getChangedEventName(a,h);a.addEventListener(g,u),this.cleanupCalls.push(()=>a.removeEventListener(g,u))}continue}else if(p[0]==="#"&&p[1]==="#"){let h=p.substring(2);if(h.includes(".")){let u=L(n,h);this.handleValueChanged(u,o)}else{this.handleValueChanged(n[h],o);let u=()=>this.handleValueChanged(n[h],o),g=t.getChangedEventName(n,h);n.addEventListener(g,u),this.cleanupCalls.push(()=>n.removeEventListener(g,u))}continue}else if(p[0]==="\xA7"){let h=p.substring(1),u=c.valueProvider(h,{element:n,relativeSignalPath:l,root:a});u instanceof Promise?u.then(y=>this.handleValueChanged(y,o)):this.handleValueChanged(u,o),c.valueChangedCallbacks||(c.valueChangedCallbacks=new Map);let g=c.valueChangedCallbacks.get(h);g==null&&(g=[],c.valueChangedCallbacks.set(h,g)),g.push(()=>{let y=c.valueProvider(h,{element:n,relativeSignalPath:l,root:a});y instanceof Promise?y.then(x=>this.handleValueChanged(x,o)):this.handleValueChanged(y,o)})}else(p[0]==="?"||p[0]==="#")&&(p.includes(".")?p=L(a,p.substring(1)):p=a[p.substring(1)]);let m=(h,u)=>this.handleValueChanged(u.val,o),d=this.visualizationHandler.subscribeState(p,m);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[o],m,d))}}parseIndirectBinding(t){let{parts:s,signals:e}=U(t);this.parts=s,this.signals=e;for(let i=0;i<e.length;i++)e[i][0]=="."&&(e[i]=this.visualizationHandler.getNormalizedSignalName(e[i],this.relativeSignalPath,this.element))}handleValueChanged(t,s){this.values[s]=t;let e=this.parts[0];for(let i=0;i<this.parts.length-1;i++){let n=this.values[i];if(n==null)return;e+=n+this.parts[i+1]}if(e[0]=="."&&(e=this.visualizationHandler.getNormalizedSignalName(e,this.relativeSignalPath,this.element)),this.combinedName!=e&&(this.unsubscribeTargetValue&&this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),!this.disposed)){this.combinedName=e;let i=(n,l)=>this.valueChangedCb(l);this.unsubscribeTargetValue=[i,this.visualizationHandler.subscribeState(e,i)]}}dispose(){this.disposed=!0,this.unsubscribeTargetValue&&(this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),this.unsubscribeTargetValue=null);for(let t=0;t<this.signals.length;t++)this.cleanupCalls[t]()}setState(t){this.disposed||this.visualizationHandler.setState(this.combinedName,t)}},te=class r{_visualizationHandler;namedConverterCallback;constructor(t){this._visualizationHandler=t}getChangedEventName(t,s){let e=s.indexOf("::");return e>=0?s.substring(e+2):t instanceof HTMLInputElement||t instanceof HTMLSelectElement?"change":z(t)?v.camelToDashCase(s):v.camelToDashCase(s)+"-changed"}parseBinding(t,s,e,i,n){let l=s.substring(n.length);if(i===f.cssvar&&(l="--"+l),!e.startsWith("{")){let c={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),c.signal=e,e.includes("::")){let o=e.split("::");e=o[0],c.signal=e,c.events=o[1].split(",")}c.twoWay=!0,c.events||(t instanceof HTMLInputElement?c.events=[this.getChangedEventName(t,l)]:t instanceof HTMLSelectElement?c.events=[this.getChangedEventName(t,l)]:z(t)?c.events=[this.getChangedEventName(t,l)]:(c.events=[this.getChangedEventName(t,l)],c.maybeLitElement=!0,c.litEventNames=[this.getChangedEventName(t,l)]))}if(e[0]==="!"&&(c.signal=e.substring(1),c.inverted=!0),c.signal.includes(";")){let o=c.signal.split(";");c.expression=o.pop(),c.signal=o.join(";")}return i===f.cssvar||i===f.class?[r.dotToCamelCase(l),c]:i===f.attribute?[l,c]:[v.dashToCamelCase(l),c]}let a=JSON.parse(e);return a.target=i,a.twoWay&&(a.events==null||a.events.length==0)&&(t instanceof HTMLInputElement?a.events=["change"]:t instanceof HTMLSelectElement?a.events=["change"]:a.events=[this.getChangedEventName(t,l)]),i===f.cssvar||i===f.class?[r.dotToCamelCase(l),a]:i===f.attribute?[l,a]:[v.dashToCamelCase(l),a]}serializeBinding(t,s,e){let i={...e};delete i.type,e.twoWay?e.events!=null&&e.events.length==1&&(t instanceof HTMLInputElement&&e.events?.[0]=="change"||t instanceof HTMLSelectElement&&e.events?.[0]=="change"||z(t)&&e.events?.[0]==s||!z(t)&&e.events?.[0]==s+"-changed")&&delete i.events:(delete i.events,delete i.expressionTwoWay);let n=i.twoWay&&i.events?.length>0?"::"+i.events.join(","):"",l=!1;return(n&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(l=!0),e.signal.trim()[0]=="{"&&(l=!0),!l&&e.target==f.property&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[w+"text",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:s=="innerHTML"?[w+"html",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:[S+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.property&&e.expression&&!e.expression.includes(`
 `)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[w+"text",(e.inverted?"!":"")+e.signal+";"+e.expression+n]:s=="innerHTML"?[w+"html",(e.inverted?"!":"")+e.signal+";"+e.expression+n]:[S+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!l&&e.target==f.attribute&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[B+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.attribute&&e.expression&&!e.expression.includes(`
 `)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[B+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!l&&e.target==f.class&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[R+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.class&&e.expression&&!e.expression.includes(`
 `)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[R+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!l&&e.target==f.css&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[V+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.css&&e.expression&&!e.expression.includes(`
 `)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[V+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!l&&e.target==f.cssvar&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+r.camelToDotCase(s.substring(2)),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!l&&e.target==f.cssvar&&e.expression&&!e.expression.includes(`
-`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:((e.inverted===null||e.inverted===!1)&&delete i.inverted,(e.expression===null||e.expression==="")&&delete i.expression,(e.expressionTwoWay===null||e.expressionTwoWay==="")&&delete i.expressionTwoWay,(e.twoWay===null||e.twoWay===!1)&&delete i.twoWay,delete i.target,e.historic||delete i.historic,e.target==f.content?[w+"html",JSON.stringify(i)]:e.target==f.attribute?[B+v.camelToDashCase(s),JSON.stringify(i)]:e.target==f.class?[R+r.camelToDotCase(s),JSON.stringify(i)]:e.target==f.css?[V+v.camelToDashCase(s),JSON.stringify(i)]:e.target==f.cssvar?[A+r.camelToDotCase(s.substring(2)),JSON.stringify(i)]:e.target==f.property&&s=="innerHTML"?[w+"html",JSON.stringify(i)]:e.target==f.property&&s=="textContent"?[w+"text",JSON.stringify(i)]:[S+v.camelToDashCase(s),JSON.stringify(i)])}getBindingAttributeName(t,s,e){return e==f.attribute?B+v.camelToDashCase(s):e==f.class?R+r.camelToDotCase(s):e==f.css?V+v.camelToDashCase(s):e==f.visible?F:e==f.cssvar?A+r.camelToDotCase(s):e==f.property&&s=="innerHTML"?w+"html":e==f.property&&s=="textContent"?w+"text":S+v.camelToDashCase(s)}*getBindings(t){if(t.attributes)for(let s of t.attributes)s.name.startsWith(S)?yield this.parseBinding(t,s.name,s.value,f.property,S):s.name.startsWith(w)?yield this.parseBinding(t,s.name==="bind-content:html"?"bind-prop:inner-h-t-m-l":"bind-prop:text-content",s.value,f.property,S):s.name.startsWith(B)?yield this.parseBinding(t,s.name,s.value,f.attribute,B):s.name.startsWith(R)?yield this.parseBinding(t,s.name,s.value,f.class,R):s.name.startsWith(V)?yield this.parseBinding(t,s.name,s.value,f.css,V):s.name.startsWith(A)?yield this.parseBinding(t,s.name,s.value,f.cssvar,A):s.name.startsWith(F)&&(yield this.parseBinding(t,s.name,s.value,f.visible,F))}applyAllBindings(t,s,e,i){let n=[],l=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),a;for(;a=l.nextNode();){let p=this.getBindings(a);for(let o of p)try{let u=this.applyBinding(a,o,s,e,i);if(n.push(u),o[1].maybeLitElement&&a.localName.includes("-")&&!customElements.get(a.localName)){let g=a,d=o;customElements.whenDefined(a.localName).then(()=>{z(g)&&(u(),d[1].events=d[1].litEventNames,n.push(this.applyBinding(g,d,s,e,i)))})}}catch(u){console.warn("error applying binding",a,o,u)}}return n}static#e=0;async parseCssBindings(t,s,e,i){let n=await import("@node-projects/css-parser"),l=n.parse(t),a;for(let o of l.stylesheet.rules)if(o.type===n.CssTypes.rule){for(let u of o.declarations)if(u.type===n.CssTypes.declaration&&u.value.includes(Pe)){let g=this.parseCssBinding(u.value,s,e,i);u.value=g[0],a?a.push(...g[1]):a=g[1]}}let p=n.stringify(l,{indent:"",compress:!0});return[Le(p),a]}parseCssBinding(t,s,e,i,n){t=t.trim();let l="",a="",p=!1,o="",u=!1,g=null,d=[];for(let h=0;h<t.length;h++){let c=t[h];if(p)if(u)o+=c;else if(g&&c==="\\")u=!0;else if(c===g)g=null;else if(g===null&&c===")"){let m=r.#e++,y=Me+m,x=[y,{signal:o,target:f.cssvar}];o.startsWith("{")&&(x=JSON.parse(o)),d.push(this.applyBinding(s,x,e,i,n)),l+="var("+y+")",p=!1,o=""}else o+=c;else c==="("?(a!=="bind"?(l+=a,l+=c):(p=!0,t[h+1]==="'"||t[h+1]==='"'?(h++,g=t[h]):g=null),a=""):c===" "||c===","||c==="("||c==="+"||c==="-"||c==="*"||c==="/"?(l+=a+c,a=""):a+=c}return[l+a,d]}applyBinding(t,s,e,i,n){let l=[],a,p=()=>{for(let d of l)this._visualizationHandler.unsubscribeState(d[0],d[1],d[2]);if(a)for(let d of a)d()},o=s[1].signal.split(";"),u=new Array(o.length);for(let d=0;d<o.length;d++){let h=o[d];if(u[d]="__"+d,h.includes(":")){let c=h.split(":");u[d]=c[0],h=c[1],o[d]=h}if(h[0]==="?"){if(i){let c=h.substring(1);if(c[0]=="?")o[d]=c;else{o[d]=i[c],c[0]==="$"&&(c=c.substring(1),o[d]="$"+i[c]);let m=()=>{p(),this.applyBinding(t,s,e,i,n)},y=this.getChangedEventName(i,c);i.addEventListener(y,m),a||(a=[]),a.push(()=>i.removeEventListener(y,m))}}}else if(h[0]==="#"){let c=h.substring(1);if(c[0]=="#")o[d]=c;else{o[d]=i[c],c[0]==="$"&&(c=c.substring(1),o[d]="$"+i[c]);let m=()=>{p(),this.applyBinding(t,s,e,i,n)},y=this.getChangedEventName(t,c);i.addEventListener(y,m),a||(a=[]),a.push(()=>i.removeEventListener(y,m))}}h[0]==="."&&(o[d]=this._visualizationHandler.getNormalizedSignalName(h,e,t))}let g=new Array(o.length);for(let d=0;d<o.length;d++){let h=o[d];if(h[0]==="?"){if(i){let c=h.substring(1),m=()=>{let y=!1;y||(y=!0,this.handleValueChanged(t,i,s,i[c],g,d,u,!1,e),y=!1)};i.addEventListener(v.camelToDashCase(c)+"-changed",m),a||(a=[]),a.push(()=>i.removeEventListener(v.camelToDashCase(c)+"-changed",m));try{this.handleValueChanged(t,i,s,i[c],g,d,u,!1,e)}catch(y){console.error(y)}s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,y=>i[c]=y)}}else if(h[0]==="#"){let c=h.substring(1),m=()=>{let y=!1;y||(y=!0,this.handleValueChanged(t,i,s,t[c],g,d,u,!1,e),y=!1)};t.addEventListener(v.camelToDashCase(c)+"-changed",m),a||(a=[]),a.push(()=>t.removeEventListener(v.camelToDashCase(c)+"-changed",m));try{this.handleValueChanged(t,i,s,t[c],g,d,u,!1,e)}catch(y){console.error(y)}s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,y=>t[c]=y)}else if(h[0]==="$"){let c=h.substring(1);c[0]==="."&&(c=this._visualizationHandler.getNormalizedSignalName(c,e,t)),this._visualizationHandler.getObject(c).then(m=>{this.handleValueChanged(t,i,s,m,g,d,u,!0,e)})}else if(h[0]==="\xA7"){let c=h.substring(1),m=n.valueProvider(c,{element:t,binding:s,relativeSignalPath:e,root:i});m instanceof Promise?m.then(x=>this.handleValueChanged(t,i,s,x,g,d,u,!0,e)):this.handleValueChanged(t,i,s,m,g,d,u,!0,e),n.valueChangedCallbacks||(n.valueChangedCallbacks=new Map);let y=n.valueChangedCallbacks.get(c);y==null&&(y=[],n.valueChangedCallbacks.set(c,y)),y.push(()=>{let x=n.valueProvider(c,{element:t,binding:s,relativeSignalPath:e,root:i});x instanceof Promise?x.then(ue=>this.handleValueChanged(t,i,s,ue,g,d,u,!0,e)):this.handleValueChanged(t,i,s,x,g,d,u,!0,e)})}else if(h.includes("{")){let c=new H(this,this._visualizationHandler,h,m=>this.handleValueChanged(t,i,s,m.val,g,d,u,!1,e),t,e,i,n);a||(a=[]),a.push(()=>c.dispose()),s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,m=>c.setState(m))}else if(s[1].historic)if(s[1].historic.reloadInterval){let c={timerId:-1},m=async()=>{let y=await this._visualizationHandler.getHistoricData(h,s[1].historic);this.handleValueChanged(t,i,s,y?.values,g,d,u,!0,e),c.timerId!==null&&(c.timerId=setTimeout(m,s[1].historic.reloadInterval))};m(),a||(a=[]),a.push(()=>{c.timerId>0&&clearTimeout(c.timerId),c.timerId=null})}else this._visualizationHandler.getHistoricData(h,s[1].historic).then(c=>this.handleValueChanged(t,i,s,c?.values,g,d,u,!0,e));else{let c=(m,y)=>this.handleValueChanged(t,i,s,y.val,g,d,u,!1,e);l.push([h,c,this._visualizationHandler.subscribeState(h,c)]),this._visualizationHandler.getState(h).then(m=>this.handleValueChanged(t,i,s,m?.val,g,d,u,!1,e)),s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,m=>this._visualizationHandler.setState(h,m))}}return p}addTwoWayBinding(t,s,e){t[1].expressionTwoWay&&(t[1].compiledExpressionTwoWay||(t[1].expressionTwoWay.includes("return ")?t[1].compiledExpressionTwoWay=new Function(["value"],t[1].expressionTwoWay):t[1].compiledExpressionTwoWay=new Function(["value"],"return "+t[1].expressionTwoWay)));for(let i of t[1].events){let n=s[i];n instanceof De?n.on(()=>{let l;t[1].target==f.attribute?l=s.getAttribute(t[0]):l=s[t[0]],l=r.parseValueWithType(l,t),t[1].compiledExpressionTwoWay&&(l=t[1].compiledExpressionTwoWay(l)),e(l)}):s.addEventListener(i,l=>{let a;t[1].target==f.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=r.parseValueWithType(a,t),t[1].compiledExpressionTwoWay&&(a=t[1].compiledExpressionTwoWay(a)),e(a)})}}static parseValueWithType(t,s){if(s[1].type)switch(s[1].type){case"number":return parseFloat(t);case"boolean":return t===!0||t==="true"||!!parseInt(t);case"string":return t?.toString();case"integer":return parseInt(t)}return t}handleValueChanged(t,s,e,i,n,l,a,p,o){let u=i;if(!p&&l==0&&(u=r.parseValueWithType(u,e)),n[l]=u,e[1].expression&&(e[1].compiledExpression||(a.push("__res"),a.push("__ctx"),e[1].expression.includes("return ")?e[1].compiledExpression=new Function(a,e[1].expression):e[1].compiledExpression=new Function(a,"return "+e[1].expression)),n[a.length-1]={element:t,root:s,boundNames:e[1].signal,boundTargetName:e[0],boundTargetType:e[1].target},u=e[1].compiledExpression(...n),n[a.length-1]=u),e[1].converter)if(typeof e[1].converter=="string")u=this.namedConverterCallback(e[1].converter,u,t,e);else{let g=u!=null?u.toString():u;if(g in e[1].converter){let d=e[1].converter[g];typeof d=="string"?u=new Function(a,"return `"+e[1].converter[g]+"`")(...n):u=d}else{let d=!1,h=parseFloat(u);for(let c in e[1].converter)if(c.length>2&&c[0]===">"&&c[1]==="="){let m=parseFloat(c.substring(2));if(h>=m){let y=e[1].converter[c];typeof y=="string"?u=new Function(a,"return `"+e[1].converter[c]+"`")(...n):u=y,d=!0;break}}else if(c.length>2&&c[0]==="<"&&c[1]==="="){let m=parseFloat(c.substring(2));if(h<=m){let y=e[1].converter[c];typeof y=="string"?u=new Function(a,"return `"+e[1].converter[c]+"`")(...n):u=y,d=!0;break}}else if(c.length>1&&c[0]===">"){let m=parseFloat(c.substring(1));if(h>m){let y=e[1].converter[c];typeof y=="string"?u=new Function(a,"return `"+e[1].converter[c]+"`")(...n):u=y,d=!0;break}}else if(c.length>1&&c[0]==="<"){let m=parseFloat(c.substring(1));if(h<m){let y=e[1].converter[c];typeof y=="string"?u=new Function(a,"return `"+e[1].converter[c]+"`")(...n):u=y,d=!0;break}}else{let m=c.split("-");if(m.length>1&&(m[0]===""||h>=parseFloat(m[0]))&&(m[1]===""||parseFloat(m[1])>=h)){let y=e[1].converter[c];typeof y=="string"?u=new Function(a,"return `"+e[1].converter[c]+"`")(...n):u=y,d=!0;break}}!d&&e[1].converterDefault!==void 0&&(u=e[1].converterDefault)}}if(e[1].inverted&&(u=!u),e[1].writeBackSignal){let g=e[1].writeBackSignal;g[0]==="."&&(g=o+g),this._visualizationHandler.setState(g,u,!0)}e[1].target==f.property?t[e[0]]=u:e[1].target==f.attribute?t.setAttribute(e[0],u):e[1].target==f.css?t.style[e[0]]=u:e[1].target==f.cssvar?t.style.setProperty(e[0],u):e[1].target==f.class?u?t.classList.add(e[0]):t.classList.remove(e[0]):e[1].target==f.visible&&(t.style.visibility=u?"":"collapse")}static camelToDotCase(t){return t.replace(/([A-Z])/g,s=>`.${s[0].toLowerCase()}`)}static dotToCamelCase(t){return t.replace(/\.([a-z])/g,s=>s[1].toUpperCase())}};var te=class{name;relativeSignalsPath;commands;parameters};import{deepValue as _,setDeepValue as se,sleep as Fe}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import j from"long";var ie=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(r){this._visualizationHandler=r}async execute(r,t){for(let s=0;s<r.length;s++){let e=r[s];if(e.type=="Exit")break;if(e.type=="Goto"){let i=await this.getValue(e.label,t);if(s=r.findIndex(n=>n.type=="Label"&&n.label==i),s<0)break}else if(e.type=="Condition"){let i=await this.getValue(e.value1,t),n=await this.getValue(e.value2,t),l=await this.getValue(e.comparisonType,t),a=!1;switch(l){case"==null":a=i==null;break;case"!=null":a=i!=null;break;case"==true":a=i==!0;break;case"==false":a=i==!1;break;case"==":a=i==n;break;case"!=":a=i!=n;break;case">":a=i>n;break;case"<":a=i<n;break;case">=":a=i>=n;break;case"<=":a=i<=n;break;case"&&":a=i&&n;break;case"||":a=i||n;break}if(a){await this.runExternalScript(await this.getValue(e.trueScriptName,t),await this.getValue(e.trueScriptType,t));let p=await this.getValue(e.trueGotoLabel,t);if(p&&(s=r.findIndex(o=>o.type=="Label"&&o.label==p),s<0))break}else{await this.runExternalScript(await this.getValue(e.falseScriptName,t),await this.getValue(e.falseScriptType,t));let p=await this.getValue(e.falseGotoLabel,t);if(p&&(s=r.findIndex(o=>o.type=="Label"&&o.label==p),s<0))break}}else if(!await this.runScriptCommand(e,t))break}}async getValueFromTarget(r,t,s){return r==="property"?_(s.root,t):r==="elementProperty"?_(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(r,t,s,e){r==="property"?se(s.root,t,e):r==="elementProperty"?se(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(r,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"Goto":case"Exit":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let r=await this.getValue(command.value??500,context);await Fe(r);break}case"Console":{let r=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[r](t);break}case"ToggleSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,r,context);await this._visualizationHandler.setState(this.getSignalName(r,context),!s);break}case"ToggleSignalValueThroughList":{let r=await this.getValue(command.valueList,context),t=await this.getValue(command.signal,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,t,context),i=r.indexOf(e)+1;i>=r.length&&(i=0);let n=r[i];await this._visualizationHandler.setState(this.getSignalName(t,context),n);break}case"SetSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,r,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,r,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,r,context,e);break}case"DecrementSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,r,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,r,context,e);break}case"CalculateSignalValue":{let formula=await this.getValue(command.formula,context),target=await this.getValue(command.target,context),targetSignal=await this.getValue(command.targetSignal,context),nm=await this.parseStringWithValues(formula,context),result=eval(nm);await this.setValueOnTarget(target,targetSignal,context,result);break}case"SetBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=j.fromNumber(1).shiftLeft(t),n=j.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"ClearBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=j.fromNumber(1).shiftLeft(t);i.negate();let n=j.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"ToggleBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=j.fromNumber(1).shiftLeft(t),n=j.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"Javascript":{let r=await this.getValue(command.script,context),t=context;t.shadowRoot=context.element.getRootNode(),t.instance=context.shadowRoot.host,command.compiledScript||(command.compiledScript=new Function("context",r)),command.compiledScript(t);break}case"SetElementProperty":{command=N.upgradeSetElementProperty(command);let r=await this.getValue(command.name,context);r===""&&(r=null);let t=await this.getValue(command.value,context),s=await this.getValue(command.parentIndex??0,context),e=await this.getValue(command.target??"property",context),i=await this.getValue(command.targetSelectorTarget??"container",context),n=await this.getValue(command.targetSelector,context),l=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,n);for(let p of a)e=="attribute"?p.setAttribute(r,t):e=="property"?p[r]=t:e=="css"?p.style[r]=t:e=="class"&&(l==="toggle"?p.classList.toggle(r??t):l==="remove"?p.classList.remove(r??t):p.classList.add(r??t));break}case"SubscribeSignal":{let r=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(r,s,null)};this._visualizationHandler.subscribeState(r,s)}else this._visualizationHandler.subscribeState(r,this._subscriptionCallback);break}case"UnsubscribeSignal":{let r=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(r,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let r=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(r);break}case"ClearSignalsInGroup":{let r=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(r);break}case"RunScript":{let r=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(r,t);break}case"ShowMessageBox":{let r=null,t=await this.getValue(command.exitScriptOnCancel,context);if(await this.getValue(command.buttons,context)=="yesNo"){let i=await this.getValue(command.message,context);confirm(i)?r=1:r=2}else{let i=await this.getValue(command.message,context);alert(i),r=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,r),t&&r!=1)return!1;break}case"ShowPrompt":{let r=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(r,t),e=await this.getValue(command.resultSignal,context);e&&s&&this._visualizationHandler.setState(e,s);break}case"Login":case"Logout":case"CloseDialog":case"OpenDialog":case"OpenScreen":case"SwitchLanguage":case"CopySignalValuesFromFolder":case"ExportSignalValuesAsJson":case"ImportSignalValuesFromJson":{alert('command: "'+command.type+'" is not yet implemented');break}}return!0}getTarget(r,t,s){if(t==="container"){let e=r.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=r.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(r,t,s,e){let i=this.getTarget(r,t,s),n=[i];return e&&(t==="container"?n=i.shadowRoot.querySelectorAll(e):n=i.querySelectorAll(e)),n}async getValue(value,outerContext){if(value==null)return null;if(typeof value=="object")switch(value.source){case"property":return _(outerContext.root,value.name);case"elementProperty":return _(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let r=_(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(r,outerContext)))?.val}case"event":{let r=outerContext.event;return value.name&&(r=_(r,value.name)),r}case"parameter":return outerContext.parameters[value.name];case"context":return _(outerContext,value.name);case"complexString":{let r=value.name;return r!=null?await this.parseStringWithValues(r,outerContext):null}case"complexSignal":{let r=value.name;if(r!=null){let t=await this.parseStringWithValues(r,outerContext);return(await this._visualizationHandler.getState(this.getSignalName(t,outerContext)))?.val}return null}case"expression":{var ctx=outerContext;return eval(value.name)}}return value}async getStateOrFieldOrParameter(name,context){if(name[0]==="\xA7"){var ctx=context;return eval("ctx."+name.substring(1))}else{if(name[0]==="?"&&name[1]==="?")return context.root[name.substring(2)];if(name[0]==="?")return await this._visualizationHandler.getState(this.getSignalName(context.root[name.substring(1)],context))}return await this._visualizationHandler.getState(this.getSignalName(name,context))}async parseStringWithValues(r,t){let s=J(r),e=await Promise.all(s.signals.map(n=>this.getStateOrFieldOrParameter(this.getSignalName(n,t),t))),i=s.parts[0];for(let n=0;n<s.parts.length-1;n++){let l=e[n];typeof l=="object"&&(l=l.val),l==null&&(l=""),i+=l+s.parts[n+1]}return i}getSignalName(r,t){return r[0]==="."?t.relativeSignalsPath+r:r}createScriptContext(r,t,s,e,i){return{root:r,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(r,t,s,e,i,n,l,a){let p=s.querySelectorAll("*");n??=this.createScriptContext;let o=null;if(t)try{o=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"}))),a?a(o):o.init&&o.init(e,s)}catch(u){console.error("error parsing javascript - "+r,u)}for(let u of p)for(let g of u.attributes)if(g.name[0]=="@")try{let d=g.name.substring(1),h=g.value.trim();if(h[0]=="{"){let c=JSON.parse(h);if("commands"in c)u.addEventListener(d,m=>this.execute(c.commands,n(e,m,u,c.parameters,c.relativeSignalsPath)));else if("blocks"in c){let m=null;u.addEventListener(d,async y=>{m||(m=await X(c)),m(y,s,c.parameters,c.relativeSignalsPath??"",i,n(e,y,u,c.parameters,c.relativeSignalsPath))})}else if(l)l(u,d,c);else if("name"in c){let m=c.name;u.addEventListener(d,y=>{o[m]?o[m](y,u,s,e,c.parameters):console.warn("javascript function named: "+m+' not found, maybe missing a "export" ?')})}}else u.addEventListener(d,c=>{o[h]?o[h](c,u,s,e):console.warn("javascript function named: "+h+' not found, maybe missing a "export" ?')})}catch{console.warn("error assigning script",u,g)}return o}};import{OverlayLayer as He,DesignItem as T,InsertAction as Je,BindingTarget as k,PropertyType as M}from"@node-projects/web-component-designer";var ae=class{constructor(t,s){this._bindingsHelper=t,this._visualizationHandler=s}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(t,s,e){let i=T.GetDesignItem(e);if(i&&!i.isRootItem){let n=t.getNormalizedElementCoordinates(e);this.rect=t.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",n.x,n.y,n.width,n.height,"",null,He.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(e,this.rect)}}dragLeave(t,s,e){let i=T.GetDesignItem(e);if(i&&!i.isRootItem){let n=this.rectMap.get(e);t.overlayLayer.removeOverlay(n),this.rectMap.delete(e)}}dragOver(t,s,e){return"copy"}async drop(t,s,e,i){for(let p of this.rectMap.values())t.overlayLayer.removeOverlay(p);this.rectMap.clear();let n=T.GetDesignItem(i),l=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(l);if(n&&!n.isRootItem)if(i instanceof HTMLInputElement){let p={signal:e.fullName,target:k.property},o=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",p);n.setAttribute(o[0],o[1])}else{let p={signal:e.fullName,target:k.content},o=this._bindingsHelper.serializeBinding(i,null,p);n.setAttribute(o[0],o[1])}else{let p=t.getNormalizedEventCoordinates(s),o,u,g=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof g?.val=="string")if(g.val.endsWith("jpg")||g.val.endsWith("jpeg")||g.val.endsWith("png")||g.val.endsWith("gif")||g.val.endsWith("svg")){let d=document.createElement("img");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),u=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},c=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(c[0],c[1]),o.element.src=g.val}else if(g.val.endsWith("mp4")){let d=document.createElement("video");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),u=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},c=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(c[0],c[1]),o.element.src=g.val}else{let d=document.createElement("iframe");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),u=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},c=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(c[0],c[1]),o.element.src=g.val}if(!o){let d=document.createElement("input");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),u=o.openGroup("Insert");let h=a.writeable!==!1,c={signal:e.fullName,target:k.property,twoWay:h},m=this._bindingsHelper.serializeBinding(d,"value",c);a.type==="boolean"?(m=this._bindingsHelper.serializeBinding(d,"checked",c),o.setAttribute("type","checkbox")):a.role=="date"?(c.twoWay=h,m=this._bindingsHelper.serializeBinding(d,"value-as-number",c),o.setAttribute("type","date"),o.setAttribute("readonly","")):a.role=="datetime"&&(c.twoWay=h,m=this._bindingsHelper.serializeBinding(d,"value-as-number",c),o.setAttribute("type","datetime-local"),o.setAttribute("readonly","")),o.setAttribute(m[0],m[1])}o.setStyle("position","absolute"),o.setStyle("left",p.x+"px"),o.setStyle("top",p.y+"px"),t.instanceServiceContainer.undoService.execute(new Je(t.rootDesignItem,t.rootDesignItem.childCount,o)),u.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([o]))}}dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){if(s.type=="signal"){s.service.setValue(i,s,e.fullName);return}let n={signal:e.fullName,target:k.property};s.propertyType==M.attribute&&(n.target=k.attribute),s.propertyType==M.cssValue&&(n.target=k.css),n.signal=e.fullName,n.twoWay=s.propertyType==M.property||s.propertyType==M.propertyAndAttribute;let l=i[0].openGroup("drop binding");for(let a of i){let p=this._bindingsHelper.serializeBinding(a.element,s.name,n);a.setAttribute(p[0],p[1])}l.commit()}};import{BindingMode as U,BindingTarget as ne,PropertiesHelper as Ue}from"@node-projects/web-component-designer";var re=class r{constructor(t){this._bindingsHelper=t}_bindingsHelper;static type="visualization-binding";getBindings(t){return Array.from(this._bindingsHelper.getBindings(t.element)).map(e=>({targetName:e[1].target===ne.css||e[1].target===ne.attribute?Ue.camelToDashCase(e[0]):e[0],target:e[1].target,mode:e[1].twoWay?U.twoWay:U.oneWay,invert:e[1].inverted,bindableObjectNames:e[1].signal.split(";"),expression:e[1].expression,expressionTwoWay:e[1].expressionTwoWay,converter:e[1].converter,type:r.type,service:this,changedEvents:e[1].events,historic:e[1].historic,writeBackSignal:e[1].writeBackSignal}))}setBinding(t,s){let e={signal:s.bindableObjectNames.join(";"),target:s.target};e.inverted=s.invert,e.twoWay=s.mode==U.twoWay,e.expression=s.expression,e.expressionTwoWay=s.expressionTwoWay,e.historic=s.historic,e.type=s.type,e.converter=s.converters,e.target=s.target,e.events=s.changedEvents;let i=this._bindingsHelper.serializeBinding(t.element,s.targetName,e),n=t.openGroup("edit_binding");return t.setAttribute(i[0],i[1]),n.commit(),!0}clearBinding(t,s,e){let i=this._bindingsHelper.getBindingAttributeName(t.element,s,e);return t.removeAttribute(i),!0}};var le=class{getRefactorings(t){let s=[];for(let e of t){let i=e.serviceContainer.bindingService.getBindings(e);if(i)for(let n of i)for(let l of n.bindableObjectNames){let a="signal",p="";if(l.includes(":")){let o=l.split(":")[0],u=l.substring(o.length+1);u.startsWith("?")&&(u=u.substring(1),p="?",a="property",u.startsWith("?")&&(u=u.substring(1),p="??")),s.push({service:this,name:u,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName+" - "+o+":",shortName:o,prefix:p})}else l.startsWith("?")&&(l=l.substring(1),p="?",a="property",l.startsWith("?")&&(l=l.substring(1),p="??")),s.push({service:this,name:l,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName,prefix:p})}}return s}refactor(t,s,e){let i=t.sourceObject;t.shortName?i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.shortName+":"+t.prefix+s?t.shortName+":"+t.prefix+e:n):i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.prefix+s?t.prefix+e:n),t.designItem.serviceContainer.bindingService.setBinding(t.designItem,i)}};var oe=class{dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){s.service.setValue(i,s,e.text)}};import{BindingTarget as b}from"@node-projects/web-component-designer";var ce=class{getRefactorings(t){let s=[];for(let e of t)for(let i of e.attributes())if(i[0][0]=="@"){let n=i[1];if(n[0]=="{"){let l=JSON.parse(n);if("commands"in l)for(let a of l.commands){for(let p in a){let o=a[p];if(o!=null&&typeof o=="object"){let u=o;if(u.source==="signal")s.push({name:u.name,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+p+"[signal]",refactor:g=>u.name=g});else if(u.source==="property")s.push({name:u.name,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+p+"[property]",refactor:g=>u.name=g});else if(u.source==="complexString")for(let g of u.name.matchAll(/\{(.*?)\}/g)){let d=g[0],h=g[1];if(h[0]==="?"){let c="?";h=h.substring(1),h[0]==="?"&&(c="??",h=h.substring(1)),s.push({name:h,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+p+"[complexString]->property",refactor:m=>u.name=u.name.replace(d,"{"+c+m+"}")})}else s.push({name:h,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+p+"[complexString]->signal",refactor:c=>u.name=u.name.replace(d,"{"+c+"}")})}}}switch(a.type){case"SetSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"ToggleSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"IncrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"DecrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"SetBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"ClearBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"ToggleBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"OpenScreen":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.screen=p});break;case"OpenDialog":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.screen=p});break;case"CalculateSignalValue":a.targetSignal&&typeof a.targetSignal=="string"&&s.push({name:a.targetSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/targetSignal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.targetSignal=p});break;case"SubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"UnsubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.signal=p});break;case"ShowMessageBox":a.resultSignal&&typeof a.resultSignal=="string"&&s.push({name:a.resultSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/resultSignal",service:this,designItem:e,type:"script",sourceObject:l,refactor:p=>a.resultSignal=p});break}}else"blocks"in l;if("parameters"in l)for(let a in l.parameters)typeof l.parameters[a]=="string"&&s.push({name:l.parameters[a],itemType:"parameter",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:i[0].substring(1)+"/parameters/"+a,refactor:p=>l.parameters[a]=p})}}return s}refactor(t,s,e){t.refactor(e);let i=JSON.stringify(t.sourceObject);t.designItem.setAttribute(t.targetName,i)}};import{BasePropertyEditor as Xe}from"@node-projects/web-component-designer";var pe=class extends Xe{_ip;_container;constructor(t,s){super(t),this._container=document.createElement("div"),this._container.style.display="flex",this._ip=document.createElement("input"),this._ip.onchange=i=>this._valueChanged(this._ip.value),this._ip.onfocus=i=>{this._ip.selectionStart=0,this._ip.selectionEnd=this._ip.value?.length},this._container.appendChild(this._ip);let e=document.createElement("button");e.textContent="...",e.onclick=async()=>{let i=s.createBindableObjectBrowser();i.initialize(this.designItems[0].serviceContainer,this.designItems[0].instanceServiceContainer,"property"),i.title="select signal...";let n=new AbortController;i.objectDoubleclicked.on(()=>{n.abort(),this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value)}),await s.openConfirmation(i,{x:100,y:100,width:400,height:300,abortSignal:n.signal})&&(this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value))},this._container.appendChild(e),this.element=this._container}refreshValue(t,s){s==null?this._ip.value="":this._ip.value=s}};export{ae as BindableObjectDragDropService,D as BindingsEditor,E as BindingsEditorHistoric,ee as BindingsHelper,C as BlocklyScriptEditor,L as EventAssignment,O as ParameterEditor,oe as PropertyGridDragDropService,te as Script,ce as ScriptRefactorService,ie as ScriptSystem,pe as SignalPropertyEditor,I as SimpleScriptEditor,le as VisualizationBindingsRefactorService,re as VisualizationBindingsService,W as VisualizationPropertyGrid,B as bindingPrefixAttribute,R as bindingPrefixClass,w as bindingPrefixContent,V as bindingPrefixCss,A as bindingPrefixCssVar,Pe as bindingPrefixInsideCss,Me as bindingPrefixInsideCssVarName,S as bindingPrefixProperty,F as bindingPrefixVisible,Ft as bindingsInCssRegex,X as generateEventCodeFromBlockly,P as getNestedProperty,z as isLit,J as parseBindingString};
+`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:((e.inverted===null||e.inverted===!1)&&delete i.inverted,(e.expression===null||e.expression==="")&&delete i.expression,(e.expressionTwoWay===null||e.expressionTwoWay==="")&&delete i.expressionTwoWay,(e.twoWay===null||e.twoWay===!1)&&delete i.twoWay,delete i.target,e.historic||delete i.historic,e.target==f.content?[w+"html",JSON.stringify(i)]:e.target==f.attribute?[B+v.camelToDashCase(s),JSON.stringify(i)]:e.target==f.class?[R+r.camelToDotCase(s),JSON.stringify(i)]:e.target==f.css?[V+v.camelToDashCase(s),JSON.stringify(i)]:e.target==f.cssvar?[A+r.camelToDotCase(s.substring(2)),JSON.stringify(i)]:e.target==f.property&&s=="innerHTML"?[w+"html",JSON.stringify(i)]:e.target==f.property&&s=="textContent"?[w+"text",JSON.stringify(i)]:[S+v.camelToDashCase(s),JSON.stringify(i)])}getBindingAttributeName(t,s,e){return e==f.attribute?B+v.camelToDashCase(s):e==f.class?R+r.camelToDotCase(s):e==f.css?V+v.camelToDashCase(s):e==f.visible?F:e==f.cssvar?A+r.camelToDotCase(s):e==f.property&&s=="innerHTML"?w+"html":e==f.property&&s=="textContent"?w+"text":S+v.camelToDashCase(s)}*getBindings(t){if(t.attributes)for(let s of t.attributes)s.name.startsWith(S)?yield this.parseBinding(t,s.name,s.value,f.property,S):s.name.startsWith(w)?yield this.parseBinding(t,s.name==="bind-content:html"?"bind-prop:inner-h-t-m-l":"bind-prop:text-content",s.value,f.property,S):s.name.startsWith(B)?yield this.parseBinding(t,s.name,s.value,f.attribute,B):s.name.startsWith(R)?yield this.parseBinding(t,s.name,s.value,f.class,R):s.name.startsWith(V)?yield this.parseBinding(t,s.name,s.value,f.css,V):s.name.startsWith(A)?yield this.parseBinding(t,s.name,s.value,f.cssvar,A):s.name.startsWith(F)&&(yield this.parseBinding(t,s.name,s.value,f.visible,F))}applyAllBindings(t,s,e,i){let n=[],l=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),a;for(;a=l.nextNode();){let c=this.getBindings(a);for(let o of c)try{let p=this.applyBinding(a,o,s,e,i);if(n.push(p),o[1].maybeLitElement&&a.localName.includes("-")&&!customElements.get(a.localName)){let m=a,d=o;customElements.whenDefined(a.localName).then(()=>{z(m)&&(p(),d[1].events=d[1].litEventNames,n.push(this.applyBinding(m,d,s,e,i)))})}}catch(p){console.warn("error applying binding",a,o,p)}}return n}static#e=0;async parseCssBindings(t,s,e,i){let n=await import("@node-projects/css-parser"),l=n.parse(t),a;for(let o of l.stylesheet.rules)if(o.type===n.CssTypes.rule){for(let p of o.declarations)if(p.type===n.CssTypes.declaration&&p.value.includes(He)){let m=this.parseCssBinding(p.value,s,e,i);p.value=m[0],a?a.push(...m[1]):a=m[1]}}let c=n.stringify(l,{indent:"",compress:!0});return[Me(c),a]}parseCssBinding(t,s,e,i,n){t=t.trim();let l="",a="",c=!1,o="",p=!1,m=null,d=[];for(let h=0;h<t.length;h++){let u=t[h];if(c)if(p)o+=u;else if(m&&u==="\\")p=!0;else if(u===m)m=null;else if(m===null&&u===")"){let g=r.#e++,y=Fe+g,x=[y,{signal:o,target:f.cssvar}];o.startsWith("{")&&(x=JSON.parse(o)),d.push(this.applyBinding(s,x,e,i,n)),l+="var("+y+")",c=!1,o=""}else o+=u;else u==="("?(a!=="bind"?(l+=a,l+=u):(c=!0,t[h+1]==="'"||t[h+1]==='"'?(h++,m=t[h]):m=null),a=""):u===" "||u===","||u==="("||u==="+"||u==="-"||u==="*"||u==="/"?(l+=a+u,a=""):a+=u}return[l+a,d]}applyBinding(t,s,e,i,n){let l=[],a,c=()=>{for(let d of l)this._visualizationHandler.unsubscribeState(d[0],d[1],d[2]);if(a)for(let d of a)d()},o=s[1].signal.split(";"),p=new Array(o.length);for(let d=0;d<o.length;d++){let h=o[d];if(p[d]="__"+d,h.includes(":")){let u=h.split(":");p[d]=u[0],h=u[1],o[d]=h}if(h[0]==="?"){if(i){let u=h.substring(1);if(u[0]=="?")o[d]=u;else{o[d]=i[u],u[0]==="$"&&(u=u.substring(1),o[d]="$"+i[u]);let g=()=>{c(),this.applyBinding(t,s,e,i,n)},y=this.getChangedEventName(i,u);i.addEventListener(y,g),a||(a=[]),a.push(()=>i.removeEventListener(y,g))}}}else if(h[0]==="#"){let u=h.substring(1);if(u[0]=="#")o[d]=u;else{o[d]=i[u],u[0]==="$"&&(u=u.substring(1),o[d]="$"+i[u]);let g=()=>{c(),this.applyBinding(t,s,e,i,n)},y=this.getChangedEventName(t,u);i.addEventListener(y,g),a||(a=[]),a.push(()=>i.removeEventListener(y,g))}}h[0]==="."&&(o[d]=this._visualizationHandler.getNormalizedSignalName(h,e,t))}let m=new Array(o.length);for(let d=0;d<o.length;d++){let h=o[d];if(h[0]==="?"){if(i){let u=h.substring(1),g=()=>{let y=!1;y||(y=!0,this.handleValueChanged(t,i,s,i[u],m,d,p,!1,e),y=!1)};i.addEventListener(v.camelToDashCase(u)+"-changed",g),a||(a=[]),a.push(()=>i.removeEventListener(v.camelToDashCase(u)+"-changed",g));try{this.handleValueChanged(t,i,s,i[u],m,d,p,!1,e)}catch(y){console.error(y)}s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,y=>i[u]=y)}}else if(h[0]==="#"){let u=h.substring(1),g=()=>{let y=!1;y||(y=!0,this.handleValueChanged(t,i,s,t[u],m,d,p,!1,e),y=!1)};t.addEventListener(v.camelToDashCase(u)+"-changed",g),a||(a=[]),a.push(()=>t.removeEventListener(v.camelToDashCase(u)+"-changed",g));try{this.handleValueChanged(t,i,s,t[u],m,d,p,!1,e)}catch(y){console.error(y)}s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,y=>t[u]=y)}else if(h[0]==="$"){let u=h.substring(1);u[0]==="."&&(u=this._visualizationHandler.getNormalizedSignalName(u,e,t)),this._visualizationHandler.getObject(u).then(g=>{this.handleValueChanged(t,i,s,g,m,d,p,!0,e)})}else if(h[0]==="\xA7"){let u=h.substring(1),g=n.valueProvider(u,{element:t,binding:s,relativeSignalPath:e,root:i});g instanceof Promise?g.then(x=>this.handleValueChanged(t,i,s,x,m,d,p,!0,e)):this.handleValueChanged(t,i,s,g,m,d,p,!0,e),n.valueChangedCallbacks||(n.valueChangedCallbacks=new Map);let y=n.valueChangedCallbacks.get(u);y==null&&(y=[],n.valueChangedCallbacks.set(u,y)),y.push(()=>{let x=n.valueProvider(u,{element:t,binding:s,relativeSignalPath:e,root:i});x instanceof Promise?x.then(he=>this.handleValueChanged(t,i,s,he,m,d,p,!0,e)):this.handleValueChanged(t,i,s,x,m,d,p,!0,e)})}else if(h.includes("{")){let u=new J(this,this._visualizationHandler,h,g=>this.handleValueChanged(t,i,s,g.val,m,d,p,!1,e),t,e,i,n);a||(a=[]),a.push(()=>u.dispose()),s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,g=>u.setState(g))}else if(s[1].historic)if(s[1].historic.reloadInterval){let u={timerId:-1},g=async()=>{let y=await this._visualizationHandler.getHistoricData(h,s[1].historic);this.handleValueChanged(t,i,s,y?.values,m,d,p,!0,e),u.timerId!==null&&(u.timerId=setTimeout(g,s[1].historic.reloadInterval))};g(),a||(a=[]),a.push(()=>{u.timerId>0&&clearTimeout(u.timerId),u.timerId=null})}else this._visualizationHandler.getHistoricData(h,s[1].historic).then(u=>this.handleValueChanged(t,i,s,u?.values,m,d,p,!0,e));else{let u=(g,y)=>this.handleValueChanged(t,i,s,y.val,m,d,p,!1,e);l.push([h,u,this._visualizationHandler.subscribeState(h,u)]),this._visualizationHandler.getState(h).then(g=>this.handleValueChanged(t,i,s,g?.val,m,d,p,!1,e)),s[1].twoWay&&d==0&&this.addTwoWayBinding(s,t,g=>this._visualizationHandler.setState(h,g))}}return c}addTwoWayBinding(t,s,e){t[1].expressionTwoWay&&(t[1].compiledExpressionTwoWay||(t[1].expressionTwoWay.includes("return ")?t[1].compiledExpressionTwoWay=new Function(["value"],t[1].expressionTwoWay):t[1].compiledExpressionTwoWay=new Function(["value"],"return "+t[1].expressionTwoWay)));for(let i of t[1].events){let n=s[i];n instanceof Le?n.on(()=>{let l;t[1].target==f.attribute?l=s.getAttribute(t[0]):l=s[t[0]],l=r.parseValueWithType(l,t),t[1].compiledExpressionTwoWay&&(l=t[1].compiledExpressionTwoWay(l)),e(l)}):s.addEventListener(i,l=>{let a;t[1].target==f.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=r.parseValueWithType(a,t),t[1].compiledExpressionTwoWay&&(a=t[1].compiledExpressionTwoWay(a)),e(a)})}}static parseValueWithType(t,s){if(s[1].type)switch(s[1].type){case"number":return parseFloat(t);case"boolean":return t===!0||t==="true"||!!parseInt(t);case"string":return t?.toString();case"integer":return parseInt(t)}return t}handleValueChanged(t,s,e,i,n,l,a,c,o){let p=i;if(!c&&l==0&&(p=r.parseValueWithType(p,e)),n[l]=p,e[1].expression&&(e[1].compiledExpression||(a.push("__res"),a.push("__ctx"),e[1].expression.includes("return ")?e[1].compiledExpression=new Function(a,e[1].expression):e[1].compiledExpression=new Function(a,"return "+e[1].expression)),n[a.length-1]={element:t,root:s,boundNames:e[1].signal,boundTargetName:e[0],boundTargetType:e[1].target},p=e[1].compiledExpression(...n),n[a.length-1]=p),e[1].converter)if(typeof e[1].converter=="string")p=this.namedConverterCallback(e[1].converter,p,t,e);else{let m=p!=null?p.toString():p;if(m in e[1].converter){let d=e[1].converter[m];typeof d=="string"?p=new Function(a,"return `"+e[1].converter[m]+"`")(...n):p=d}else{let d=!1,h=parseFloat(p);for(let u in e[1].converter)if(u.length>2&&u[0]===">"&&u[1]==="="){let g=parseFloat(u.substring(2));if(h>=g){let y=e[1].converter[u];typeof y=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=y,d=!0;break}}else if(u.length>2&&u[0]==="<"&&u[1]==="="){let g=parseFloat(u.substring(2));if(h<=g){let y=e[1].converter[u];typeof y=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=y,d=!0;break}}else if(u.length>1&&u[0]===">"){let g=parseFloat(u.substring(1));if(h>g){let y=e[1].converter[u];typeof y=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=y,d=!0;break}}else if(u.length>1&&u[0]==="<"){let g=parseFloat(u.substring(1));if(h<g){let y=e[1].converter[u];typeof y=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=y,d=!0;break}}else{let g=u.split("-");if(g.length>1&&(g[0]===""||h>=parseFloat(g[0]))&&(g[1]===""||parseFloat(g[1])>=h)){let y=e[1].converter[u];typeof y=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=y,d=!0;break}}!d&&e[1].converterDefault!==void 0&&(p=e[1].converterDefault)}}if(e[1].inverted&&(p=!p),e[1].writeBackSignal){let m=e[1].writeBackSignal;m[0]==="."&&(m=o+m),this._visualizationHandler.setState(m,p,!0)}e[1].target==f.property?t[e[0]]=p:e[1].target==f.attribute?t.setAttribute(e[0],p):e[1].target==f.css?t.style[e[0]]=p:e[1].target==f.cssvar?t.style.setProperty(e[0],p):e[1].target==f.class?p?t.classList.add(e[0]):t.classList.remove(e[0]):e[1].target==f.visible&&(t.style.visibility=p?"":"collapse")}static camelToDotCase(t){return t.replace(/([A-Z])/g,s=>`.${s[0].toLowerCase()}`)}static dotToCamelCase(t){return t.replace(/\.([a-z])/g,s=>s[1].toUpperCase())}};var se=class{name;relativeSignalsPath;commands;parameters};import{deepValue as _,setDeepValue as ae,sleep as Ue}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import W from"long";import{EventsService as Je}from"@node-projects/web-component-designer";var M="cyclic",ie=class r extends Je{static _cyclicEvent=[{name:`${M}:100`,propertyName:void 0,eventObjectName:"Event",description:"this event will retrigger itself every 100 ms"}];getPossibleEvents(t){let s=super.getPossibleEvents(t);return s.push(...r._cyclicEvent),s}getEvent(t,s){return s.includes(M)?r._cyclicEvent.find(i=>i.name==s)??{name:s,propertyName:"on"+s,eventObjectName:"Event"}:super.getEvent(t,s)}};var ne=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(r){this._visualizationHandler=r}async execute(r,t){for(let s=0;s<r.length;s++){let e=r[s];if(e.type=="Exit")break;if(e.type=="Goto"){let i=await this.getValue(e.label,t);if(s=r.findIndex(n=>n.type=="Label"&&n.label==i),s<0)break}else if(e.type=="Condition"){let i=await this.getValue(e.value1,t),n=await this.getValue(e.value2,t),l=await this.getValue(e.comparisonType,t),a=!1;switch(l){case"==null":a=i==null;break;case"!=null":a=i!=null;break;case"==true":a=i==!0;break;case"==false":a=i==!1;break;case"==":a=i==n;break;case"!=":a=i!=n;break;case">":a=i>n;break;case"<":a=i<n;break;case">=":a=i>=n;break;case"<=":a=i<=n;break;case"&&":a=i&&n;break;case"||":a=i||n;break}if(a){await this.runExternalScript(await this.getValue(e.trueScriptName,t),await this.getValue(e.trueScriptType,t));let c=await this.getValue(e.trueGotoLabel,t);if(c&&(s=r.findIndex(o=>o.type=="Label"&&o.label==c),s<0))break}else{await this.runExternalScript(await this.getValue(e.falseScriptName,t),await this.getValue(e.falseScriptType,t));let c=await this.getValue(e.falseGotoLabel,t);if(c&&(s=r.findIndex(o=>o.type=="Label"&&o.label==c),s<0))break}}else if(!await this.runScriptCommand(e,t))break}}async getValueFromTarget(r,t,s){return r==="property"?_(s.root,t):r==="elementProperty"?_(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(r,t,s,e){r==="property"?ae(s.root,t,e):r==="elementProperty"?ae(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(r,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"Goto":case"Exit":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let r=await this.getValue(command.value??500,context);await Ue(r);break}case"Console":{let r=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[r](t);break}case"ToggleSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,r,context);await this._visualizationHandler.setState(this.getSignalName(r,context),!s);break}case"ToggleSignalValueThroughList":{let r=await this.getValue(command.valueList,context),t=await this.getValue(command.signal,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,t,context),i=r.indexOf(e)+1;i>=r.length&&(i=0);let n=r[i];await this._visualizationHandler.setState(this.getSignalName(t,context),n);break}case"SetSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,r,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,r,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,r,context,e);break}case"DecrementSignalValue":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,r,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,r,context,e);break}case"CalculateSignalValue":{let formula=await this.getValue(command.formula,context),target=await this.getValue(command.target,context),targetSignal=await this.getValue(command.targetSignal,context),nm=await this.parseStringWithValues(formula,context),result=eval(nm);await this.setValueOnTarget(target,targetSignal,context,result);break}case"SetBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=W.fromNumber(1).shiftLeft(t),n=W.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"ClearBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=W.fromNumber(1).shiftLeft(t);i.negate();let n=W.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"ToggleBitInSignal":{let r=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,r,context),i=W.fromNumber(1).shiftLeft(t),n=W.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,r,context,n);break}case"Javascript":{let r=await this.getValue(command.script,context),t=context;t.shadowRoot=context.element.getRootNode(),t.instance=context.shadowRoot.host,command.compiledScript||(command.compiledScript=new Function("context",r)),command.compiledScript(t);break}case"SetElementProperty":{command=N.upgradeSetElementProperty(command);let r=await this.getValue(command.name,context);r===""&&(r=null);let t=await this.getValue(command.value,context),s=await this.getValue(command.parentIndex??0,context),e=await this.getValue(command.target??"property",context),i=await this.getValue(command.targetSelectorTarget??"container",context),n=await this.getValue(command.targetSelector,context),l=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,n);for(let c of a)e=="attribute"?c.setAttribute(r,t):e=="property"?c[r]=t:e=="css"?c.style[r]=t:e=="class"&&(l==="toggle"?c.classList.toggle(r??t):l==="remove"?c.classList.remove(r??t):c.classList.add(r??t));break}case"SubscribeSignal":{let r=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(r,s,null)};this._visualizationHandler.subscribeState(r,s)}else this._visualizationHandler.subscribeState(r,this._subscriptionCallback);break}case"UnsubscribeSignal":{let r=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(r,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let r=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(r);break}case"ClearSignalsInGroup":{let r=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(r);break}case"RunScript":{let r=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(r,t);break}case"ShowMessageBox":{let r=null,t=await this.getValue(command.exitScriptOnCancel,context);if(await this.getValue(command.buttons,context)=="yesNo"){let i=await this.getValue(command.message,context);confirm(i)?r=1:r=2}else{let i=await this.getValue(command.message,context);alert(i),r=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,r),t&&r!=1)return!1;break}case"ShowPrompt":{let r=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(r,t),e=await this.getValue(command.resultSignal,context);e&&s&&this._visualizationHandler.setState(e,s);break}case"Login":case"Logout":case"CloseDialog":case"OpenDialog":case"OpenScreen":case"SwitchLanguage":case"CopySignalValuesFromFolder":case"ExportSignalValuesAsJson":case"ImportSignalValuesFromJson":{alert('command: "'+command.type+'" is not yet implemented');break}}return!0}getTarget(r,t,s){if(t==="container"){let e=r.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=r.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(r,t,s,e){let i=this.getTarget(r,t,s),n=[i];return e&&(t==="container"?n=i.shadowRoot.querySelectorAll(e):n=i.querySelectorAll(e)),n}async getValue(value,outerContext){if(value==null)return null;if(typeof value=="object")switch(value.source){case"property":return _(outerContext.root,value.name);case"elementProperty":return _(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let r=_(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(r,outerContext)))?.val}case"event":{let r=outerContext.event;return value.name&&(r=_(r,value.name)),r}case"parameter":return outerContext.parameters[value.name];case"context":return _(outerContext,value.name);case"complexString":{let r=value.name;return r!=null?await this.parseStringWithValues(r,outerContext):null}case"complexSignal":{let r=value.name;if(r!=null){let t=await this.parseStringWithValues(r,outerContext);return(await this._visualizationHandler.getState(this.getSignalName(t,outerContext)))?.val}return null}case"expression":{var ctx=outerContext;return eval(value.name)}}return value}async getStateOrFieldOrParameter(name,context){if(name[0]==="\xA7"){var ctx=context;return eval("ctx."+name.substring(1))}else{if(name[0]==="?"&&name[1]==="?")return context.root[name.substring(2)];if(name[0]==="?")return await this._visualizationHandler.getState(this.getSignalName(context.root[name.substring(1)],context))}return await this._visualizationHandler.getState(this.getSignalName(name,context))}async parseStringWithValues(r,t){let s=U(r),e=await Promise.all(s.signals.map(n=>this.getStateOrFieldOrParameter(this.getSignalName(n,t),t))),i=s.parts[0];for(let n=0;n<s.parts.length-1;n++){let l=e[n];typeof l=="object"&&(l=l.val),l==null&&(l=""),i+=l+s.parts[n+1]}return i}getSignalName(r,t){return r[0]==="."?t.relativeSignalsPath+r:r}createScriptContext(r,t,s,e,i){return{root:r,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(r,t,s,e,i,n,l,a){n??=this.createScriptContext;let c=await this.loadAndInitJsObject(r,t,s,e,a);for(let o of s.querySelectorAll("*"))for(let p of o.attributes)if(p.name[0]==="@")try{let m=p.name.substring(1),d=p.value.trim(),h=m.startsWith(M),u=h?parseInt(m.substring(m.indexOf(":")+1)):null,g=await this.resolveHandler(d,c,o,s,e,i,n,l,m);g&&this.bindHandler(o,m,h,u,g)}catch{console.warn("error assigning script",o,p)}return c}async loadAndInitJsObject(r,t,s,e,i){if(!t)return null;try{let l=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"})));return i?i(l):l.init?.(e,s),l}catch(n){return console.error("error parsing javascript - "+r,n),null}}async resolveHandler(r,t,s,e,i,n,l,a,c){if(r[0]!=="{")return p=>{t?.[r]?t[r](p,s,e,i):console.warn(`javascript function named: "${r}" not found, maybe missing a "export" ?`)};let o=JSON.parse(r);if("commands"in o)return p=>this.execute(o.commands,l(i,p,s,o.parameters,o.relativeSignalsPath));if("blocks"in o){let p=null;return async m=>{p??=await G(o),p(m,e,o.parameters,o.relativeSignalsPath??"",n,l(i,m,s,o.parameters,o.relativeSignalsPath))}}if("name"in o){if(a)return a(s,c,o),null;let p=o.name;return m=>{t?.[p]?t[p](m,s,e,i,o.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(r,t,s,e,i){if(!s){r.addEventListener(t,i);return}let n=setInterval(()=>{r.isConnected?i(null):clearInterval(n)},e)}};import{OverlayLayer as Xe,DesignItem as T,InsertAction as Ge,BindingTarget as k,PropertyType as H}from"@node-projects/web-component-designer";var re=class{constructor(t,s){this._bindingsHelper=t,this._visualizationHandler=s}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(t,s,e){let i=T.GetDesignItem(e);if(i&&!i.isRootItem){let n=t.getNormalizedElementCoordinates(e);this.rect=t.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",n.x,n.y,n.width,n.height,"",null,Xe.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(e,this.rect)}}dragLeave(t,s,e){let i=T.GetDesignItem(e);if(i&&!i.isRootItem){let n=this.rectMap.get(e);t.overlayLayer.removeOverlay(n),this.rectMap.delete(e)}}dragOver(t,s,e){return"copy"}async drop(t,s,e,i){for(let c of this.rectMap.values())t.overlayLayer.removeOverlay(c);this.rectMap.clear();let n=T.GetDesignItem(i),l=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(l);if(n&&!n.isRootItem)if(i instanceof HTMLInputElement){let c={signal:e.fullName,target:k.property},o=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",c);n.setAttribute(o[0],o[1])}else{let c={signal:e.fullName,target:k.content},o=this._bindingsHelper.serializeBinding(i,null,c);n.setAttribute(o[0],o[1])}else{let c=t.getNormalizedEventCoordinates(s),o,p,m=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof m?.val=="string")if(m.val.endsWith("jpg")||m.val.endsWith("jpeg")||m.val.endsWith("png")||m.val.endsWith("gif")||m.val.endsWith("svg")){let d=document.createElement("img");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(u[0],u[1]),o.element.src=m.val}else if(m.val.endsWith("mp4")){let d=document.createElement("video");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(u[0],u[1]),o.element.src=m.val}else{let d=document.createElement("iframe");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(d,"src",h);o.setAttribute(u[0],u[1]),o.element.src=m.val}if(!o){let d=document.createElement("input");o=T.createDesignItemFromInstance(d,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let h=a.writeable!==!1,u={signal:e.fullName,target:k.property,twoWay:h},g=this._bindingsHelper.serializeBinding(d,"value",u);a.type==="boolean"?(g=this._bindingsHelper.serializeBinding(d,"checked",u),o.setAttribute("type","checkbox")):a.role=="date"?(u.twoWay=h,g=this._bindingsHelper.serializeBinding(d,"value-as-number",u),o.setAttribute("type","date"),o.setAttribute("readonly","")):a.role=="datetime"&&(u.twoWay=h,g=this._bindingsHelper.serializeBinding(d,"value-as-number",u),o.setAttribute("type","datetime-local"),o.setAttribute("readonly","")),o.setAttribute(g[0],g[1])}o.setStyle("position","absolute"),o.setStyle("left",c.x+"px"),o.setStyle("top",c.y+"px"),t.instanceServiceContainer.undoService.execute(new Ge(t.rootDesignItem,t.rootDesignItem.childCount,o)),p.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([o]))}}dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){if(s.type=="signal"){s.service.setValue(i,s,e.fullName);return}let n={signal:e.fullName,target:k.property};s.propertyType==H.attribute&&(n.target=k.attribute),s.propertyType==H.cssValue&&(n.target=k.css),n.signal=e.fullName,n.twoWay=s.propertyType==H.property||s.propertyType==H.propertyAndAttribute;let l=i[0].openGroup("drop binding");for(let a of i){let c=this._bindingsHelper.serializeBinding(a.element,s.name,n);a.setAttribute(c[0],c[1])}l.commit()}};import{BindingMode as X,BindingTarget as le,PropertiesHelper as $e}from"@node-projects/web-component-designer";var oe=class r{constructor(t){this._bindingsHelper=t}_bindingsHelper;static type="visualization-binding";getBindings(t){return Array.from(this._bindingsHelper.getBindings(t.element)).map(e=>({targetName:e[1].target===le.css||e[1].target===le.attribute?$e.camelToDashCase(e[0]):e[0],target:e[1].target,mode:e[1].twoWay?X.twoWay:X.oneWay,invert:e[1].inverted,bindableObjectNames:e[1].signal.split(";"),expression:e[1].expression,expressionTwoWay:e[1].expressionTwoWay,converter:e[1].converter,type:r.type,service:this,changedEvents:e[1].events,historic:e[1].historic,writeBackSignal:e[1].writeBackSignal}))}setBinding(t,s){let e={signal:s.bindableObjectNames.join(";"),target:s.target};e.inverted=s.invert,e.twoWay=s.mode==X.twoWay,e.expression=s.expression,e.expressionTwoWay=s.expressionTwoWay,e.historic=s.historic,e.type=s.type,e.converter=s.converters,e.target=s.target,e.events=s.changedEvents;let i=this._bindingsHelper.serializeBinding(t.element,s.targetName,e),n=t.openGroup("edit_binding");return t.setAttribute(i[0],i[1]),n.commit(),!0}clearBinding(t,s,e){let i=this._bindingsHelper.getBindingAttributeName(t.element,s,e);return t.removeAttribute(i),!0}};var ce=class{getRefactorings(t){let s=[];for(let e of t){let i=e.serviceContainer.bindingService.getBindings(e);if(i)for(let n of i)for(let l of n.bindableObjectNames){let a="signal",c="";if(l.includes(":")){let o=l.split(":")[0],p=l.substring(o.length+1);p.startsWith("?")&&(p=p.substring(1),c="?",a="property",p.startsWith("?")&&(p=p.substring(1),c="??")),s.push({service:this,name:p,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName+" - "+o+":",shortName:o,prefix:c})}else l.startsWith("?")&&(l=l.substring(1),c="?",a="property",l.startsWith("?")&&(l=l.substring(1),c="??")),s.push({service:this,name:l,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName,prefix:c})}}return s}refactor(t,s,e){let i=t.sourceObject;t.shortName?i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.shortName+":"+t.prefix+s?t.shortName+":"+t.prefix+e:n):i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.prefix+s?t.prefix+e:n),t.designItem.serviceContainer.bindingService.setBinding(t.designItem,i)}};var pe=class{dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){s.service.setValue(i,s,e.text)}};import{BindingTarget as b}from"@node-projects/web-component-designer";var ue=class{getRefactorings(t){let s=[];for(let e of t)for(let i of e.attributes())if(i[0][0]=="@"){let n=i[1];if(n[0]=="{"){let l=JSON.parse(n);if("commands"in l)for(let a of l.commands){for(let c in a){let o=a[c];if(o!=null&&typeof o=="object"){let p=o;if(p.source==="signal")s.push({name:p.name,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+c+"[signal]",refactor:m=>p.name=m});else if(p.source==="property")s.push({name:p.name,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+c+"[property]",refactor:m=>p.name=m});else if(p.source==="complexString")for(let m of p.name.matchAll(/\{(.*?)\}/g)){let d=m[0],h=m[1];if(h[0]==="?"){let u="?";h=h.substring(1),h[0]==="?"&&(u="??",h=h.substring(1)),s.push({name:h,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+c+"[complexString]->property",refactor:g=>p.name=p.name.replace(d,"{"+u+g+"}")})}else s.push({name:h,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:a.type+"/"+i[0].substring(1)+"/"+c+"[complexString]->signal",refactor:u=>p.name=p.name.replace(d,"{"+u+"}")})}}}switch(a.type){case"SetSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"ToggleSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"IncrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"DecrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"SetBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"ClearBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"ToggleBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"OpenScreen":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.screen=c});break;case"OpenDialog":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.screen=c});break;case"CalculateSignalValue":a.targetSignal&&typeof a.targetSignal=="string"&&s.push({name:a.targetSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/targetSignal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.targetSignal=c});break;case"SubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"UnsubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.signal=c});break;case"ShowMessageBox":a.resultSignal&&typeof a.resultSignal=="string"&&s.push({name:a.resultSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/resultSignal",service:this,designItem:e,type:"script",sourceObject:l,refactor:c=>a.resultSignal=c});break}}else"blocks"in l;if("parameters"in l)for(let a in l.parameters)typeof l.parameters[a]=="string"&&s.push({name:l.parameters[a],itemType:"parameter",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:l,display:i[0].substring(1)+"/parameters/"+a,refactor:c=>l.parameters[a]=c})}}return s}refactor(t,s,e){t.refactor(e);let i=JSON.stringify(t.sourceObject);t.designItem.setAttribute(t.targetName,i)}};import{BasePropertyEditor as qe}from"@node-projects/web-component-designer";var de=class extends qe{_ip;_container;constructor(t,s){super(t),this._container=document.createElement("div"),this._container.style.display="flex",this._ip=document.createElement("input"),this._ip.onchange=i=>this._valueChanged(this._ip.value),this._ip.onfocus=i=>{this._ip.selectionStart=0,this._ip.selectionEnd=this._ip.value?.length},this._container.appendChild(this._ip);let e=document.createElement("button");e.textContent="...",e.onclick=async()=>{let i=s.createBindableObjectBrowser();i.initialize(this.designItems[0].serviceContainer,this.designItems[0].instanceServiceContainer,"property"),i.title="select signal...";let n=new AbortController;i.objectDoubleclicked.on(()=>{n.abort(),this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value)}),await s.openConfirmation(i,{x:100,y:100,width:400,height:300,abortSignal:n.signal})&&(this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value))},this._container.appendChild(e),this.element=this._container}refreshValue(t,s){s==null?this._ip.value="":this._ip.value=s}};export{re as BindableObjectDragDropService,D as BindingsEditor,E as BindingsEditorHistoric,te as BindingsHelper,C as BlocklyScriptEditor,P as EventAssignment,O as ParameterEditor,pe as PropertyGridDragDropService,se as Script,ue as ScriptRefactorService,ne as ScriptSystem,de as SignalPropertyEditor,I as SimpleScriptEditor,ce as VisualizationBindingsRefactorService,oe as VisualizationBindingsService,ie as VisualizationEventsService,j as VisualizationPropertyGrid,B as bindingPrefixAttribute,R as bindingPrefixClass,w as bindingPrefixContent,V as bindingPrefixCss,A as bindingPrefixCssVar,He as bindingPrefixInsideCss,Fe as bindingPrefixInsideCssVarName,S as bindingPrefixProperty,F as bindingPrefixVisible,Ut as bindingsInCssRegex,M as cyclicAttributeName,G as generateEventCodeFromBlockly,L as getNestedProperty,z as isLit,U as parseBindingString};
 //!varname => inverted

package/dist/index.d.ts

@@ -23,3 +23,4 @@ export * from './services/VisualizationBindingsRefactorService.js';
 export * from './services/PropertyGridDragDropService.js';
 export * from './services/ScriptRefactorService.js';
 export * from './services/SignalPropertyEditor.js';
+export * from './services/VisualizationEventsService.js';

package/dist/index.js

@@ -18,4 +18,5 @@ export * from './services/VisualizationBindingsRefactorService.js';
 export * from './services/PropertyGridDragDropService.js';
 export * from './services/ScriptRefactorService.js';
 export * from './services/SignalPropertyEditor.js';
+export * from './services/VisualizationEventsService.js';
 //export * from './setupVisuService.js';

package/dist/scripting/ScriptSystem.d.ts

@@ -25,4 +25,7 @@ export declare class ScriptSystem {
     getSignalName(name: string, outerContext: contextType): string;
     createScriptContext(root: HTMLElement, event: Event, element: Element, parameters: Record<string, any>, relativeSignalsPath: string): any;
     assignAllScripts(source: string, javascriptCode: string, shadowRoot: ShadowRoot, instance: HTMLElement, visualizationHandler: VisualizationHandler, contextCreator?: (root: HTMLElement, event: Event, element: Element, parameters: Record<string, any>, relativeSignalsPath: string) => any, assignExternalScript?: (element: Element, event: string, scriptData: any) => void, runInitalization?: (jsObject: VisualisationElementScript) => void): Promise<VisualisationElementScript>;
+    private loadAndInitJsObject;
+    private resolveHandler;
+    private bindHandler;
 }

package/dist/scripting/ScriptSystem.js

@@ -3,6 +3,7 @@ import { generateEventCodeFromBlockly } from "../blockly/BlocklyJavascriptHelper
 import { parseBindingString } from "../helpers/BindingsHelper.js";
 import Long from 'long';
 import { ScriptUpgrades } from "./ScriptUpgrader.js";
+import { cyclicAttributeName } from "../services/VisualizationEventsService.js";
 export class ScriptSystem {
     _visualizationHandler;
     _subscriptionCallback = () => { };
@@ -475,76 +476,105 @@ export class ScriptSystem {
         return { root, event, element, parameters, relativeSignalsPath };
     }
     async assignAllScripts(source, javascriptCode, shadowRoot, instance, visualizationHandler, contextCreator, assignExternalScript, runInitalization) {
-        const allElements = shadowRoot.querySelectorAll('*');
         contextCreator ??= this.createScriptContext;
-        let jsObject = null;
-        if (javascriptCode) {
-            try {
-                const scriptUrl = URL.createObjectURL(new Blob([javascriptCode], { type: 'application/javascript' }));
-                jsObject = await import(scriptUrl);
-                if (runInitalization)
-                    runInitalization(jsObject);
-                else {
-                    if (jsObject.init) {
-                        jsObject.init(instance, shadowRoot);
+        const jsObject = await this.loadAndInitJsObject(source, javascriptCode, shadowRoot, instance, runInitalization);
+        for (const element of shadowRoot.querySelectorAll('*')) {
+            for (const attr of element.attributes) {
+                if (attr.name[0] !== '@')
+                    continue;
+                try {
+                    const evtName = attr.name.substring(1);
+                    const script = attr.value.trim();
+                    const isCyclic = evtName.startsWith(cyclicAttributeName);
+                    const interval = isCyclic ? parseInt(evtName.substring(evtName.indexOf(':') + 1)) : null;
+                    const handler = await this.resolveHandler(script, jsObject, element, shadowRoot, instance, visualizationHandler, contextCreator, assignExternalScript, evtName);
+                    if (handler) {
+                        this.bindHandler(element, evtName, isCyclic, interval, handler);
                     }
                 }
+                catch (err) {
+                    console.warn('error assigning script', element, attr);
+                }
+            }
+        }
+        return jsObject;
+    }
+    // --- Hilfsmethoden ---
+    async loadAndInitJsObject(source, javascriptCode, shadowRoot, instance, runInitalization) {
+        if (!javascriptCode)
+            return null;
+        try {
+            const scriptUrl = URL.createObjectURL(new Blob([javascriptCode], { type: 'application/javascript' }));
+            const jsObject = await import(scriptUrl);
+            if (runInitalization) {
+                runInitalization(jsObject);
             }
-            catch (err) {
-                console.error('error parsing javascript - ' + source, err);
+            else {
+                jsObject.init?.(instance, shadowRoot);
             }
+            return jsObject;
         }
-        for (let e of allElements) {
-            for (let a of e.attributes) {
-                if (a.name[0] == '@') {
-                    try {
-                        let evtName = a.name.substring(1);
-                        let script = a.value.trim();
-                        if (script[0] == '{') {
-                            let scriptObj = JSON.parse(script);
-                            if ('commands' in scriptObj) {
-                                e.addEventListener(evtName, (evt) => this.execute(scriptObj.commands, contextCreator(instance, evt, e, scriptObj.parameters, scriptObj.relativeSignalsPath)));
-                            }
-                            else if ('blocks' in scriptObj) {
-                                let compiledFunc = null;
-                                e.addEventListener(evtName, async (evt) => {
-                                    if (!compiledFunc)
-                                        compiledFunc = await generateEventCodeFromBlockly(scriptObj);
-                                    compiledFunc(evt, shadowRoot, scriptObj.parameters, scriptObj.relativeSignalsPath ?? '', visualizationHandler, contextCreator(instance, evt, e, scriptObj.parameters, scriptObj.relativeSignalsPath));
-                                });
-                            }
-                            else {
-                                if (assignExternalScript)
-                                    assignExternalScript(e, evtName, scriptObj);
-                                else {
-                                    if ('name' in scriptObj) {
-                                        //@ts-ignore
-                                        const nm = scriptObj.name;
-                                        e.addEventListener(evtName, (evt) => {
-                                            if (!jsObject[nm])
-                                                console.warn('javascript function named: ' + nm + ' not found, maybe missing a "export" ?');
-                                            else
-                                                jsObject[nm](evt, e, shadowRoot, instance, scriptObj.parameters);
-                                        });
-                                    }
-                                }
-                            }
-                        }
-                        else {
-                            e.addEventListener(evtName, (evt) => {
-                                if (!jsObject[script])
-                                    console.warn('javascript function named: ' + script + ' not found, maybe missing a "export" ?');
-                                else
-                                    jsObject[script](evt, e, shadowRoot, instance);
-                            });
-                        }
-                    }
-                    catch (err) {
-                        console.warn('error assigning script', e, a);
-                    }
+        catch (err) {
+            console.error('error parsing javascript - ' + source, err);
+            return null;
+        }
+    }
+    // Gibt eine normalisierte Handler-Funktion (evt) => void zurück
+    async resolveHandler(script, jsObject, element, shadowRoot, instance, visualizationHandler, contextCreator, assignExternalScript, evtName) {
+        // Plain-String: direkte Referenz auf eine JS-Funktion
+        if (script[0] !== '{') {
+            return (evt) => {
+                if (!jsObject?.[script]) {
+                    console.warn(`javascript function named: "${script}" not found, maybe missing a "export" ?`);
                 }
+                else {
+                    jsObject[script](evt, element, shadowRoot, instance);
+                }
+            };
+        }
+        const scriptObj = JSON.parse(script);
+        // commands-Script
+        if ('commands' in scriptObj) {
+            return (evt) => this.execute(scriptObj.commands, contextCreator(instance, evt, element, scriptObj.parameters, scriptObj.relativeSignalsPath));
+        }
+        // Blockly-Script
+        if ('blocks' in scriptObj) {
+            let compiledFunc = null;
+            return async (evt) => {
+                compiledFunc ??= await generateEventCodeFromBlockly(scriptObj);
+                compiledFunc(evt, shadowRoot, scriptObj.parameters, scriptObj.relativeSignalsPath ?? '', visualizationHandler, contextCreator(instance, evt, element, scriptObj.parameters, scriptObj.relativeSignalsPath));
+            };
+        }
+        // Externes Script oder benannte JS-Funktion
+        if ('name' in scriptObj) {
+            if (assignExternalScript) {
+                assignExternalScript(element, evtName, scriptObj);
+                return null; // wird extern verwaltet
             }
+            const nm = scriptObj.name;
+            return (evt) => {
+                if (!jsObject?.[nm]) {
+                    console.warn(`javascript function named: "${nm}" not found, maybe missing a "export" ?`);
+                }
+                else {
+                    jsObject[nm](evt, element, shadowRoot, instance, scriptObj.parameters);
+                }
+            };
         }
-        return jsObject;
+        return null;
+    }
+    bindHandler(element, evtName, isCyclic, interval, handler) {
+        if (!isCyclic) {
+            element.addEventListener(evtName, handler);
+            return;
+        }
+        const intervalId = setInterval(() => {
+            if (!element.isConnected) {
+                clearInterval(intervalId);
+            }
+            else {
+                handler(null);
+            }
+        }, interval);
     }
 }

package/dist/services/VisualizationEventsService.d.ts

@@ -0,0 +1,7 @@
+import { EventsService, IDesignItem, IEvent } from "@node-projects/web-component-designer";
+export declare const cyclicAttributeName = "cyclic";
+export declare class VisualizationEventsService extends EventsService {
+    static _cyclicEvent: IEvent[];
+    getPossibleEvents(designItem: IDesignItem): IEvent[];
+    getEvent(designItem: IDesignItem, name: string): IEvent;
+}

package/dist/services/VisualizationEventsService.js

@@ -0,0 +1,24 @@
+import { EventsService, } from "@node-projects/web-component-designer";
+export const cyclicAttributeName = 'cyclic';
+export class VisualizationEventsService extends EventsService {
+    static _cyclicEvent = [
+        {
+            name: `${cyclicAttributeName}:100`,
+            propertyName: undefined,
+            eventObjectName: "Event",
+            description: "this event will retrigger itself every 100 ms",
+        },
+    ];
+    getPossibleEvents(designItem) {
+        let events = super.getPossibleEvents(designItem);
+        events.push(...VisualizationEventsService._cyclicEvent);
+        return events;
+    }
+    getEvent(designItem, name) {
+        if (name.includes(cyclicAttributeName)) {
+            let evt = VisualizationEventsService._cyclicEvent.find((x) => x.name == name);
+            return (evt ?? { name, propertyName: "on" + name, eventObjectName: "Event" });
+        }
+        return super.getEvent(designItem, name);
+    }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "description": "web-component-designer addon for visualizations",
   "name": "@node-projects/web-component-designer-visualization-addons",
-  "version": "0.1.140",
+  "version": "0.1.141",
   "type": "module",
   "main": "./dist/index.js",
   "author": "jochen.kuehner@gmx.de",