@node-projects/web-component-designer-visualization-addons 0.1.144 → 0.1.146

package/dist/index-min.js

@@ -1,12 +1,12 @@
-Blockly.Blocks.console={init:function(){this.appendDummyInput().appendField("console").appendField(new Blockly.FieldDropdown([["debug","DEBUG"],["error","ERROR"],["info","INFO"],["log","LOG"],["warn","WARN"]]),"LEVEL"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.console=function(n,t){var s=n.getFieldValue("LEVEL");let e=Blockly.JavaScript.valueToCode(n,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`console['${s.toLowerCase()}'](${e});
-`};Blockly.Blocks.debugger={init:function(){this.appendDummyInput().appendField("debugger"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.debugger=function(n){return`debugger;
-`};Blockly.Blocks.delay={init:function(){this.appendValueInput("DELAY").setCheck("Number").appendField("delay"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.delay=function(n){return"await delay("+Blockly.JavaScript.valueToCode(n,"DELAY",Blockly.JavaScript.ORDER_ATOMIC)+`);
-`};Blockly.Blocks.get_parameter={init:function(){this.appendValueInput("NAME").setCheck("String").appendField("get_parameter"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_parameter=function(n,t){return[`context.parameters[${Blockly.JavaScript.valueToCode(n,"NAME",Blockly.JavaScript.ORDER_ATOMIC)}]`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_state={init:function(){this.appendValueInput("OID").setCheck("String").appendField("get_state"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_state=function(n,t){let s=Blockly.JavaScript.valueToCode(n,"OID",Blockly.JavaScript.ORDER_ATOMIC);return[`(await visualizationHandler.getState((${s}[0] === '.' ? relativeSignalsPath : '') + ${s})).val`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_sub_property={init:function(){this.appendDummyInput().appendField("getSubProperty"),this.appendValueInput("OBJECT").setCheck("Object").appendField("object"),this.appendValueInput("PROPERTYPATH").setCheck("String").appendField("propertypath"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_sub_property=function(n,t){let s=Blockly.JavaScript.valueToCode(n,"OBJECT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(n,"PROPERTYPATH",Blockly.JavaScript.ORDER_ATOMIC);return[`extractPart(${s}, ${e})`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.open_screen={init:function(){this.appendDummyInput().appendField("open screen"),this.appendValueInput("SCREEN").setCheck("String").appendField("screen"),this.appendValueInput("RELATIVESIGNALSPATH").setCheck("String").appendField("relativeSignalsPath"),this.appendValueInput("NOHISTORY").setCheck("Boolean").appendField("noHistory"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.open_screen=function(n){let t=Blockly.JavaScript.valueToCode(n,"SCREEN",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(n,"RELATIVESIGNALSPATH",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(n,"NOHISTORY",Blockly.JavaScript.ORDER_ATOMIC);return`RUNTIME.openScreen({screen: ${t}, relativeSignalsPath: ${s}, noHistory: ${e}})`};Blockly.Blocks.query_selector={init:function(){this.appendDummyInput().appendField("querySelector").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Element"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector=function(n,t){var s=n.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(n,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelector(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.host.getRootNode().querySelector(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.query_selector_all={init:function(){this.appendDummyInput().appendField("querySelectorAll").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Array"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector_all=function(n,t){var s=n.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(n,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelectorall(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.querySelectorall(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.set_element={init:function(){this.appendDummyInput().appendField("setElement").appendField(new Blockly.FieldDropdown([["property","PROPERTY"],["attribute","ATTRIBUTE"],["style","STYLE"]]),"TARGET"),this.appendValueInput("ELEMENT").setCheck("Element").appendField("element"),this.appendValueInput("NAME").setCheck("String").appendField("name"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.set_element=function(n){var t=n.getFieldValue("TARGET");let s=Blockly.JavaScript.valueToCode(n,"ELEMENT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(n,"NAME",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(n,"VALUE",Blockly.JavaScript.ORDER_ATOMIC),r="";return t==="PROPERTY"?r+=s+"["+e+"] = "+i+`;
-`:t==="ATTRIBUTE"?r+=s+".setAttribute("+e+", "+i+`);
-`:t==="STYLE"&&(r+=s+".style["+e+"] = "+i+`;
-`),r};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(n){let t=Blockly.JavaScript.valueToCode(n,"OID",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(n,"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(n){return Blockly.JavaScript.getVariableName(n.getField("EVENTVAR").variable.name)+` = eventData;
-`};var ge=`function extractPart(obj, propertyPath) {
+Blockly.Blocks.console={init:function(){this.appendDummyInput().appendField("console").appendField(new Blockly.FieldDropdown([["debug","DEBUG"],["error","ERROR"],["info","INFO"],["log","LOG"],["warn","WARN"]]),"LEVEL"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.console=function(o,t){var s=o.getFieldValue("LEVEL");let e=Blockly.JavaScript.valueToCode(o,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`console['${s.toLowerCase()}'](${e});
+`};Blockly.Blocks.debugger={init:function(){this.appendDummyInput().appendField("debugger"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.debugger=function(o){return`debugger;
+`};Blockly.Blocks.delay={init:function(){this.appendValueInput("DELAY").setCheck("Number").appendField("delay"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.delay=function(o){return"await delay("+Blockly.JavaScript.valueToCode(o,"DELAY",Blockly.JavaScript.ORDER_ATOMIC)+`);
+`};Blockly.Blocks.get_parameter={init:function(){this.appendValueInput("NAME").setCheck("String").appendField("get_parameter"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_parameter=function(o,t){return[`context.parameters[${Blockly.JavaScript.valueToCode(o,"NAME",Blockly.JavaScript.ORDER_ATOMIC)}]`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_state={init:function(){this.appendValueInput("OID").setCheck("String").appendField("get_state"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_state=function(o,t){let s=Blockly.JavaScript.valueToCode(o,"OID",Blockly.JavaScript.ORDER_ATOMIC);return[`(await visualizationHandler.getState((${s}[0] === '.' ? relativeSignalsPath : '') + ${s})).val`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_sub_property={init:function(){this.appendDummyInput().appendField("getSubProperty"),this.appendValueInput("OBJECT").setCheck("Object").appendField("object"),this.appendValueInput("PROPERTYPATH").setCheck("String").appendField("propertypath"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_sub_property=function(o,t){let s=Blockly.JavaScript.valueToCode(o,"OBJECT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(o,"PROPERTYPATH",Blockly.JavaScript.ORDER_ATOMIC);return[`extractPart(${s}, ${e})`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.open_screen={init:function(){this.appendDummyInput().appendField("open screen"),this.appendValueInput("SCREEN").setCheck("String").appendField("screen"),this.appendValueInput("RELATIVESIGNALSPATH").setCheck("String").appendField("relativeSignalsPath"),this.appendValueInput("NOHISTORY").setCheck("Boolean").appendField("noHistory"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.open_screen=function(o){let t=Blockly.JavaScript.valueToCode(o,"SCREEN",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(o,"RELATIVESIGNALSPATH",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(o,"NOHISTORY",Blockly.JavaScript.ORDER_ATOMIC);return`RUNTIME.openScreen({screen: ${t}, relativeSignalsPath: ${s}, noHistory: ${e}})`};Blockly.Blocks.query_selector={init:function(){this.appendDummyInput().appendField("querySelector").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Element"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector=function(o,t){var s=o.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(o,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelector(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.host.getRootNode().querySelector(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.query_selector_all={init:function(){this.appendDummyInput().appendField("querySelectorAll").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Array"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector_all=function(o,t){var s=o.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(o,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelectorall(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.querySelectorall(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.set_element={init:function(){this.appendDummyInput().appendField("setElement").appendField(new Blockly.FieldDropdown([["property","PROPERTY"],["attribute","ATTRIBUTE"],["style","STYLE"]]),"TARGET"),this.appendValueInput("ELEMENT").setCheck("Element").appendField("element"),this.appendValueInput("NAME").setCheck("String").appendField("name"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.set_element=function(o){var t=o.getFieldValue("TARGET");let s=Blockly.JavaScript.valueToCode(o,"ELEMENT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(o,"NAME",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(o,"VALUE",Blockly.JavaScript.ORDER_ATOMIC),n="";return t==="PROPERTY"?n+=s+"["+e+"] = "+i+`;
+`:t==="ATTRIBUTE"?n+=s+".setAttribute("+e+", "+i+`);
+`: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(o){let t=Blockly.JavaScript.valueToCode(o,"OID",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(o,"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(o){return Blockly.JavaScript.getVariableName(o.getField("EVENTVAR").variable.name)+` = eventData;
+`};var Se=`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) {
-`,ye="}";async function G(n){let t=new Blockly.Workspace;Blockly.serialization.workspaces.load(n,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([ge+s+ye],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as fe,html as ve,css as be}from"@node-projects/base-custom-webcomponent";var C=class n extends fe{static template=ve`
+`,_e="}";async function Y(o){let t=new Blockly.Workspace;Blockly.serialization.workspaces.load(o,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([Se+s+_e],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as ke,html as Te,css as Ce}from"@node-projects/base-custom-webcomponent";var E=class o extends ke{static template=Te`
         <div id="blocklyDiv" style="position: absolute; width: 100%; height: 100%;"></div>
-    `;static style=be`
+    `;static style=Ce`
         :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.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}}),n.blocklyStyle1||(n.blocklyStyle1=new CSSStyleSheet,n.blocklyStyle1.replaceSync(document.getElementById("blockly-renderer-style-"+t+"-"+s).innerText),n.blocklyStyle2=new CSSStyleSheet,n.blocklyStyle2.replaceSync(document.getElementById("blockly-common-style").innerText)),this.shadowRoot.adoptedStyleSheets=[n.blocklyStyle1,n.blocklyStyle2,n.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 Se,html as _e,css as Te}from"@node-projects/base-custom-webcomponent";import{BindingMode as Ce,BindingTarget as $}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as xe,html as we,css as ke}from"@node-projects/base-custom-webcomponent";var E=class extends xe{static template=we`
+        }`;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}}),o.blocklyStyle1||(o.blocklyStyle1=new CSSStyleSheet,o.blocklyStyle1.replaceSync(document.getElementById("blockly-renderer-style-"+t+"-"+s).innerText),o.blocklyStyle2=new CSSStyleSheet,o.blocklyStyle2.replaceSync(document.getElementById("blockly-common-style").innerText)),this.shadowRoot.adoptedStyleSheets=[o.blocklyStyle1,o.blocklyStyle2,o.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(E.is,E);import{BaseCustomWebComponentConstructorAppend as Ie,html as Oe,css as Ve}from"@node-projects/base-custom-webcomponent";import{BindingMode as Re,BindingTarget as Z}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as Ee,html as Ne,css as Be}from"@node-projects/base-custom-webcomponent";var N=class extends Ee{static template=Ne`
         <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=ke`
+        <input type="text" value="{{?this.historic.instance}}" style="position:absolute;left:104px;top:419px;width:155px;">`;static style=Be`
         :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 Se{static template=_e`
+        }`;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(N.is,N);var P=class extends Ie{static template=Oe`
         <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=Te`
+        </div>`;static style=Ve`
         :host {
             box-sizing: border-box;
         }
@@ -256,53 +256,573 @@ 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,r,o,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=r,this._shell=o,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==Ce.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,r,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=r,a?.namedConverters||(this._getDomElement("namedConverterInput").style.display="none")}ready(){if(this._parseAttributesToProperties(),this._assignEvents(),this.twoWayPossible=!1,(this._bindingTarget==Z.property||this._bindingTarget==Z.attribute)&&(this.twoWayPossible=!0),this._binding){if(this.twoWay=this._binding.mode==Re.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 Ne,css as Oe,html as Ie}from"@node-projects/base-custom-webcomponent";import{ContextMenu as Y}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as Z}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 Ee}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as q}from"@node-projects/web-component-designer-codeview-monaco";var j=class extends Ee{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;async getEditorForType(t,s,e,i,r){if(this.getSpecialEditorForType){let o=await this.getSpecialEditorForType(t,s,e,i,r);if(o)return o}switch(t.format){case"screen":{let o=document.createElement("select");o.style.width="100%";let a=document.createElement("option");a.value=s??"",a.innerText=s??"",o.appendChild(a);for(let l of await this.visualizationHandler.getAllNames("screen")){if(l==s)continue;let c=document.createElement("option");c.value=l,c.innerText=l,o.appendChild(c)}return o.onchange=()=>{this.setPropertyValue(e,o.value)},o.value=s,o}case"signal":{let o=document.createElement("div");o.style.display="flex";let a=document.createElement("input");a.value=s??"",a.style.flexGrow="1",a.style.width="0",a.onchange=c=>this.setPropertyValue(e,a.value),a.onfocus=c=>{a.selectionStart=0,a.selectionEnd=a.value?.length},o.appendChild(a);let l=document.createElement("button");return l.textContent="...",l.onclick=async()=>{let c=this.visualizationShell.createBindableObjectBrowser();c.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),c.title="select signal...";let p=new AbortController;c.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(c.selectedObject),p.abort(),a.value=c.selectedObject.fullName,this.setPropertyValue(e,a.value)}),await this.visualizationShell.openConfirmation(c,{x:100,y:100,width:400,height:300,parent:this,abortSignal:p.signal})&&(a.value=c.selectedObject.fullName,this.setPropertyValue(e,a.value))},o.appendChild(l),o}case"html":case"script":{let o=document.createElement("div");o.style.boxSizing="border-box",o.style.width="100%",o.style.display="flex";let a=document.createElement("textarea");a.style.boxSizing="border-box",a.value=s??"",a.style.width="100%",a.onblur=c=>{this.setPropertyValue(e,a.value)},o.appendChild(a);let l=document.createElement("button");return l.innerHTML="...",l.style.boxSizing="border-box",l.onclick=async()=>{let c=new q,p=await q.getMonacoLib();if(t.format=="html")c.language="html";else{let m={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 N(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(P.is,P);import{BaseCustomWebComponentConstructorAppend as He,TypedEvent as Je,css as Ue,html as Ge}from"@node-projects/base-custom-webcomponent";import{ContextMenu as $e,assetsPath as ie}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as ae}from"@node-projects/propertygrid.webcomponent";import{defaultOptions as Xe}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as qe}from"wunderbaum";import Ye from"wunderbaum/dist/wunderbaum.css"with{type:"css"};import{PropertyGrid as Ae}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as K}from"@node-projects/web-component-designer-codeview-monaco";var W=class extends Ae{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;async getEditorForType(t,s,e,i,n){if(this.getSpecialEditorForType){let r=await this.getSpecialEditorForType(t,s,e,i,n);if(r)return r}switch(t.format){case"screen":{let r=document.createElement("select");r.style.width="100%";let a=document.createElement("option");a.value=s??"",a.innerText=s??"",r.appendChild(a);for(let l of await this.visualizationHandler.getAllNames("screen")){if(l==s)continue;let c=document.createElement("option");c.value=l,c.innerText=l,r.appendChild(c)}return r.onchange=()=>{this.setPropertyValue(e,r.value)},r.value=s,r}case"signal":{let r=document.createElement("div");r.style.display="flex";let a=document.createElement("input");a.value=s??"",a.style.flexGrow="1",a.style.width="0",a.onchange=c=>this.setPropertyValue(e,a.value),a.onfocus=c=>{a.selectionStart=0,a.selectionEnd=a.value?.length},r.appendChild(a);let l=document.createElement("button");return l.textContent="...",l.onclick=async()=>{let c=this.visualizationShell.createBindableObjectBrowser();c.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),c.title="select signal...";let p=new AbortController;c.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(c.selectedObject),p.abort(),a.value=c.selectedObject.fullName,this.setPropertyValue(e,a.value)}),await this.visualizationShell.openConfirmation(c,{x:100,y:100,width:400,height:300,parent:this,abortSignal:p.signal})&&(a.value=c.selectedObject.fullName,this.setPropertyValue(e,a.value))},r.appendChild(l),r}case"html":case"script":{let r=document.createElement("div");r.style.boxSizing="border-box",r.style.width="100%",r.style.display="flex";let a=document.createElement("textarea");a.style.boxSizing="border-box",a.value=s??"",a.style.width="100%",a.onblur=c=>{this.setPropertyValue(e,a.value)},r.appendChild(a);let l=document.createElement("button");return l.innerHTML="...",l.style.boxSizing="border-box",l.onclick=async()=>{let c=new K,p=await K.getMonacoLib();if(t.format=="html")c.language="html";else{let m={content:`declare global {
                             var context: { event: Event, element: Element };
-                        }`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([m]),c.language="javascript"}c.code=a.value,c.style.position="relative",await this.visualizationShell.openConfirmation(c,{x:200,y:200,width:600,height:400,parent:this})&&(a.value=c.getText(),this.setPropertyValue(e,a.value))},o.appendChild(l),o}}return super.getEditorForType(t,s,e,i,r)}};customElements.define("node-projects-visualization-property-grid",j);import"@node-projects/splitview.webcomponent";var N=class n{static upgradeScriptCommand(t){return t.type==="SetElementProperty"?n.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 O=class n extends Ne{static style=Oe`
+                        }`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([m]),c.language="javascript"}c.code=a.value,c.style.position="relative",await this.visualizationShell.openConfirmation(c,{x:200,y:200,width:600,height:400,parent:this})&&(a.value=c.getText(),this.setPropertyValue(e,a.value))},r.appendChild(l),r}}return super.getEditorForType(t,s,e,i,n)}};customElements.define("node-projects-visualization-property-grid",W);import{BaseCustomWebComponentConstructorAppend as ze,TypedEvent as Q,css as Le,html as je}from"@node-projects/base-custom-webcomponent";import{defaultOptions as We,defaultStyle as Me}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as Pe}from"wunderbaum";import Fe from"wunderbaum/dist/wunderbaum.css"with{type:"css"};function De(o){return o.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function _(o){return De(o).replace(/("(?:\\.|[^"\\])*")(\s*:)?|\b(true|false|null)\b|\b(-?\d+(?:\.\d+)?)\b/g,(s,e,i,n,r)=>e?`<span class="${i?"cs-key":"cs-str"}">${e}</span>${i??""}`:n?`<span class="cs-bool">${n}</span>`:r?`<span class="cs-num">${r}</span>`:s)}var B=class o extends ze{static style=Le`
         :host {
+            display: block;
             background: white;
         }
-        .list{
-            display: grid;
-            grid-template-columns: 1fr 40px;
-            width: calc(100% - 6px);
+
+        .root {
+            width: calc(100% - 8px);
+            height: calc(100% - 8px);
+            margin: 4px;
             box-sizing: border-box;
-            margin: 3px;
+            display: flex;
+            flex-direction: column;
         }
 
-        .list button{
-            padding: 5px 10px;
+        #filter {
+            width: 100%;
+            height: 26px;
             box-sizing: border-box;
+        }
+
+        .content {
+            flex: 1 1 auto;
+            min-height: 0;
             display: flex;
-            justify-content: center;
-            margin-right: 5px;
-            margin-left: 5px;
         }
 
-        node-projects-visualization-property-grid {
+        #commandList {
+            width: 40%;
+            overflow: auto;
+            box-sizing: border-box;
+        }
+
+        #description {
+            width: 60%;
+        }
+
+        .detail {
+            padding: 8px;
+            overflow: auto;
+            box-sizing: border-box;
+        }
+
+        .cmd-title {
+            font-size: 14px;
+            font-weight: bold;
+            color: #24405c;
+            border-bottom: 2px solid #2c6e9b;
+            padding-bottom: 4px;
+            margin-bottom: 6px;
+        }
+
+        .cmd-title .hint {
+            font-size: 11px;
+            font-weight: normal;
+            color: #808080;
+            margin-left: 6px;
+        }
+
+        .snippet {
+            font-family: Consolas, "Courier New", monospace;
+            font-size: 11px;
+            background: #f6f8fa;
+            color: #24292e;
+            border: 1px solid #e1e4e8;
+            border-radius: 4px;
+            padding: 6px 10px;
+            white-space: pre;
+            overflow-x: auto;
+            line-height: 1.5;
+        }
+
+        .cs-key  { color: #22863a; }
+        .cs-str  { color: #032f62; }
+        .cs-bool { color: #d73a49; }
+        .cs-num  { color: #e36209; }
+
+        .note {
+            font-size: 11px;
+            color: #666;
+            font-style: italic;
+            margin-top: 6px;
+        }
+
+        .toolbar {
+            display: flex;
+            align-items: center;
+            gap: 8px;
+            box-sizing: border-box;
+            flex: 0 0 auto;
             width: 100%;
-            height: 100%;
+            height: 40px;
+            padding: 4px 8px;
+            border-top: 1px solid #ccc;
+            background-color: rgb(230, 230, 230);
         }
-    `;static template=Ie`
-        <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;">
-                    <div style="width:calc(100% - 4px); height:calc(100% - 4px)">
-                        <div id="commandList" style="overflow-x: hidden; overflow-y: auto; width:100%; height: calc(100% - 34px);"></div>
-                        <div class="list">
-                            <select id="possibleCommands" style="width: 100%"></select>  
-                            <button @click="[[this.addItem()]]">Add</button>
-                        </div>
-                    </div>
-                </div>
-                <div style="width: 60%; position: relative;">
-                    <node-projects-visualization-property-grid id="propertygrid"></node-projects-visualization-property-grid>
-                </div>
-            </node-projects-split-view>
+
+        .toolbar button {
+            box-sizing: border-box;
+            padding: 6px 16px;
+            border-radius: 4px;
+            border: 1px solid #b0b0b0;
+            background: white;
+            font-size: 12px;
+            cursor: pointer;
+        }
+
+        .toolbar button:hover:not(:disabled) {
+            background: #f0f0f0;
+            border-color: #909090;
+        }
+
+        .toolbar button:active:not(:disabled) {
+            background: #e2e2e2;
+        }
+
+        .toolbar button:disabled {
+            opacity: 0.5;
+            cursor: not-allowed;
+        }
+
+        .toolbar button.primary {
+            background: #2c6e9b;
+            border-color: #2c6e9b;
+            color: white;
+        }
+
+        .toolbar button.primary:hover:not(:disabled) {
+            background: #255d83;
+            border-color: #255d83;
+        }
+
+        .toolbar button.primary:active:not(:disabled) {
+            background: #1e4d6b;
+        }
+
+        .toolbar .spacer {
+            flex: 1 1 auto;
+        }
+
+        .toolbar .hint {
+            font-size: 11px;
+            font-style: italic;
+            color: #666;
+        }
+    `;static template=je`
+        <div class="root">
+            <input id="filter" placeholder="Filter..." autocomplete="off">
+            <div class="content">
+                <div id="commandList"></div>
+                <div id="description" class="detail"></div>
+            </div>
+            <div class="toolbar">
+                <button id="addBtn" class="primary" disabled @click="[[this.addClicked()]]">Add</button>
+                <span class="hint">or drag a command into the script list</span>
+                <span class="spacer"></span>
+                <button id="closeBtn" @click="[[this.closeClicked()]]">Close</button>
+            </div>
         </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=[Ve,n.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=(r,o)=>Z(this.propertiesTypeInfo,r,o),e.showHead=!1,e.typeName="IScriptMultiplexValue",e.title='Complex for "'+s.propertyPath+'"',typeof s.value=="object"?e.selectedObject=s.value??{}:e.selectedObject={},e.bindingDoubleClicked=r=>{r.bindabletype=="property"?e.setPropertyValue("source","property"):r.bindabletype=="context"?e.setPropertyValue("source","context"):e.setPropertyValue("source","signal"),e.setPropertyValue("name",r.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)=>Z(this.scriptCommandsTypeInfo,s,e),this._propertygrid.getSpecialEditorForType=async(s,e,i,r,o)=>{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()},r.nodeElem.insertAdjacentElement("afterbegin",a);let l=document.createElement("div");l.style.display="flex";let c=document.createElement("span");e?c.innerText=(e.source??"")+": "+(e.name??""):c.innerText="",c.style.overflow="hidden",c.style.whiteSpace="nowrap",c.style.textOverflow="ellipsis",c.style.flexGrow="1",c.title=JSON.stringify(e),l.appendChild(c);let p=document.createElement("button");return p.innerText="...",p.onclick=()=>{t({value:e,propertyPath:i})},l.appendChild(p),r.nodeElem.style.display="flex",l}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})},r.nodeElem.insertAdjacentElement("afterbegin",a),r.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(s=>{Y.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=r=>(e.node.setActive(),e.node.data.contextMenu&&e.node.data.contextMenu(r,e.node.data,e.node),r.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,r)=>{Y.show([{title:"Remove Item",action:o=>r.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(O.is,O);import{BaseCustomWebComponentConstructorAppend as Ae,css as We,html as je}from"@node-projects/base-custom-webcomponent";var I=class extends Ae{static style=We`
+    `;static is="node-projects-visualization-simple-script-command-picker";_title;get title(){return this._title}set title(t){this._title=t}selectedType;commandTypeChosen=new Q;closeRequested=new Q;_tree;_filter;_descriptionDiv;_addBtn;_typeInfo;_descriptions;constructor(){super(),this._restoreCachedInititalValues(),this.shadowRoot.adoptedStyleSheets=[Fe,Me,o.style],this._descriptionDiv=this._getDomElement("description"),this._addBtn=this._getDomElement("addBtn"),this._filter=this._getDomElement("filter"),this._filter.onkeyup=()=>{let t=this._filter.value;this._tree.filterNodes(s=>new RegExp(t,"i").test(s.title),{})},this._tree=new Pe({...We,element:this._getDomElement("commandList"),icon:!1,filter:{autoExpand:!0,mode:"hide",highlight:!0},activate:t=>{this.selectedType=t.node.title,this._addBtn.disabled=!1,this._renderDescription(t.node.title)},dblclick:t=>(this.selectedType=t.node.title,this.commandTypeChosen.emit(),!1),render:t=>{t.isNew&&(t.nodeElem.oncontextmenu=s=>(s.preventDefault(),!1))},dnd:{guessDropEffect:!1,serializeClipboardData:!0,dragStart:t=>(t.event.dataTransfer.effectAllowed="copy",t.event.dataTransfer.dropEffect="copy",!0)}})}async ready(){this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents()}addClicked(){this.selectedType&&this.commandTypeChosen.emit()}closeClicked(){this.closeRequested.emit()}_renderDescription(t){let s=this._descriptions?.[t];if(s){this._descriptionDiv.innerHTML=`
+        <div class="cmd-title">${t}<span class="hint">${s.description}</span></div>
+        <pre class="snippet">${_(s.example)}</pre>
+        ${s.note?`<div class="note">${s.note}</div>`:""}
+      `;return}let e=this._typeInfo?.definitions?.[t]?.description;this._descriptionDiv.innerHTML=`
+      <div class="cmd-title">${t}</div>
+      ${e?`<div class="note">${e}</div>`:""}
+    `}loadCommands(t,s){this._typeInfo=t,this._descriptions=s??{};let e=Object.keys(t.definitions).filter(i=>t.definitions[i].type==="object"&&i!=="ScriptCommands");this._tree.root.addChildren(e.map(i=>({title:i})))}};customElements.define(B.is,B);function ee(o,t){return`<span class="cs-attr">${o}</span>='${_(t)}'`}var te=`<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8">
+<style>
+:root { --accent: #2c6e9b; }
+
+*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+html, body {
+    width: 100%;
+    height: 100%;
+    font-family: Segoe UI, Arial, sans-serif;
+    font-size: 13px;
+    color: #333;
+    background: #f0f1f3;
+}
+
+.content {
+    height: 100%;
+    overflow-y: auto;
+    padding: 10px 14px 16px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
+.intro-banner {
+    background: #ffffff;
+    border-left: 4px solid var(--accent);
+    border-radius: 4px;
+    padding: 8px 12px;
+    font-size: 12px;
+    line-height: 1.5;
+}
+
+.intro-banner code {
+    font-family: Consolas, monospace;
+    background: #eef2f6;
+    padding: 1px 4px;
+    border-radius: 3px;
+    color: #2c4a68;
+}
+
+.content-section {
+    background: #ffffff;
+    border-radius: 6px;
+    padding: 8px 10px 10px;
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+}
+
+.section-title {
+    display: flex;
+    align-items: baseline;
+    gap: 8px;
+    border-bottom: 2px solid var(--accent);
+    font-size: 13px;
+    font-weight: bold;
+    padding-bottom: 4px;
+    color: #24405c;
+}
+
+.section-num {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: var(--accent);
+    color: white;
+    font-size: 10px;
+    font-weight: bold;
+    flex-shrink: 0;
+}
+
+.section-hint {
+    font-size: 11px;
+    font-weight: normal;
+    color: #808080;
+}
+
+.snippet {
+    font-family: Consolas, "Courier New", monospace;
+    font-size: 11px;
+    background: #f6f8fa;
+    color: #24292e;
+    border: 1px solid #e1e4e8;
+    border-radius: 4px;
+    padding: 6px 10px;
+    white-space: pre;
+    overflow-x: auto;
+    line-height: 1.5;
+}
+
+.cs-attr    { color: #005cc5; }
+.cs-key     { color: #22863a; }
+.cs-str     { color: #032f62; }
+.cs-bool    { color: #d73a49; }
+.cs-num     { color: #e36209; }
+.cs-comment { color: #6a737d; font-style: italic; }
+
+.note {
+    font-size: 11px;
+    color: #666;
+    font-style: italic;
+}
+</style>
+</head>
+<body>
+<div class="content">
+
+    <div class="intro-banner">
+        Events (<code>@click</code>, <code>@change</code>, ...) run a command chain (a <code>Script</code>).<br>
+        General syntax: <code>@event='{"commands":[ {...}, {...} ]}'</code> \u2014 commands run top to bottom.
+    </div>
+
+    <div class="content-section">
+        <div class="section-title"><span class="section-num">1</span> Basic structure <span class="section-hint">commands array, sequential execution</span></div>
+        <pre class="snippet">${ee("@click",`{"commands":[
+  { "type": "SetSignalValue", "signal": ".Some.Signal", "value": true },
+  { "type": "SetSignalValue", "signal": ".Some.Other", "value": false }
+]}`)}</pre>
+        <div class="note">Commands run top to bottom. Some commands (Condition, Label, Goto, Repeat, Exit) can change that flow \u2014 see their own descriptions in the "Add Command" dialog.</div>
+    </div>
+
+    <div class="content-section">
+        <div class="section-title"><span class="section-num">2</span> Dynamic / indirect values <span class="section-hint">IScriptMultiplexValue</span></div>
+        <div class="note">Instead of a plain value, most command values can be an object <code>{ "source": ..., "name": ... }</code> that is resolved at runtime.</div>
+        <pre class="snippet">${_('{ "source": "expression", "name": "ctx.event.srcElement.value" }')}  <span class="cs-comment">// js expression, 'ctx' is the context object</span>
+${_('{ "source": "complexString", "name": "prefix-{.Some.Signal}-suffix" }')}  <span class="cs-comment">// signal names in {}</span>
+${_('{ "source": "parameter", "name": "myParam" }')}  <span class="cs-comment">// a parameter handed into the script</span></pre>
+        <div class="note">Other sources: signal, property, signalInProperty, event, complexSignal, context, elementProperty. The property grid's "..." button opens an editor for these.</div>
+    </div>
+
+    <div class="content-section">
+        <div class="section-title"><span class="section-num">3</span> Cyclic events <span class="section-hint">re-triggering timer event</span></div>
+        <pre class="snippet">${ee("@cyclic:100",`{"commands":[
+  { "type": "SetSignalValue", "signal": ".Local.Tick", "value": true }
+]}`)}</pre>
+        <div class="note">A <code>@cyclic:&lt;ms&gt;</code> event retriggers itself automatically every &lt;ms&gt; milliseconds.</div>
+    </div>
+</div>
+</body>
+</html>`;var se={Comment:{description:"has no effect on script execution",example:'{ "type": "Comment", "comment": "explains the next step" }'},OpenScreen:{description:"navigate to a screen (with history)",example:'{ "type": "OpenScreen", "screen": "MyScreen" }'},OpenDialog:{description:"open a screen as a movable/closable dialog",example:`{ "type": "OpenDialog", "screen": "MyScreen", "title": "My Dialog",
+  "moveable": true, "closeable": true }`},CloseDialog:{description:"close the parent dialog this command runs in",example:'{ "type": "CloseDialog" }'},OpenUrl:{description:"open an URL, optionally as an in-app dialog",example:'{ "type": "OpenUrl", "url": "https://example.com", "target": "_blank", "openInDialog": false }'},ShowMessageBox:{description:"ask the user to confirm before continuing",example:`{ "type": "ShowMessageBox", "title": "Confirm", "message": "Are you sure?",
+  "messageType": "warning", "buttons": "yesNo", "resultSignal": ".Local.Result",
+  "exitScriptOnCancel": true }`,note:"exitScriptOnCancel: true stops the chain when the user picks a negative button."},ShowPrompt:{description:"ask the user for text input",example:`{ "type": "ShowPrompt", "title": "Name?", "message": "Enter a name",
+  "resultSignal": ".Local.Name", "exitScriptOnCancel": true }`},SetSignalValue:{description:"write a signal / property",example:'{ "type": "SetSignalValue", "signal": ".Some.Signal", "value": true }',note:'target: "signal" (default) | "property" (a screen/control property) | "elementProperty" (a property of the element raising the event).'},ToggleSignalValue:{description:"toggle a boolean signal / property",example:'{ "type": "ToggleSignalValue", "signal": ".Some.Toggle" }'},ToggleSignalValueThroughList:{description:"cycle a signal / property through a fixed list of values",example:'{ "type": "ToggleSignalValueThroughList", "signal": ".Some.Mode", "valueList": [1, 2, 3] }'},IncrementSignalValue:{description:"increment a numeric signal / property",example:'{ "type": "IncrementSignalValue", "signal": ".Some.Counter", "value": 1 }'},DecrementSignalValue:{description:"decrement a numeric signal / property",example:'{ "type": "DecrementSignalValue", "signal": ".Some.Counter", "value": 1 }'},CalculateSignalValue:{description:"calculate a new signal value from a formula",example:`{ "type": "CalculateSignalValue", "targetSignal": ".Some.Result",
+  "formula": "{adapter.0.level} * 100 + 30" }`,note:"The formula can reference other signals in curly braces: {signalName}."},SetBitInSignal:{description:"set a single bit (by number) in a signal / property",example:'{ "type": "SetBitInSignal", "signal": ".Some.Bits", "bitNumber": 3 }'},ClearBitInSignal:{description:"clear a single bit (by number) in a signal / property",example:'{ "type": "ClearBitInSignal", "signal": ".Some.Bits", "bitNumber": 3 }'},ToggleBitInSignal:{description:"toggle a single bit (by number) in a signal / property",example:'{ "type": "ToggleBitInSignal", "signal": ".Some.Bits", "bitNumber": 3 }'},Javascript:{description:"run a JavaScript snippet",example:'{ "type": "Javascript", "script": "console.log(context.element)" }',note:"context: { event, element, shadowRoot, instance }."},SetElementProperty:{description:"set a property/attribute/CSS value/class on matching elements",example:`{ "type": "SetElementProperty", "target": "property", "targetSelectorTarget": "container",
+  "targetSelector": ".my-class", "name": "disabled", "value": true }`,note:'target: "property" (default) | "attribute" | "css" | "class". targetSelectorTarget: "container" (screen/customControl, default) | "element" (current element).'},Delay:{description:"pause the script chain",example:'{ "type": "Delay", "value": 500 }'},Console:{description:"write a message to the browser console",example:'{ "type": "Console", "target": "log", "message": "done" }',note:'target: "log" (default) | "info" | "debug" | "warn" | "error".'},SwitchLanguage:{description:"switch the active UI language",example:'{ "type": "SwitchLanguage", "language": "en" }'},Login:{description:"log a user in",example:'{ "type": "Login", "username": "user", "password": "pass" }'},Logout:{description:"log the current user out",example:'{ "type": "Logout" }'},SubscribeSignal:{description:"subscribe to a signal so its updates are pushed to the client",example:'{ "type": "SubscribeSignal", "signal": ".Some.Signal", "oneTime": false }'},UnsubscribeSignal:{description:"unsubscribe from a previously subscribed signal",example:'{ "type": "UnsubscribeSignal", "signal": ".Some.Signal" }'},WriteSignalsInGroup:{description:"write all pending signal values of a named group",example:'{ "type": "WriteSignalsInGroup", "group": "MyGroup" }'},ClearSignalsInGroup:{description:"clear all pending signal values of a named group",example:'{ "type": "ClearSignalsInGroup", "group": "MyGroup" }'},RunScript:{description:"run another named script",example:'{ "type": "RunScript", "name": "MyScript", "scriptType": "SimpleScript" }'},CopySignalValuesFromFolder:{description:"copy signal values from one signal folder to another",example:'{ "type": "CopySignalValuesFromFolder", "sourceFolder": ".Source", "destinationFolder": ".Target" }'},ExportSignalValuesAsJson:{description:"export matching signal values as a downloadable JSON file",example:'{ "type": "ExportSignalValuesAsJson", "regex": "^\\\\.Some\\\\..*", "fileName": "export.json" }'},ImportSignalValuesFromJson:{description:"import signal values from a JSON string",example:'{ "type": "ImportSignalValuesFromJson", "data": "{ \\".Some.Signal\\": true }" }'},Repeat:{description:"jump back to a label a number of times, or indefinitely",example:'{ "type": "Repeat", "label": "lbl_loop", "count": 0, "mode": "eventValid" }',note:'mode: "eventValid" (default, repeats until the event is no longer active) | "always" (repeats until count is 0 or indefinitely when count is 0).'},Condition:{description:"compare two values and jump to a label depending on the result",example:`{ "type": "Condition", "value1": {"source":"signal","name":".Is.On"}, "value2": true,
+  "comparisonType": "==", "trueGotoLabel": "lbl_off", "falseGotoLabel": "lbl_on" }`,note:"comparisonType: ==null | !=null | ==true | ==false | == | != | > | < | >= | <= | && | ||."},Exit:{description:"stop executing the current script chain",example:'{ "type": "Exit" }'},Label:{description:"a named jump target for Condition / Goto / Repeat",example:'{ "type": "Label", "label": "lbl_on" }'},Goto:{description:"jump unconditionally to a label",example:'{ "type": "Goto", "label": "lbl_on" }'}};import"@node-projects/splitview.webcomponent";var I=class o{static upgradeScriptCommand(t){return t.type==="SetElementProperty"?o.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 O="application/x-simple-script-move",V=class o extends He{static style=Ue`
+    :host {
+      background: white;
+    }
+
+    .root {
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+      display: flex;
+      flex-direction: column;
+      box-sizing: border-box;
+    }
+
+    .content {
+      flex: 1 1 auto;
+      min-height: 0;
+      position: relative;
+    }
+
+    .split-view {
+      height: calc(100% - 4px);
+      width: calc(100% - 4px);
+      position: relative;
+      margin: 2px;
+    }
+
+    .list-pane {
+      width: 48%;
+      height: 100%;
+      position: relative;
+      box-sizing: border-box;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .list-content {
+      flex: 1 1 auto;
+      min-height: 0;
+      position: relative;
+    }
+
+    .grid-pane {
+      width: 52%;
+      height: 100%;
+      position: relative;
+      box-sizing: border-box;
+    }
+
+    .split-view.code-mode .grid-pane {
+      display: none;
+    }
+
+    .split-view.code-mode::part(splitter) {
+      display: none;
+    }
+
+    #commandList {
+      position: absolute;
+      inset: 0;
+      overflow-x: hidden;
+      overflow-y: auto;
+      box-sizing: border-box;
+    }
+
+    #commandList i.wb-expander,
+    #commandList i.wb-indent {
+      display: none;
+    }
+
+    #commandList.hidden {
+      display: none;
+    }
+
+    .code-view {
+      position: absolute;
+      inset: 0;
+      display: none;
+    }
+
+    .code-view.visible {
+      display: block;
+    }
+
+    node-projects-visualization-property-grid {
+      width: 100%;
+      height: 100%;
+    }
+
+    .toolbar {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      box-sizing: border-box;
+      flex: 0 0 auto;
+      width: 100%;
+      height: 36px;
+      padding: 4px 8px;
+      border-top: 1px solid #ccc;
+      background-color: rgb(230, 230, 230);
+    }
+
+    .toolbar button {
+      box-sizing: border-box;
+      padding: 6px 16px;
+      border-radius: 4px;
+      border: 1px solid #b0b0b0;
+      background: white;
+      font-size: 12px;
+      cursor: pointer;
+    }
+
+    .toolbar button:hover:not(:disabled) {
+      background: #f0f0f0;
+      border-color: #909090;
+    }
+
+    .toolbar button:active:not(:disabled) {
+      background: #e2e2e2;
+    }
+
+    .toolbar button:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .toolbar button.primary {
+      background: #2c6e9b;
+      border-color: #2c6e9b;
+      color: white;
+    }
+
+    .toolbar button.primary:hover:not(:disabled) {
+      background: #255d83;
+      border-color: #255d83;
+    }
+
+    .toolbar button.primary:active:not(:disabled) {
+      background: #1e4d6b;
+    }
+
+    .toolbar .spacer {
+      flex: 1 1 auto;
+    }
+
+    .toolbar .icon-btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 22px;
+      height: 22px;
+      padding: 0;
+      box-sizing: border-box;
+      border: none;
+      background: transparent;
+      cursor: pointer;
+    }
+
+    .toolbar .icon-btn:hover {
+      background: #eee;
+    }
+
+    .drag-handle {
+      position: absolute;
+      left: 0;
+      top: 0;
+      height: 100%;
+      width: 24px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #888;
+      cursor: grab;
+    }
+
+    .cmd {
+      position: absolute;
+      right: 0;
+      top: 0;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      gap: 2px;
+      padding: 0 2px;
+      background: white;
+    }
+
+    .cmd img {
+      width: 12px;
+      height: 12px;
+      cursor: pointer;
+    }
+  `;static template=Ge`
+    <div class="root">
+      <div class="content">
+        <node-projects-split-view
+          id="splitView"
+          class="split-view"
+          orientation="horizontal"
+        >
+          <div id="listPane" class="list-pane">
+            <div id="listContent" class="list-content">
+              <div id="commandList"></div>
+              <node-projects-code-view-monaco
+                id="codeView"
+                class="code-view"
+                language="json"
+              ></node-projects-code-view-monaco>
+            </div>
+            <div class="toolbar">
+              <button
+                id="addCommandBtn"
+                class="primary"
+                @click="[[this.addCommand()]]"
+              >
+                Add Command
+              </button>
+              <button id="codeToggleBtn" @click="[[this.toggleCodeView()]]">
+                Code
+              </button>
+              <span class="spacer"></span>
+              <button
+                class="icon-btn"
+                title="Help"
+                @click="[[this.helpClicked()]]"
+              >
+                <svg viewBox="0 0 512 512" width="16" height="16">
+                  <path
+                    d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div class="grid-pane">
+            <node-projects-visualization-property-grid
+              id="propertygrid"
+            ></node-projects-visualization-property-grid>
+          </div>
+        </node-projects-split-view>
+      </div>
+    </div>
+  `;static is="node-projects-visualization-simple-script-editor";_title;get title(){return this._title}set title(t){this._title=t}serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;helpRequested=new Je;commandDescriptions={...se};_script;_commandListDiv;_commandListFancyTree;_propertygrid;_splitView;_codeView;_codeToggleBtn;_addCommandBtn;_showingCode=!1;_dragFromHandle=!1;_draggedNode=null;constructor(){super(),this._restoreCachedInititalValues(),this._commandListDiv=this._getDomElement("commandList"),this._propertygrid=this._getDomElement("propertygrid"),this._splitView=this._getDomElement("splitView"),this._codeView=this._getDomElement("codeView"),this._codeToggleBtn=this._getDomElement("codeToggleBtn"),this._addCommandBtn=this._getDomElement("addCommandBtn");let t=this._getDomElement("listContent");t.addEventListener("mousedown",s=>{this._dragFromHandle=!!s.target?.closest(".drag-handle")}),document.addEventListener("dragend",()=>{this._draggedNode=null},!0),t.addEventListener("dragover",s=>{if(s.preventDefault(),s.dataTransfer){let e=s.dataTransfer.types.includes(O);s.dataTransfer.dropEffect=e?"move":"copy"}}),t.addEventListener("drop",s=>{if(s.preventDefault(),s.dataTransfer?.types.includes(O)&&this._draggedNode){let i=this._commandListFancyTree.root.children,n=i?.[i.length-1];n&&this._draggedNode.moveTo(n,"after"),this._draggedNode.setClass("wb-drag-source",!1)}else{let i=s.dataTransfer?.getData("text/plain");if(i){let n={type:i};this._commandListFancyTree.root.addChildren(this.createTreeItem(n))}}}),this.shadowRoot.adoptedStyleSheets=[Ye,o.style]}async ready(){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,r)=>ae(this.propertiesTypeInfo,n,r),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)=>ae(this.scriptCommandsTypeInfo,s,e),this._propertygrid.getSpecialEditorForType=async(s,e,i,n,r)=>{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 l=document.createElement("div");l.style.display="flex";let c=document.createElement("span");e?c.innerText=(e.source??"")+": "+(e.name??""):c.innerText="",c.style.overflow="hidden",c.style.whiteSpace="nowrap",c.style.textOverflow="ellipsis",c.style.flexGrow="1",c.title=JSON.stringify(e),l.appendChild(c);let p=document.createElement("button");return p.innerText="...",p.onclick=()=>{t({value:e,propertyPath:i})},l.appendChild(p),n.nodeElem.style.display="flex",l}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=>{$e.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)})}helpClicked(){let t=document.createElement("iframe");t.srcdoc=te,t.style.cssText="width:100%; height:100%; border:none; display:block;",this.visualizationShell.openModal(t,{title:"Simple Script Editor Help",parent:this,x:-650,y:-100,width:620,height:620}),this.helpRequested.emit()}toggleCodeView(){if(!this._showingCode){let s=JSON.stringify({commands:this.getScriptCommands()},null,2);this._codeView.update(s),this._showCodeView(!0);return}let t=this._parseCodeViewScript();t&&(this._showCodeView(!1),this.loadScript(t))}_showCodeView(t){this._codeView.classList.toggle("visible",t),this._commandListDiv.classList.toggle("hidden",t),this._splitView.classList.toggle("code-mode",t),this._addCommandBtn.disabled=t,this._codeToggleBtn.innerText=t?"Visual":"Code",this._showingCode=t,t&&requestAnimationFrame(()=>this._codeView.activated())}_parseCodeViewScript(){let t;try{t=JSON.parse(this._codeView.getText())}catch(s){return alert(`Invalid JSON:
+`+s.message),null}return Array.isArray(t?.commands)?t:(alert('The JSON must have a "commands" array.'),null)}loadScript(t){this._script=t,this._commandListFancyTree&&(this._commandListFancyTree.destroy(),this._commandListDiv=this._getDomElement("commandList"));let s=[];for(let e of this._script.commands)e=I.upgradeScriptCommand(e),s.push(this.createTreeItem(e));this._commandListFancyTree=new qe({...Xe,element:this._commandListDiv,icon:!1,source:s,activate:e=>{this._propertygrid.selectedObject=e.node.data.data.item},render:e=>{if(e.isNew){e.nodeElem.oncontextmenu=m=>(m.preventDefault(),!1);let n=document.createElement("div");n.className="drag-handle",n.title="Drag to reorder",n.innerHTML='<svg viewBox="0 0 24 24" width="14" height="14"><path d="M4 6h16M4 12h16M4 18h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>';let r=document.createElement("span");r.style.cssText="display:inline-block; width:24px;",e.nodeElem.prepend(r,n);let a=e.nodeElem.parentElement,l=document.createElement("span");l.style.cssText="display:inline-block; width:32px;",e.nodeElem.appendChild(l);let c=document.createElement("div");c.className="cmd";let p=document.createElement("img");p.src=ie+"icons/copy.svg",p.title="Duplicate",p.onclick=()=>{let m=structuredClone(e.node.data.data.item);e.node.parent.addChildren(this.createTreeItem(m)).moveTo(e.node,"after")};let u=document.createElement("img");u.src=ie+"icons/delete.svg",u.title="Remove",u.onclick=()=>e.node.remove(),c.append(p,u),a.appendChild(c),e.nodeElem._reservedRowWidth=r.offsetWidth+l.offsetWidth}let i=e.nodeElem._reservedRowWidth??0;if(i){let n=e.nodeElem.querySelector("span.wb-title");if(n){let r=parseFloat(n.style.width);isNaN(r)||(n.style.width=Math.max(0,r-i)+"px")}}},dnd:{guessDropEffect:!0,preventRecursion:!0,preventVoidMoves:!1,serializeClipboardData:!1,dragStart:e=>this._dragFromHandle?(this._draggedNode=e.node,e.event.dataTransfer.effectAllowed="move",e.event.dataTransfer.dropEffect="move",e.event.dataTransfer.setData(O,"1"),!0):!1,dragEnd:()=>{this._draggedNode=null},dragEnter:e=>{let i=e.event.dataTransfer?.types.includes(O);return e.event.dataTransfer.dropEffect=i?"move":"copy",!0},dragOver:e=>{let i=e.event.dataTransfer?.types.includes(O);e.event.dataTransfer.dropEffect=i?"move":"copy"},drop:async e=>{let i=e.region=="before"?"before":"after";if(e.event.dataTransfer?.types.includes(O)&&this._draggedNode)this._draggedNode.moveTo(e.node,i),this._draggedNode.setClass("wb-drag-source",!1);else{let r=e.event.dataTransfer?.getData("text/plain");if(r){let a={type:r},l=this.createTreeItem(a);e.node.parent.addChildren(l).moveTo(e.node,i)}}}}}),this._commandListFancyTree.root.children?.[0]?.setActive()}createTreeItem(t){return{title:t.type,data:{item:t}}}async addCommand(){let t=new B;t.loadCommands(this.scriptCommandsTypeInfo,this.commandDescriptions),t.title="Add Script Command",t.commandTypeChosen.on(()=>{if(t.selectedType){let e={type:t.selectedType},i=this.createTreeItem(e);this._commandListFancyTree.addChildren(i)}});let s=new AbortController;t.closeRequested.on(()=>s.abort()),await this.visualizationShell.openModal(t,{title:"Add Script Command",x:300,y:50,width:620,height:400,parent:this,abortSignal:s.signal})}getScriptCommands(){if(this._showingCode){let s=this._parseCodeViewScript();s&&this.loadScript(s)}return this._commandListFancyTree.root.children.map(s=>s.data.data.item)}};customElements.define(V.is,V);import{BaseCustomWebComponentConstructorAppend as Ze,css as Ke,html as Qe}from"@node-projects/base-custom-webcomponent";var R=class extends Ze{static style=Ke`
         :host {
             display: grid;
             grid-template-columns: 80px 80px 80px auto;
@@ -316,7 +836,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         
         span {
             font-size: 10px;
-        }`;static template=je`
+        }`;static template=Qe`
         <span></span>
         <span>name</span>
         <span>type</span>
@@ -335,7 +855,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(I.is,I);import{BaseCustomWebComponentConstructorAppend as ze,css as De,html as K}from"@node-projects/base-custom-webcomponent";import{ContextMenu as Q,copyTextToClipboard as ee,getTextFromClipboard as te,PropertiesHelper as Pe}from"@node-projects/web-component-designer";var P=class n extends ze{static style=De`
+        <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(R.is,R);import{BaseCustomWebComponentConstructorAppend as et,css as tt,html as ne}from"@node-projects/base-custom-webcomponent";import{ContextMenu as oe,copyTextToClipboard as re,getTextFromClipboard as le,PropertiesHelper as st}from"@node-projects/web-component-designer";var F=class o extends et{static style=tt`
         :host {
             display: grid;
             grid-template-columns: 20px 1fr auto;
@@ -369,22 +889,22 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
         }
         button {
             cursor: pointer;
-        }`;static template=K`
+        }`;static template=ne`
         <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=K`
+        <input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=ne`
         <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,r){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=r}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 r=JSON.parse(i);r.name=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}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 r=JSON.parse(i);r.relativeSignalsPath=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}else{let r={name:i,relativeSignalsPath:e};this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}}}_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 n.scriptTypeColors[s]??"white"}_getScriptType(t){if(t.designItem.hasAttribute("@"+t.name)){let s=t.designItem.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:()=>{ee(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await te()),this._bindingsRefresh()}}];Q.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 r=prompt("name of function ?");r&&(this._selectedItems[0].setAttribute("@"+s.name,r),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:()=>{ee(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await te()),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 r=this._createAssignScriptContextMenu(t,s);Q.show(r,t)}}async _editParameter(t,s){let e=new I,i={};e.title="ParameterEditor for '"+s.name+"' of '"+s.designItem.name+"'";let r=s.designItem.getAttribute("@"+s.name);if(r&&r[0]=="{")try{i=JSON.parse(r).parameters}catch{}if(e.setParametersObject(i),await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let a=e.getParametersObject(),l={name:r,parameters:a};r&&r[0]=="{"&&(l=JSON.parse(r),l.parameters=a),a==null&&delete l.parameters;let c=JSON.stringify(l);s.designItem.setAttribute("@"+s.name,c),this._bindingsRefresh()}}async _editBlockly(t,s){let e=new C(this._blocklyToolbox);e.title="Blockly Script for '"+s.name+"' of '"+s.designItem.name+"'";let i=s.designItem.getAttribute("@"+s.name),r=null,o=null;if(i){let l=JSON.parse(i);r=l.parameters,o=l.relativeSignalsPath,e.load(l)}if(await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let l=e.save();r&&(l.parameters=r),o&&(l.relativeSignalsPath=o),s.designItem.setAttribute("@"+s.name,JSON.stringify(l)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=s.designItem.getAttribute("@"+s.name);if(!e||e.startsWith("{")){let i={commands:[]},r=null,o=null;e&&(i=JSON.parse(e),r=i.parameters,o=i.relativeSignalsPath);let a=new O;if(a.serviceContainer=s.designItem.serviceContainer,a.instanceServiceContainer=s.designItem.instanceServiceContainer,a.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,a.propertiesTypeInfo=this._propertiesTypeInfo,a.visualizationShell=this._visualizationShell,a.visualizationHandler=this._visualizationHandler,a.loadScript(i),a.title="Script '"+s.name+"' on "+s.designItem.name,await this._visualizationShell.openConfirmation(a,{x:100,y:100,width:600,height:500})){let c=a.getScriptCommands();if(c&&c.length){let p={commands:c};r&&(p.parameters=r),o&&(p.relativeSignalsPath=o);let d=JSON.stringify(p);s.designItem.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]).map(t=>({...t,designItem: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_",Xt=/{{(.*)}}/;function z(n){return n.constructor?.elementProperties!=null}function U(n){let t=[],s=[],e="";for(let i=0;i<n.length;i++)n[i]=="{"?(t.push(e),e=""):n[i]=="}"?(s.push(e),e=""):e+=n[i];return t.push(e),{parts:t,signals:s}}function L(n,t){let s=t.split("."),e=n;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,r,o,a,l){this.visualizationHandler=s,this.valueChangedCb=i,this.element=r,this.relativeSignalPath=o,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let c=0;c<this.signals.length;c++){let p=this.signals[c];if(p[0]==="?"&&p[1]==="?"){let h=p.substring(2);if(h.includes(".")){let u=L(a,h);this.handleValueChanged(u,c)}else{this.handleValueChanged(a[h],c);let u=()=>this.handleValueChanged(a[h],c),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(r,h);this.handleValueChanged(u,c)}else{this.handleValueChanged(r[h],c);let u=()=>this.handleValueChanged(r[h],c),g=t.getChangedEventName(r,h);r.addEventListener(g,u),this.cleanupCalls.push(()=>r.removeEventListener(g,u))}continue}else if(p[0]==="\xA7"){let h=p.substring(1),u=l.valueProvider(h,{element:r,relativeSignalPath:o,root:a});u instanceof Promise?u.then(y=>this.handleValueChanged(y,c)):this.handleValueChanged(u,c),l.valueChangedCallbacks||(l.valueChangedCallbacks=new Map);let g=l.valueChangedCallbacks.get(h);g==null&&(g=[],l.valueChangedCallbacks.set(h,g)),g.push(()=>{let y=l.valueProvider(h,{element:r,relativeSignalPath:o,root:a});y instanceof Promise?y.then(x=>this.handleValueChanged(x,c)):this.handleValueChanged(y,c)})}else(p[0]==="?"||p[0]==="#")&&(p.includes(".")?p=L(a,p.substring(1)):p=a[p.substring(1)]);let d=(h,u)=>this.handleValueChanged(u.val,c),m=this.visualizationHandler.subscribeState(p,d);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[c],d,m))}}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 r=this.values[i];if(r==null)return;e+=r+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=(r,o)=>this.valueChangedCb(o);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)}},se=class n{_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,r){let o=s.substring(r.length);if(i===f.cssvar&&(o="--"+o),!e.startsWith("{")){let l={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),l.signal=e,e.includes("::")){let c=e.split("::");e=c[0],l.signal=e,l.events=c[1].split(",")}l.twoWay=!0,l.events||(t instanceof HTMLInputElement?l.events=[this.getChangedEventName(t,o)]:t instanceof HTMLSelectElement?l.events=[this.getChangedEventName(t,o)]:z(t)?l.events=[this.getChangedEventName(t,o)]:(l.events=[this.getChangedEventName(t,o)],l.maybeLitElement=!0,l.litEventNames=[this.getChangedEventName(t,o)]))}if(e[0]==="!"&&(l.signal=e.substring(1),l.inverted=!0),l.signal.includes(";")){let c=l.signal.split(";");l.expression=c.pop(),l.signal=c.join(";")}return i===f.cssvar||i===f.class?[n.dotToCamelCase(o),l]:i===f.attribute?[o,l]:[v.dashToCamelCase(o),l]}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,o)]),i===f.cssvar||i===f.class?[n.dotToCamelCase(o),a]:i===f.attribute?[o,a]:[v.dashToCamelCase(o),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 r=i.twoWay&&i.events?.length>0?"::"+i.events.join(","):"",o=!1;return(r&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(o=!0),e.signal.trim()[0]=="{"&&(o=!0),!o&&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(";")?";":"")+r]:s=="innerHTML"?[w+"html",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:[S+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:!o&&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+r]:s=="innerHTML"?[w+"html",(e.inverted?"!":"")+e.signal+";"+e.expression+r]:[S+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+r]:!o&&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(";")?";":"")+r]:!o&&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+r]:!o&&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(";")?";":"")+r]:!o&&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+r]:!o&&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(";")?";":"")+r]:!o&&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+r]:!o&&e.target==f.cssvar&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+n.camelToDotCase(s.substring(2)),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:!o&&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+r]:((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+n.camelToDotCase(s),JSON.stringify(i)]:e.target==f.css?[V+v.camelToDashCase(s),JSON.stringify(i)]:e.target==f.cssvar?[A+n.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+n.camelToDotCase(s):e==f.css?V+v.camelToDashCase(s):e==f.visible?F:e==f.cssvar?A+n.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,r){let o=[],a=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),l;for(;l=a.nextNode();){let c=this.getBindings(l);for(let p of c)try{let d=this.applyBinding(l,p,s,e,i);if(o.push(d),p[1].maybeLitElement&&l.localName.includes("-")&&!customElements.get(l.localName)){let m=l,h=p;customElements.whenDefined(l.localName).then(()=>{z(m)&&(d(),h[1].events=h[1].litEventNames,o.push(this.applyBinding(m,h,s,e,i)))})}}catch(d){console.warn("error applying binding",l,p,d)}if(r&&r(l)){l=a.nextSibling();continue}}return o}static#e=0;async parseCssBindings(t,s,e,i){let r=await import("@node-projects/css-parser"),o=r.parse(t),a;for(let c of o.stylesheet.rules)if(c.type===r.CssTypes.rule){for(let p of c.declarations)if(p.type===r.CssTypes.declaration&&p.value.includes(He)){let d=this.parseCssBinding(p.value,s,e,i);p.value=d[0],a?a.push(...d[1]):a=d[1]}}let l=r.stringify(o,{indent:"",compress:!0});return[Me(l),a]}parseCssBinding(t,s,e,i,r){t=t.trim();let o="",a="",l=!1,c="",p=!1,d=null,m=[];for(let h=0;h<t.length;h++){let u=t[h];if(l)if(p)c+=u;else if(d&&u==="\\")p=!0;else if(u===d)d=null;else if(d===null&&u===")"){let g=n.#e++,y=Fe+g,x=[y,{signal:c,target:f.cssvar}];c.startsWith("{")&&(x=JSON.parse(c)),m.push(this.applyBinding(s,x,e,i,r)),o+="var("+y+")",l=!1,c=""}else c+=u;else u==="("?(a!=="bind"?(o+=a,o+=u):(l=!0,t[h+1]==="'"||t[h+1]==='"'?(h++,d=t[h]):d=null),a=""):u===" "||u===","||u==="("||u==="+"||u==="-"||u==="*"||u==="/"?(o+=a+u,a=""):a+=u}return[o+a,m]}applyBinding(t,s,e,i,r){let o=[],a,l=()=>{for(let m of o)this._visualizationHandler.unsubscribeState(m[0],m[1],m[2]);if(a)for(let m of a)m()},c=s[1].signal.split(";"),p=new Array(c.length);for(let m=0;m<c.length;m++){let h=c[m];if(p[m]="__"+m,h.includes(":")){let u=h.split(":");p[m]=u[0],h=u[1],c[m]=h}if(h[0]==="?"){if(i){let u=h.substring(1);if(u[0]=="?")c[m]=u;else{c[m]=i[u],u[0]==="$"&&(u=u.substring(1),c[m]="$"+i[u]);let g=()=>{l(),this.applyBinding(t,s,e,i,r)},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]=="#")c[m]=u;else{c[m]=i[u],u[0]==="$"&&(u=u.substring(1),c[m]="$"+i[u]);let g=()=>{l(),this.applyBinding(t,s,e,i,r)},y=this.getChangedEventName(t,u);i.addEventListener(y,g),a||(a=[]),a.push(()=>i.removeEventListener(y,g))}}h[0]==="."&&(c[m]=this._visualizationHandler.getNormalizedSignalName(h,e,t))}let d=new Array(c.length);for(let m=0;m<c.length;m++){let h=c[m];if(h[0]==="?"){if(i){let u=h.substring(1),g=()=>{let y=!1;y||(y=!0,this.handleValueChanged(t,i,s,i[u],d,m,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],d,m,p,!1,e)}catch(y){console.error(y)}s[1].twoWay&&m==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],d,m,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],d,m,p,!1,e)}catch(y){console.error(y)}s[1].twoWay&&m==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,d,m,p,!0,e)})}else if(h[0]==="\xA7"){let u=h.substring(1),g=r.valueProvider(u,{element:t,binding:s,relativeSignalPath:e,root:i});g instanceof Promise?g.then(x=>this.handleValueChanged(t,i,s,x,d,m,p,!0,e)):this.handleValueChanged(t,i,s,g,d,m,p,!0,e),r.valueChangedCallbacks||(r.valueChangedCallbacks=new Map);let y=r.valueChangedCallbacks.get(u);y==null&&(y=[],r.valueChangedCallbacks.set(u,y)),y.push(()=>{let x=r.valueProvider(u,{element:t,binding:s,relativeSignalPath:e,root:i});x instanceof Promise?x.then(me=>this.handleValueChanged(t,i,s,me,d,m,p,!0,e)):this.handleValueChanged(t,i,s,x,d,m,p,!0,e)})}else if(h.includes("{")){let u=new J(this,this._visualizationHandler,h,g=>this.handleValueChanged(t,i,s,g.val,d,m,p,!1,e),t,e,i,r);a||(a=[]),a.push(()=>u.dispose()),s[1].twoWay&&m==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,d,m,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,d,m,p,!0,e));else{let u=(g,y)=>this.handleValueChanged(t,i,s,y.val,d,m,p,!1,e);o.push([h,u,this._visualizationHandler.subscribeState(h,u)]),this._visualizationHandler.getState(h).then(g=>this.handleValueChanged(t,i,s,g?.val,d,m,p,!1,e)),s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,g=>this._visualizationHandler.setState(h,g))}}return l}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 r=s[i];r instanceof Le?r.on(()=>{let o;t[1].target==f.attribute?o=s.getAttribute(t[0]):o=s[t[0]],o=n.parseValueWithType(o,t),t[1].compiledExpressionTwoWay&&(o=t[1].compiledExpressionTwoWay(o)),e(o)}):s.addEventListener(i,o=>{let a;t[1].target==f.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=n.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,r,o,a,l,c){let p=i;if(!l&&o==0&&(p=n.parseValueWithType(p,e)),r[o]=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)),r[a.length-1]={element:t,root:s,boundNames:e[1].signal,boundTargetName:e[0],boundTargetType:e[1].target},p=e[1].compiledExpression(...r),r[a.length-1]=p),e[1].converter)if(typeof e[1].converter=="string")p=this.namedConverterCallback(e[1].converter,p,t,e);else{let d=p!=null?p.toString():p;if(d in e[1].converter){let m=e[1].converter[d];typeof m=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=m}else{let m=!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]+"`")(...r):p=y,m=!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]+"`")(...r):p=y,m=!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]+"`")(...r):p=y,m=!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]+"`")(...r):p=y,m=!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]+"`")(...r):p=y,m=!0;break}}!m&&e[1].converterDefault!==void 0&&(p=e[1].converterDefault)}}if(e[1].inverted&&(p=!p),e[1].writeBackSignal){let d=e[1].writeBackSignal;d[0]==="."&&(d=c+d),this._visualizationHandler.setState(d,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 ie=class{name;relativeSignalsPath;commands;parameters};import{deepValue as _,setDeepValue as ae,sleep as Je}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import W from"long";var M="cyclic",Ue={pointerdown:"pointerup",pointerenter:"pointerleave",mouseenter:"mouseleave",mouseover:"mouseout",focus:"blur",focusin:"focusout",keydown:"keyup"},ne=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(n){this._visualizationHandler=n}async execute(n,t){let s=-1,e=!1,i=t.event?.type,r=i?Ue[i]:null;if(r){let o=t.element;i=="pointerdown"&&(o=window),o.addEventListener(r,()=>{e=!0},{once:!0})}for(let o=0;o<n.length;o++){let a=n[o];if(a.type=="Exit")break;if(a.type=="Goto"){let l=await this.getValue(a.label,t);if(o=n.findIndex(c=>c.type=="Label"&&c.label==l),o<0)break}else if(a.type=="Condition"){let l=await this.getValue(a.value1,t),c=await this.getValue(a.value2,t),p=await this.getValue(a.comparisonType,t),d=!1;switch(p){case"==null":d=l==null;break;case"!=null":d=l!=null;break;case"==true":d=l==!0;break;case"==false":d=l==!1;break;case"==":d=l==c;break;case"!=":d=l!=c;break;case">":d=l>c;break;case"<":d=l<c;break;case">=":d=l>=c;break;case"<=":d=l<=c;break;case"&&":d=l&&c;break;case"||":d=l||c;break}if(d){await this.runExternalScript(await this.getValue(a.trueScriptName,t),await this.getValue(a.trueScriptType,t));let m=await this.getValue(a.trueGotoLabel,t);if(m&&(o=n.findIndex(h=>h.type=="Label"&&h.label==m),o<0))break}else{await this.runExternalScript(await this.getValue(a.falseScriptName,t),await this.getValue(a.falseScriptType,t));let m=await this.getValue(a.falseGotoLabel,t);if(m&&(o=n.findIndex(h=>h.type=="Label"&&h.label==m),o<0))break}}else if(a.type=="Repeat"){let l=await this.getValue(a.label,t),c=await this.getValue(a.count,t);if(await this.getValue(a.mode,t)=="eventValid"&&e){e=!1;continue}if(c!=0&&s==-1&&(s=c-1),s==0||(s>0&&s--,o=-1,l&&(o=n.findIndex(d=>d.type=="Label"&&d.label==l),o<0)))continue}else if(!await this.runScriptCommand(a,t))break}}async getValueFromTarget(n,t,s){return n==="property"?_(s.root,t):n==="elementProperty"?_(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(n,t,s,e){n==="property"?ae(s.root,t,e):n==="elementProperty"?ae(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(n,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"Goto":case"Exit":case"Repeat":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let n=await this.getValue(command.value??500,context);await Je(n);break}case"Console":{let n=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[n](t);break}case"ToggleSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,n,context);await this._visualizationHandler.setState(this.getSignalName(n,context),!s);break}case"ToggleSignalValueThroughList":{let n=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=n.indexOf(e)+1;i>=n.length&&(i=0);let r=n[i];await this._visualizationHandler.setState(this.getSignalName(t,context),r);break}case"SetSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,n,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,n,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,n,context,e);break}case"DecrementSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,n,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,n,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 n=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,n,context),i=W.fromNumber(1).shiftLeft(t),r=W.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"ClearBitInSignal":{let n=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,n,context),i=W.fromNumber(1).shiftLeft(t);i.negate();let r=W.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"ToggleBitInSignal":{let n=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,n,context),i=W.fromNumber(1).shiftLeft(t),r=W.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"Javascript":{let n=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",n)),command.compiledScript(t);break}case"SetElementProperty":{command=N.upgradeSetElementProperty(command);let n=await this.getValue(command.name,context);n===""&&(n=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),r=await this.getValue(command.targetSelector,context),o=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,r);for(let l of a)e=="attribute"?l.setAttribute(n,t):e=="property"?l[n]=t:e=="css"?l.style[n]=t:e=="class"&&(o==="toggle"?l.classList.toggle(n??t):o==="remove"?l.classList.remove(n??t):l.classList.add(n??t));break}case"SubscribeSignal":{let n=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(n,s,null)};this._visualizationHandler.subscribeState(n,s)}else this._visualizationHandler.subscribeState(n,this._subscriptionCallback);break}case"UnsubscribeSignal":{let n=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(n,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let n=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(n);break}case"ClearSignalsInGroup":{let n=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(n);break}case"RunScript":{let n=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(n,t);break}case"ShowMessageBox":{let n=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)?n=1:n=2}else{let i=await this.getValue(command.message,context);alert(i),n=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,n),t&&n!=1)return!1;break}case"ShowPrompt":{let n=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(n,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(n,t,s){if(t==="container"){let e=n.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=n.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(n,t,s,e){let i=this.getTarget(n,t,s),r=[i];return e&&(t==="container"?r=i.shadowRoot.querySelectorAll(e):r=i.querySelectorAll(e)),r}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 n=_(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(n,outerContext)))?.val}case"event":{let n=outerContext.event;return value.name&&(n=_(n,value.name)),n}case"parameter":return outerContext.parameters[value.name];case"context":return _(outerContext,value.name);case"complexString":{let n=value.name;return n!=null?await this.parseStringWithValues(n,outerContext):null}case"complexSignal":{let n=value.name;if(n!=null){let t=await this.parseStringWithValues(n,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(n,t){let s=U(n),e=await Promise.all(s.signals.map(r=>this.getStateOrFieldOrParameter(this.getSignalName(r,t),t))),i=s.parts[0];for(let r=0;r<s.parts.length-1;r++){let o=e[r];typeof o=="object"&&(o=o.val),o==null&&(o=""),i+=o+s.parts[r+1]}return i}getSignalName(n,t){return n[0]==="."?t.relativeSignalsPath+n:n}createScriptContext(n,t,s,e,i){return{root:n,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(n,t,s,e,i,r,o,a){r??=this.createScriptContext;let l=await this.loadAndInitJsObject(n,t,s,e,a);for(let c of s.querySelectorAll("*"))for(let p of c.attributes)if(p.name[0]==="@")try{let d=p.name.substring(1),m=p.value.trim(),h=d.startsWith(M),u=h?parseInt(d.substring(d.indexOf(":")+1)):null,g=await this.resolveHandler(m,l,c,s,e,i,r,o,d);g&&this.bindHandler(c,d,h,u,g)}catch{console.warn("error assigning script",c,p)}return l}async loadAndInitJsObject(n,t,s,e,i){if(!t)return null;try{let o=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"})));return i?i(o):o.init?.(e,s),o}catch(r){return console.error("error parsing javascript - "+n,r),null}}async resolveHandler(n,t,s,e,i,r,o,a,l){if(n[0]!=="{")return p=>{t?.[n]?t[n](p,s,e,i):console.warn(`javascript function named: "${n}" not found, maybe missing a "export" ?`)};let c=JSON.parse(n);if("commands"in c)return p=>this.execute(c.commands,o(i,p,s,c.parameters,c.relativeSignalsPath));if("blocks"in c){let p=null;return async d=>{p??=await G(c),p(d,e,c.parameters,c.relativeSignalsPath??"",r,o(i,d,s,c.parameters,c.relativeSignalsPath))}}if("name"in c){if(a)return a(s,l,c),null;let p=c.name;return d=>{t?.[p]?t[p](d,s,e,i,c.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(n,t,s,e,i){if(!s){n.addEventListener(t,i);return}let r=setInterval(()=>{n.isConnected?i(null):clearInterval(r)},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 r=t.getNormalizedElementCoordinates(e);this.rect=t.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",r.x,r.y,r.width,r.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 r=this.rectMap.get(e);t.overlayLayer.removeOverlay(r),this.rectMap.delete(e)}}dragOver(t,s,e){return"copy"}async drop(t,s,e,i){for(let l of this.rectMap.values())t.overlayLayer.removeOverlay(l);this.rectMap.clear();let r=T.GetDesignItem(i),o=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(o);if(r&&!r.isRootItem)if(i instanceof HTMLInputElement){let l={signal:e.fullName,target:k.property},c=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",l);r.setAttribute(c[0],c[1])}else{let l={signal:e.fullName,target:k.content},c=this._bindingsHelper.serializeBinding(i,null,l);r.setAttribute(c[0],c[1])}else{let l=t.getNormalizedEventCoordinates(s),c,p,d=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof d?.val=="string")if(d.val.endsWith("jpg")||d.val.endsWith("jpeg")||d.val.endsWith("png")||d.val.endsWith("gif")||d.val.endsWith("svg")){let m=document.createElement("img");c=T.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(u[0],u[1]),c.element.src=d.val}else if(d.val.endsWith("mp4")){let m=document.createElement("video");c=T.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(u[0],u[1]),c.element.src=d.val}else{let m=document.createElement("iframe");c=T.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:k.property},u=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(u[0],u[1]),c.element.src=d.val}if(!c){let m=document.createElement("input");c=T.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h=a.writeable!==!1,u={signal:e.fullName,target:k.property,twoWay:h},g=this._bindingsHelper.serializeBinding(m,"value",u);a.type==="boolean"?(g=this._bindingsHelper.serializeBinding(m,"checked",u),c.setAttribute("type","checkbox")):a.role=="date"?(u.twoWay=h,g=this._bindingsHelper.serializeBinding(m,"value-as-number",u),c.setAttribute("type","date"),c.setAttribute("readonly","")):a.role=="datetime"&&(u.twoWay=h,g=this._bindingsHelper.serializeBinding(m,"value-as-number",u),c.setAttribute("type","datetime-local"),c.setAttribute("readonly","")),c.setAttribute(g[0],g[1])}c.setStyle("position","absolute"),c.setStyle("left",l.x+"px"),c.setStyle("top",l.y+"px"),t.instanceServiceContainer.undoService.execute(new Ge(t.rootDesignItem,t.rootDesignItem.childCount,c)),p.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([c]))}}dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){if(s.type=="signal"){s.service.setValue(i,s,e.fullName);return}let r={signal:e.fullName,target:k.property};s.propertyType==H.attribute&&(r.target=k.attribute),s.propertyType==H.cssValue&&(r.target=k.css),r.signal=e.fullName,r.twoWay=s.propertyType==H.property||s.propertyType==H.propertyAndAttribute;let o=i[0].openGroup("drop binding");for(let a of i){let l=this._bindingsHelper.serializeBinding(a.element,s.name,r);a.setAttribute(l[0],l[1])}o.commit()}};import{BindingMode as X,BindingTarget as oe,PropertiesHelper as $e}from"@node-projects/web-component-designer";var le=class n{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===oe.css||e[1].target===oe.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:n.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),r=t.openGroup("edit_binding");return t.setAttribute(i[0],i[1]),r.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 r of i)for(let o of r.bindableObjectNames){let a="signal",l="";if(o.includes(":")){let c=o.split(":")[0],p=o.substring(c.length+1);p.startsWith("?")&&(p=p.substring(1),l="?",a="property",p.startsWith("?")&&(p=p.substring(1),l="??")),s.push({service:this,name:p,itemType:a,designItem:e,type:"binding",sourceObject:r,display:r.target+"/"+r.targetName+" - "+c+":",shortName:c,prefix:l})}else o.startsWith("?")&&(o=o.substring(1),l="?",a="property",o.startsWith("?")&&(o=o.substring(1),l="??")),s.push({service:this,name:o,itemType:a,designItem:e,type:"binding",sourceObject:r,display:r.target+"/"+r.targetName,prefix:l})}}return s}refactor(t,s,e){let i=t.sourceObject;t.shortName?i.bindableObjectNames=i.bindableObjectNames.map(r=>r==t.shortName+":"+t.prefix+s?t.shortName+":"+t.prefix+e:r):i.bindableObjectNames=i.bindableObjectNames.map(r=>r==t.prefix+s?t.prefix+e:r),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 r=i[1];if(r[0]=="{"){let o=JSON.parse(r);if("commands"in o)for(let a of o.commands){for(let l in a){let c=a[l];if(c!=null&&typeof c=="object"){let p=c;if(p.source==="signal")s.push({name:p.name,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:o,display:a.type+"/"+i[0].substring(1)+"/"+l+"[signal]",refactor:d=>p.name=d});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:o,display:a.type+"/"+i[0].substring(1)+"/"+l+"[property]",refactor:d=>p.name=d});else if(p.source==="complexString")for(let d of p.name.matchAll(/\{(.*?)\}/g)){let m=d[0],h=d[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:o,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->property",refactor:g=>p.name=p.name.replace(m,"{"+u+g+"}")})}else s.push({name:h,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:o,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->signal",refactor:u=>p.name=p.name.replace(m,"{"+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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.screen=l});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:o,refactor:l=>a.screen=l});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:o,refactor:l=>a.targetSignal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.signal=l});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:o,refactor:l=>a.resultSignal=l});break}}else"blocks"in o;if("parameters"in o)for(let a in o.parameters)typeof o.parameters[a]=="string"&&s.push({name:o.parameters[a],itemType:"parameter",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:o,display:i[0].substring(1)+"/parameters/"+a,refactor:l=>o.parameters[a]=l})}}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 r=new AbortController;i.objectDoubleclicked.on(()=>{r.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:r.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}};import{EventsService as Ye}from"@node-projects/web-component-designer";var he=class n extends Ye{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(...n._cyclicEvent),s}getEvent(t,s){return s.includes(M)?n._cyclicEvent.find(i=>i.name==s)??{name:s,propertyName:"on"+s,eventObjectName:"Event"}:super.getEvent(t,s)}};export{re as BindableObjectDragDropService,D as BindingsEditor,E as BindingsEditorHistoric,se as BindingsHelper,C as BlocklyScriptEditor,P as EventAssignment,I as ParameterEditor,pe as PropertyGridDragDropService,ie as Script,ue as ScriptRefactorService,ne as ScriptSystem,de as SignalPropertyEditor,O as SimpleScriptEditor,ce as VisualizationBindingsRefactorService,le as VisualizationBindingsService,he 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,Xt as bindingsInCssRegex,M as cyclicAttributeName,G as generateEventCodeFromBlockly,L as getNestedProperty,z as isLit,U as parseBindingString};
+        </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;_commandDescriptions;events;initialize(t,s,e,i,n,r){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=n,this._commandDescriptions=r}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 o.scriptTypeColors[s]??"white"}_getScriptType(t){if(t.designItem.hasAttribute("@"+t.name)){let s=t.designItem.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:()=>{re(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await le()),this._bindingsRefresh()}}];oe.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("@"+st.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:()=>{re(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await le()),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);oe.show(n,t)}}async _editParameter(t,s){let e=new R,i={};e.title="ParameterEditor for '"+s.name+"' of '"+s.designItem.name+"'";let n=s.designItem.getAttribute("@"+s.name);if(n&&n[0]=="{")try{i=JSON.parse(n).parameters}catch{}if(e.setParametersObject(i),await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let a=e.getParametersObject(),l={name:n,parameters:a};n&&n[0]=="{"&&(l=JSON.parse(n),l.parameters=a),a==null&&delete l.parameters;let c=JSON.stringify(l);s.designItem.setAttribute("@"+s.name,c),this._bindingsRefresh()}}async _editBlockly(t,s){let e=new E(this._blocklyToolbox);e.title="Blockly Script for '"+s.name+"' of '"+s.designItem.name+"'";let i=s.designItem.getAttribute("@"+s.name),n=null,r=null;if(i){let l=JSON.parse(i);n=l.parameters,r=l.relativeSignalsPath,e.load(l)}if(await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let l=e.save();n&&(l.parameters=n),r&&(l.relativeSignalsPath=r),s.designItem.setAttribute("@"+s.name,JSON.stringify(l)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=s.designItem.getAttribute("@"+s.name);if(!e||e.startsWith("{")){let i={commands:[]},n=null,r=null;e&&(i=JSON.parse(e),n=i.parameters,r=i.relativeSignalsPath);let a=new V;if(a.serviceContainer=s.designItem.serviceContainer,a.instanceServiceContainer=s.designItem.instanceServiceContainer,a.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,a.propertiesTypeInfo=this._propertiesTypeInfo,a.visualizationShell=this._visualizationShell,a.visualizationHandler=this._visualizationHandler,this._commandDescriptions&&(a.commandDescriptions={...a.commandDescriptions,...this._commandDescriptions}),a.loadScript(i),a.title="Script '"+s.name+"' on "+s.designItem.name,await this._visualizationShell.openConfirmation(a,{title:a.title,width:600,height:500})){let c=a.getScriptCommands();if(c&&c.length){let p={commands:c};n&&(p.parameters=n),r&&(p.relativeSignalsPath=r);let u=JSON.stringify(p);s.designItem.setAttribute("@"+s.name,u),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]).map(t=>({...t,designItem: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(F.is,F);import{TypedEvent as it,cssFromString as at}from"@node-projects/base-custom-webcomponent";import{BindingTarget as y}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 k="bind-prop:",A="bind-attr:",D="bind-class:",z="bind-css:",L="bind-cssvar:",w="bind-content:",G="bind-visible:",nt="bind(",ot="--tmpBinding_",Ss=/{{(.*)}}/;function M(o){return o.constructor?.elementProperties!=null}function X(o){let t=[],s=[],e="";for(let i=0;i<o.length;i++)o[i]=="{"?(t.push(e),e=""):o[i]=="}"?(s.push(e),e=""):e+=o[i];return t.push(e),{parts:t,signals:s}}function H(o,t){let s=t.split("."),e=o;for(let i of s){if(e==null||typeof e!="object")return;e=e[i]}return e}var $=class{parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(t,s,e,i,n,r,a,l){this.visualizationHandler=s,this.valueChangedCb=i,this.element=n,this.relativeSignalPath=r,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let c=0;c<this.signals.length;c++){let p=this.signals[c];if(p[0]==="?"&&p[1]==="?"){let h=p.substring(2);if(h.includes(".")){let d=H(a,h);this.handleValueChanged(d,c)}else{this.handleValueChanged(a[h],c);let d=()=>this.handleValueChanged(a[h],c),g=t.getChangedEventName(a,h);a.addEventListener(g,d),this.cleanupCalls.push(()=>a.removeEventListener(g,d))}continue}else if(p[0]==="#"&&p[1]==="#"){let h=p.substring(2);if(h.includes(".")){let d=H(n,h);this.handleValueChanged(d,c)}else{this.handleValueChanged(n[h],c);let d=()=>this.handleValueChanged(n[h],c),g=t.getChangedEventName(n,h);n.addEventListener(g,d),this.cleanupCalls.push(()=>n.removeEventListener(g,d))}continue}else if(p[0]==="\xA7"){let h=p.substring(1),d=l.valueProvider(h,{element:n,relativeSignalPath:r,root:a});d instanceof Promise?d.then(f=>this.handleValueChanged(f,c)):this.handleValueChanged(d,c),l.valueChangedCallbacks||(l.valueChangedCallbacks=new Map);let g=l.valueChangedCallbacks.get(h);g==null&&(g=[],l.valueChangedCallbacks.set(h,g)),g.push(()=>{let f=l.valueProvider(h,{element:n,relativeSignalPath:r,root:a});f instanceof Promise?f.then(x=>this.handleValueChanged(x,c)):this.handleValueChanged(f,c)})}else(p[0]==="?"||p[0]==="#")&&(p.includes(".")?p=H(a,p.substring(1)):p=a[p.substring(1)]);let u=(h,d)=>this.handleValueChanged(d.val,c),m=this.visualizationHandler.subscribeState(p,u);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[c],u,m))}}parseIndirectBinding(t){let{parts:s,signals:e}=X(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,r)=>this.valueChangedCb(r);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)}},ce=class o{_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":M(t)?v.camelToDashCase(s):v.camelToDashCase(s)+"-changed"}parseBinding(t,s,e,i,n){let r=s.substring(n.length);if(i===y.cssvar&&(r="--"+r),!e.startsWith("{")){let l={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),l.signal=e,e.includes("::")){let c=e.split("::");e=c[0],l.signal=e,l.events=c[1].split(",")}l.twoWay=!0,l.events||(t instanceof HTMLInputElement?l.events=[this.getChangedEventName(t,r)]:t instanceof HTMLSelectElement?l.events=[this.getChangedEventName(t,r)]:M(t)?l.events=[this.getChangedEventName(t,r)]:(l.events=[this.getChangedEventName(t,r)],l.maybeLitElement=!0,l.litEventNames=[this.getChangedEventName(t,r)]))}if(e[0]==="!"&&(l.signal=e.substring(1),l.inverted=!0),l.signal.includes(";")){let c=l.signal.split(";");l.expression=c.pop(),l.signal=c.join(";")}return i===y.cssvar||i===y.class?[o.dotToCamelCase(r),l]:i===y.attribute?[r,l]:[v.dashToCamelCase(r),l]}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,r)]),i===y.cssvar||i===y.class?[o.dotToCamelCase(r),a]:i===y.attribute?[r,a]:[v.dashToCamelCase(r),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"||M(t)&&e.events?.[0]==s||!M(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(","):"",r=!1;return(n&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(r=!0),e.signal.trim()[0]=="{"&&(r=!0),!r&&e.target==y.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]:[k+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.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]:[k+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.attribute&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.attribute&&e.expression&&!e.expression.includes(`
+`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[A+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.class&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[D+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.class&&e.expression&&!e.expression.includes(`
+`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[D+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.css&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[z+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.css&&e.expression&&!e.expression.includes(`
+`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[z+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.cssvar&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[L+o.camelToDotCase(s.substring(2)),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.cssvar&&e.expression&&!e.expression.includes(`
+`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[L+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==y.content?[w+"html",JSON.stringify(i)]:e.target==y.attribute?[A+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.class?[D+o.camelToDotCase(s),JSON.stringify(i)]:e.target==y.css?[z+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.cssvar?[L+o.camelToDotCase(s.substring(2)),JSON.stringify(i)]:e.target==y.property&&s=="innerHTML"?[w+"html",JSON.stringify(i)]:e.target==y.property&&s=="textContent"?[w+"text",JSON.stringify(i)]:[k+v.camelToDashCase(s),JSON.stringify(i)])}getBindingAttributeName(t,s,e){return e==y.attribute?A+v.camelToDashCase(s):e==y.class?D+o.camelToDotCase(s):e==y.css?z+v.camelToDashCase(s):e==y.visible?G:e==y.cssvar?L+o.camelToDotCase(s):e==y.property&&s=="innerHTML"?w+"html":e==y.property&&s=="textContent"?w+"text":k+v.camelToDashCase(s)}*getBindings(t){if(t.attributes)for(let s of t.attributes)s.name.startsWith(k)?yield this.parseBinding(t,s.name,s.value,y.property,k):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,y.property,k):s.name.startsWith(A)?yield this.parseBinding(t,s.name,s.value,y.attribute,A):s.name.startsWith(D)?yield this.parseBinding(t,s.name,s.value,y.class,D):s.name.startsWith(z)?yield this.parseBinding(t,s.name,s.value,y.css,z):s.name.startsWith(L)?yield this.parseBinding(t,s.name,s.value,y.cssvar,L):s.name.startsWith(G)&&(yield this.parseBinding(t,s.name,s.value,y.visible,G))}applyAllBindings(t,s,e,i,n){let r=[],a=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),l;for(;l=a.nextNode();){let c=this.getBindings(l);for(let p of c)try{let u=this.applyBinding(l,p,s,e,i);if(r.push(u),p[1].maybeLitElement&&l.localName.includes("-")&&!customElements.get(l.localName)){let m=l,h=p;customElements.whenDefined(l.localName).then(()=>{M(m)&&(u(),h[1].events=h[1].litEventNames,r.push(this.applyBinding(m,h,s,e,i)))})}}catch(u){console.warn("error applying binding",l,p,u)}if(n&&n(l)){l=a.nextSibling();continue}}return r}static#e=0;async parseCssBindings(t,s,e,i){let n=await import("@node-projects/css-parser"),r=n.parse(t),a;for(let c of r.stylesheet.rules)if(c.type===n.CssTypes.rule){for(let p of c.declarations)if(p.type===n.CssTypes.declaration&&p.value.includes(nt)){let u=this.parseCssBinding(p.value,s,e,i);p.value=u[0],a?a.push(...u[1]):a=u[1]}}let l=n.stringify(r,{indent:"",compress:!0});return[at(l),a]}parseCssBinding(t,s,e,i,n){t=t.trim();let r="",a="",l=!1,c="",p=!1,u=null,m=[];for(let h=0;h<t.length;h++){let d=t[h];if(l)if(p)c+=d;else if(u&&d==="\\")p=!0;else if(d===u)u=null;else if(u===null&&d===")"){let g=o.#e++,f=ot+g,x=[f,{signal:c,target:y.cssvar}];c.startsWith("{")&&(x=JSON.parse(c)),m.push(this.applyBinding(s,x,e,i,n)),r+="var("+f+")",l=!1,c=""}else c+=d;else d==="("?(a!=="bind"?(r+=a,r+=d):(l=!0,t[h+1]==="'"||t[h+1]==='"'?(h++,u=t[h]):u=null),a=""):d===" "||d===","||d==="("||d==="+"||d==="-"||d==="*"||d==="/"?(r+=a+d,a=""):a+=d}return[r+a,m]}applyBinding(t,s,e,i,n){let r=[],a,l=()=>{for(let m of r)this._visualizationHandler.unsubscribeState(m[0],m[1],m[2]);if(a)for(let m of a)m()},c=s[1].signal.split(";"),p=new Array(c.length);for(let m=0;m<c.length;m++){let h=c[m];if(p[m]="__"+m,h.includes(":")){let d=h.split(":");p[m]=d[0],h=d[1],c[m]=h}if(h[0]==="?"){if(i){let d=h.substring(1);if(d[0]=="?")c[m]=d;else{c[m]=i[d],d[0]==="$"&&(d=d.substring(1),c[m]="$"+i[d]);let g=()=>{l(),this.applyBinding(t,s,e,i,n)},f=this.getChangedEventName(i,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}}else if(h[0]==="#"){let d=h.substring(1);if(d[0]=="#")c[m]=d;else{c[m]=i[d],d[0]==="$"&&(d=d.substring(1),c[m]="$"+i[d]);let g=()=>{l(),this.applyBinding(t,s,e,i,n)},f=this.getChangedEventName(t,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}h[0]==="."&&(c[m]=this._visualizationHandler.getNormalizedSignalName(h,e,t))}let u=new Array(c.length);for(let m=0;m<c.length;m++){let h=c[m];if(h[0]==="?"){if(i){let d=h.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,i[d],u,m,p,!1,e),f=!1)};i.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>i.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,i[d],u,m,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,f=>i[d]=f)}}else if(h[0]==="#"){let d=h.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,t[d],u,m,p,!1,e),f=!1)};t.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>t.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,t[d],u,m,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,f=>t[d]=f)}else if(h[0]==="$"){let d=h.substring(1);d[0]==="."&&(d=this._visualizationHandler.getNormalizedSignalName(d,e,t)),this._visualizationHandler.getObject(d).then(g=>{this.handleValueChanged(t,i,s,g,u,m,p,!0,e)})}else if(h[0]==="\xA7"){let d=h.substring(1),g=n.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});g instanceof Promise?g.then(x=>this.handleValueChanged(t,i,s,x,u,m,p,!0,e)):this.handleValueChanged(t,i,s,g,u,m,p,!0,e),n.valueChangedCallbacks||(n.valueChangedCallbacks=new Map);let f=n.valueChangedCallbacks.get(d);f==null&&(f=[],n.valueChangedCallbacks.set(d,f)),f.push(()=>{let x=n.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});x instanceof Promise?x.then(we=>this.handleValueChanged(t,i,s,we,u,m,p,!0,e)):this.handleValueChanged(t,i,s,x,u,m,p,!0,e)})}else if(h.includes("{")){let d=new $(this,this._visualizationHandler,h,g=>this.handleValueChanged(t,i,s,g.val,u,m,p,!1,e),t,e,i,n);a||(a=[]),a.push(()=>d.dispose()),s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,g=>d.setState(g))}else if(s[1].historic)if(s[1].historic.reloadInterval){let d={timerId:-1},g=async()=>{let f=await this._visualizationHandler.getHistoricData(h,s[1].historic);this.handleValueChanged(t,i,s,f?.values,u,m,p,!0,e),d.timerId!==null&&(d.timerId=setTimeout(g,s[1].historic.reloadInterval))};g(),a||(a=[]),a.push(()=>{d.timerId>0&&clearTimeout(d.timerId),d.timerId=null})}else this._visualizationHandler.getHistoricData(h,s[1].historic).then(d=>this.handleValueChanged(t,i,s,d?.values,u,m,p,!0,e));else{let d=(g,f)=>this.handleValueChanged(t,i,s,f.val,u,m,p,!1,e);r.push([h,d,this._visualizationHandler.subscribeState(h,d)]),this._visualizationHandler.getState(h).then(g=>this.handleValueChanged(t,i,s,g?.val,u,m,p,!1,e)),s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,g=>this._visualizationHandler.setState(h,g))}}return l}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 it?n.on(()=>{let r;t[1].target==y.attribute?r=s.getAttribute(t[0]):r=s[t[0]],r=o.parseValueWithType(r,t),t[1].compiledExpressionTwoWay&&(r=t[1].compiledExpressionTwoWay(r)),e(r)}):s.addEventListener(i,r=>{let a;t[1].target==y.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=o.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,r,a,l,c){let p=i;if(!l&&r==0&&(p=o.parseValueWithType(p,e)),n[r]=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 u=p!=null?p.toString():p;if(u in e[1].converter){let m=e[1].converter[u];typeof m=="string"?p=new Function(a,"return `"+e[1].converter[u]+"`")(...n):p=m}else{let m=!1,h=parseFloat(p);for(let d in e[1].converter)if(d.length>2&&d[0]===">"&&d[1]==="="){let g=parseFloat(d.substring(2));if(h>=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>2&&d[0]==="<"&&d[1]==="="){let g=parseFloat(d.substring(2));if(h<=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>1&&d[0]===">"){let g=parseFloat(d.substring(1));if(h>g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>1&&d[0]==="<"){let g=parseFloat(d.substring(1));if(h<g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else{let g=d.split("-");if(g.length>1&&(g[0]===""||h>=parseFloat(g[0]))&&(g[1]===""||parseFloat(g[1])>=h)){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}!m&&e[1].converterDefault!==void 0&&(p=e[1].converterDefault)}}if(e[1].inverted&&(p=!p),e[1].writeBackSignal){let u=e[1].writeBackSignal;u[0]==="."&&(u=c+u),this._visualizationHandler.setState(u,p,!0)}e[1].target==y.property?t[e[0]]=p:e[1].target==y.attribute?typeof p=="boolean"?p?t.setAttribute(e[0],""):t.removeAttribute(e[0]):t.setAttribute(e[0],p):e[1].target==y.css?t.style[e[0]]=p:e[1].target==y.cssvar?t.style.setProperty(e[0],p):e[1].target==y.class?p?t.classList.add(e[0]):t.classList.remove(e[0]):e[1].target==y.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 pe=class{name;relativeSignalsPath;commands;parameters};import{deepValue as T,setDeepValue as de,sleep as rt}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import j from"long";var J="cyclic",lt={pointerdown:"pointerup",pointerenter:"pointerleave",mouseenter:"mouseleave",mouseover:"mouseout",focus:"blur",focusin:"focusout",keydown:"keyup"},ue=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(o){this._visualizationHandler=o}async execute(o,t){let s=-1,e=!1,i=t.event?.type,n=i?lt[i]:null;if(n){let r=t.element;i=="pointerdown"&&(r=window),r.addEventListener(n,()=>{e=!0},{once:!0})}for(let r=0;r<o.length;r++){let a=o[r];if(a.type=="Exit")break;if(a.type=="Goto"){let l=await this.getValue(a.label,t);if(r=o.findIndex(c=>c.type=="Label"&&c.label==l),r<0)break}else if(a.type=="Condition"){let l=await this.getValue(a.value1,t),c=await this.getValue(a.value2,t),p=await this.getValue(a.comparisonType,t),u=!1;switch(p){case"==null":u=l==null;break;case"!=null":u=l!=null;break;case"==true":u=l==!0;break;case"==false":u=l==!1;break;case"==":u=l==c;break;case"!=":u=l!=c;break;case">":u=l>c;break;case"<":u=l<c;break;case">=":u=l>=c;break;case"<=":u=l<=c;break;case"&&":u=l&&c;break;case"||":u=l||c;break}if(u){await this.runExternalScript(await this.getValue(a.trueScriptName,t),await this.getValue(a.trueScriptType,t));let m=await this.getValue(a.trueGotoLabel,t);if(m&&(r=o.findIndex(h=>h.type=="Label"&&h.label==m),r<0))break}else{await this.runExternalScript(await this.getValue(a.falseScriptName,t),await this.getValue(a.falseScriptType,t));let m=await this.getValue(a.falseGotoLabel,t);if(m&&(r=o.findIndex(h=>h.type=="Label"&&h.label==m),r<0))break}}else if(a.type=="Repeat"){let l=await this.getValue(a.label,t),c=await this.getValue(a.count,t);if(await this.getValue(a.mode,t)=="eventValid"&&e){e=!1;continue}if(c!=0&&s==-1&&(s=c-1),s==0||(s>0&&s--,r=-1,l&&(r=o.findIndex(u=>u.type=="Label"&&u.label==l),r<0)))continue}else if(!await this.runScriptCommand(a,t))break}}async getValueFromTarget(o,t,s){return o==="property"?T(s.root,t):o==="elementProperty"?T(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(o,t,s,e){o==="property"?de(s.root,t,e):o==="elementProperty"?de(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(o,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"Goto":case"Exit":case"Repeat":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let o=await this.getValue(command.value??500,context);await rt(o);break}case"Console":{let o=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[o](t);break}case"ToggleSignalValue":{let o=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,o,context);await this._visualizationHandler.setState(this.getSignalName(o,context),!s);break}case"ToggleSignalValueThroughList":{let o=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=o.indexOf(e)+1;i>=o.length&&(i=0);let n=o[i];await this._visualizationHandler.setState(this.getSignalName(t,context),n);break}case"SetSignalValue":{let o=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,o,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let o=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,o,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,o,context,e);break}case"DecrementSignalValue":{let o=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,o,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,o,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 o=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,o,context),i=j.fromNumber(1).shiftLeft(t),n=j.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,o,context,n);break}case"ClearBitInSignal":{let o=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,o,context),i=j.fromNumber(1).shiftLeft(t);i.negate();let n=j.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,o,context,n);break}case"ToggleBitInSignal":{let o=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,o,context),i=j.fromNumber(1).shiftLeft(t),n=j.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,o,context,n);break}case"Javascript":{let o=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",o)),command.compiledScript(t);break}case"SetElementProperty":{command=I.upgradeSetElementProperty(command);let o=await this.getValue(command.name,context);o===""&&(o=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),r=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,n);for(let l of a)e=="attribute"?l.setAttribute(o,t):e=="property"?l[o]=t:e=="css"?l.style[o]=t:e=="class"&&(r==="toggle"?l.classList.toggle(o??t):r==="remove"?l.classList.remove(o??t):l.classList.add(o??t));break}case"SubscribeSignal":{let o=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(o,s,null)};this._visualizationHandler.subscribeState(o,s)}else this._visualizationHandler.subscribeState(o,this._subscriptionCallback);break}case"UnsubscribeSignal":{let o=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(o,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let o=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(o);break}case"ClearSignalsInGroup":{let o=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(o);break}case"RunScript":{let o=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(o,t);break}case"ShowMessageBox":{let o=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)?o=1:o=2}else{let i=await this.getValue(command.message,context);alert(i),o=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,o),t&&o!=1)return!1;break}case"ShowPrompt":{let o=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(o,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(o,t,s){if(t==="container"){let e=o.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=o.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(o,t,s,e){let i=this.getTarget(o,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 T(outerContext.root,value.name);case"elementProperty":return T(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let o=T(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(o,outerContext)))?.val}case"event":{let o=outerContext.event;return value.name&&(o=T(o,value.name)),o}case"parameter":return outerContext.parameters[value.name];case"context":return T(outerContext,value.name);case"complexString":{let o=value.name;return o!=null?await this.parseStringWithValues(o,outerContext):null}case"complexSignal":{let o=value.name;if(o!=null){let t=await this.parseStringWithValues(o,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(o,t){let s=X(o),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 r=e[n];typeof r=="object"&&(r=r.val),r==null&&(r=""),i+=r+s.parts[n+1]}return i}getSignalName(o,t){return o[0]==="."?t.relativeSignalsPath+o:o}createScriptContext(o,t,s,e,i){return{root:o,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(o,t,s,e,i,n,r,a){n??=this.createScriptContext;let l=await this.loadAndInitJsObject(o,t,s,e,a);for(let c of s.querySelectorAll("*"))for(let p of c.attributes)if(p.name[0]==="@")try{let u=p.name.substring(1),m=p.value.trim(),h=u.startsWith(J),d=h?parseInt(u.substring(u.indexOf(":")+1)):null,g=await this.resolveHandler(m,l,c,s,e,i,n,r,u);g&&this.bindHandler(c,u,h,d,g)}catch{console.warn("error assigning script",c,p)}return l}async loadAndInitJsObject(o,t,s,e,i){if(!t)return null;try{let r=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"})));return i?i(r):r.init?.(e,s),r}catch(n){return console.error("error parsing javascript - "+o,n),null}}async resolveHandler(o,t,s,e,i,n,r,a,l){if(o[0]!=="{")return p=>{t?.[o]?t[o](p,s,e,i):console.warn(`javascript function named: "${o}" not found, maybe missing a "export" ?`)};let c=JSON.parse(o);if("commands"in c)return p=>this.execute(c.commands,r(i,p,s,c.parameters,c.relativeSignalsPath));if("blocks"in c){let p=null;return async u=>{p??=await Y(c),p(u,e,c.parameters,c.relativeSignalsPath??"",n,r(i,u,s,c.parameters,c.relativeSignalsPath))}}if("name"in c){if(a)return a(s,l,c),null;let p=c.name;return u=>{t?.[p]?t[p](u,s,e,i,c.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(o,t,s,e,i){if(!s){o.addEventListener(t,i);return}let n=setInterval(()=>{o.isConnected?i(null):clearInterval(n)},e)}};import{OverlayLayer as ct,DesignItem as C,InsertAction as pt,BindingTarget as S,PropertyType as U}from"@node-projects/web-component-designer";var he=class{constructor(t,s){this._bindingsHelper=t,this._visualizationHandler=s}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(t,s,e){let i=C.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,ct.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(e,this.rect)}}dragLeave(t,s,e){let i=C.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 l of this.rectMap.values())t.overlayLayer.removeOverlay(l);this.rectMap.clear();let n=C.GetDesignItem(i),r=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(r);if(n&&!n.isRootItem)if(i instanceof HTMLInputElement){let l={signal:e.fullName,target:S.property},c=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",l);n.setAttribute(c[0],c[1])}else{let l={signal:e.fullName,target:S.content},c=this._bindingsHelper.serializeBinding(i,null,l);n.setAttribute(c[0],c[1])}else{let l=t.getNormalizedEventCoordinates(s),c,p,u=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof u?.val=="string")if(u.val.endsWith("jpg")||u.val.endsWith("jpeg")||u.val.endsWith("png")||u.val.endsWith("gif")||u.val.endsWith("svg")){let m=document.createElement("img");c=C.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:S.property},d=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(d[0],d[1]),c.element.src=u.val}else if(u.val.endsWith("mp4")){let m=document.createElement("video");c=C.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:S.property},d=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(d[0],d[1]),c.element.src=u.val}else{let m=document.createElement("iframe");c=C.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h={signal:e.fullName,target:S.property},d=this._bindingsHelper.serializeBinding(m,"src",h);c.setAttribute(d[0],d[1]),c.element.src=u.val}if(!c){let m=document.createElement("input");c=C.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=c.openGroup("Insert");let h=a.writeable!==!1,d={signal:e.fullName,target:S.property,twoWay:h},g=this._bindingsHelper.serializeBinding(m,"value",d);a.type==="boolean"?(g=this._bindingsHelper.serializeBinding(m,"checked",d),c.setAttribute("type","checkbox")):a.role=="date"?(d.twoWay=h,g=this._bindingsHelper.serializeBinding(m,"value-as-number",d),c.setAttribute("type","date"),c.setAttribute("readonly","")):a.role=="datetime"&&(d.twoWay=h,g=this._bindingsHelper.serializeBinding(m,"value-as-number",d),c.setAttribute("type","datetime-local"),c.setAttribute("readonly","")),c.setAttribute(g[0],g[1])}c.setStyle("position","absolute"),c.setStyle("left",l.x+"px"),c.setStyle("top",l.y+"px"),t.instanceServiceContainer.undoService.execute(new pt(t.rootDesignItem,t.rootDesignItem.childCount,c)),p.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([c]))}}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:S.property};s.propertyType==U.attribute&&(n.target=S.attribute),s.propertyType==U.cssValue&&(n.target=S.css),n.signal=e.fullName,n.twoWay=s.propertyType==U.property||s.propertyType==U.propertyAndAttribute;let r=i[0].openGroup("drop binding");for(let a of i){let l=this._bindingsHelper.serializeBinding(a.element,s.name,n);a.setAttribute(l[0],l[1])}r.commit()}};import{BindingMode as q,BindingTarget as me,PropertiesHelper as dt}from"@node-projects/web-component-designer";var ge=class o{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===me.css||e[1].target===me.attribute?dt.camelToDashCase(e[0]):e[0],target:e[1].target,mode:e[1].twoWay?q.twoWay:q.oneWay,invert:e[1].inverted,bindableObjectNames:e[1].signal.split(";"),expression:e[1].expression,expressionTwoWay:e[1].expressionTwoWay,converter:e[1].converter,type:o.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==q.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 fe=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 r of n.bindableObjectNames){let a="signal",l="";if(r.includes(":")){let c=r.split(":")[0],p=r.substring(c.length+1);p.startsWith("?")&&(p=p.substring(1),l="?",a="property",p.startsWith("?")&&(p=p.substring(1),l="??")),s.push({service:this,name:p,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName+" - "+c+":",shortName:c,prefix:l})}else r.startsWith("?")&&(r=r.substring(1),l="?",a="property",r.startsWith("?")&&(r=r.substring(1),l="??")),s.push({service:this,name:r,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName,prefix:l})}}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 ye=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 ve=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 r=JSON.parse(n);if("commands"in r)for(let a of r.commands){for(let l in a){let c=a[l];if(c!=null&&typeof c=="object"){let p=c;if(p.source==="signal")s.push({name:p.name,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+l+"[signal]",refactor:u=>p.name=u});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:r,display:a.type+"/"+i[0].substring(1)+"/"+l+"[property]",refactor:u=>p.name=u});else if(p.source==="complexString")for(let u of p.name.matchAll(/\{(.*?)\}/g)){let m=u[0],h=u[1];if(h[0]==="?"){let d="?";h=h.substring(1),h[0]==="?"&&(d="??",h=h.substring(1)),s.push({name:h,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->property",refactor:g=>p.name=p.name.replace(m,"{"+d+g+"}")})}else s.push({name:h,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->signal",refactor:d=>p.name=p.name.replace(m,"{"+d+"}")})}}}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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.screen=l});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:r,refactor:l=>a.screen=l});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:r,refactor:l=>a.targetSignal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.signal=l});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:r,refactor:l=>a.resultSignal=l});break}}else"blocks"in r;if("parameters"in r)for(let a in r.parameters)typeof r.parameters[a]=="string"&&s.push({name:r.parameters[a],itemType:"parameter",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:i[0].substring(1)+"/parameters/"+a,refactor:l=>r.parameters[a]=l})}}return s}refactor(t,s,e){t.refactor(e);let i=JSON.stringify(t.sourceObject);t.designItem.setAttribute(t.targetName,i)}};import{BasePropertyEditor as ut}from"@node-projects/web-component-designer";var be=class extends ut{_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}};import{EventsService as ht}from"@node-projects/web-component-designer";var xe=class o extends ht{static _cyclicEvent=[{name:`${J}: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(...o._cyclicEvent),s}getEvent(t,s){return s.includes(J)?o._cyclicEvent.find(i=>i.name==s)??{name:s,propertyName:"on"+s,eventObjectName:"Event"}:super.getEvent(t,s)}};export{he as BindableObjectDragDropService,P as BindingsEditor,N as BindingsEditorHistoric,ce as BindingsHelper,E as BlocklyScriptEditor,F as EventAssignment,R as ParameterEditor,ye as PropertyGridDragDropService,pe as Script,ve as ScriptRefactorService,ue as ScriptSystem,be as SignalPropertyEditor,B as SimpleScriptCommandPicker,V as SimpleScriptEditor,fe as VisualizationBindingsRefactorService,ge as VisualizationBindingsService,xe as VisualizationEventsService,W as VisualizationPropertyGrid,A as bindingPrefixAttribute,D as bindingPrefixClass,w as bindingPrefixContent,z as bindingPrefixCss,L as bindingPrefixCssVar,nt as bindingPrefixInsideCss,ot as bindingPrefixInsideCssVarName,k as bindingPrefixProperty,G as bindingPrefixVisible,Ss as bindingsInCssRegex,J as cyclicAttributeName,Y as generateEventCodeFromBlockly,H as getNestedProperty,M as isLit,se as nativeScriptCommandDescriptions,X as parseBindingString,te as simpleScriptEditorHelpHtml};
 //!varname => inverted