@babsey/code-graph 0.0.7 → 0.0.9

package/dist/code-graph.umd.cjs

@@ -1,1833 +1 @@
-(function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("baklavajs"), require("mustache"), require("vue"), require("toposort"), require("uuid"), require("@vueuse/core")) : typeof define === "function" && define.amd ? define(["exports", "baklavajs", "mustache", "vue", "toposort", "uuid", "@vueuse/core"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global["@babsey/code-graph"] = {}, global.baklavajs, global.mustache, global.Vue, global.toposort, global.uuid, global["@vueuse/core"]));
-})(this, (function(exports2, baklavajs, mustache, vue, toposort, uuid, core) {
-  "use strict";
-  class AbstractCodeNode extends baklavajs.AbstractNode {
-    state;
-    code;
-    isCodeNode = true;
-    inputs = {};
-    outputs = {};
-    constructor() {
-      super();
-      this.initializeIo();
-      this.width = 400;
-      this.twoColumn = true;
-      this.state = vue.reactive({
-        codeTemplate: "{{ &outputs.code }}",
-        hidden: false,
-        integrated: false,
-        modules: [],
-        script: "",
-        variableName: ""
-      });
-    }
-    get codeTemplate() {
-      return this.state.codeTemplate;
-    }
-    get idx() {
-      return this.code?.codeNodes.filter((node) => !node.state.integrated).indexOf(this) ?? -1;
-    }
-    get idxByVariableNames() {
-      return this.code?.getNodesBySameVariableNames(this.state.variableName).indexOf(this) ?? -1;
-    }
-    get script() {
-      return this.state.script;
-    }
-    get shortId() {
-      return this.id.slice(0, 6);
-    }
-    get variableName() {
-      return this.state.variableName ? this.state.variableName + (this.idxByVariableNames + 1) : "";
-    }
-    /**
-     * Get connected nodes to the node.
-     * @param type inputs or outputs
-     * @returns code node instances
-     */
-    getConnectedNodes(type) {
-      let nodeIds = [];
-      if (type !== "inputs") {
-        const targets = this.graph?.connections.filter((c) => c.from.name !== "_node").filter((c) => c.from.nodeId === this.id).map((c) => c.to.nodeId);
-        if (targets) nodeIds = nodeIds.concat(targets);
-      }
-      if (type !== "outputs") {
-        const sources = this.graph?.connections.filter((c) => c.from.name !== "_node").filter((c) => c.to.nodeId === this.id).map((c) => c.from.nodeId);
-        if (sources) nodeIds = nodeIds.concat(sources);
-      }
-      if (!nodeIds || nodeIds.length == 0) return [];
-      return nodeIds.map((nodeId) => this.graph?.findNodeById(nodeId));
-    }
-    registerCode(code) {
-      this.code = code;
-    }
-    /**
-     * Render code of this node.
-     */
-    renderCode() {
-      const inputs = {};
-      Object.keys(this.inputs).forEach((intfKey) => {
-        if (intfKey === "_node") return;
-        const intf = this.inputs[intfKey];
-        const value = intf.isString ? `'${intf.value}'` : intf.value;
-        if (intf && intf.state) inputs[intfKey] = intf.state.script.length > 0 ? intf.state.script : value;
-      });
-      const outputs = {};
-      Object.keys(this.outputs).forEach((intfKey) => {
-        if (intfKey === "_node") return;
-        const intf = this.outputs[intfKey];
-        const value = intf.isString ? `'${intf.value}'` : intf.value;
-        if (intf && intf.state) outputs[intfKey] = value;
-      });
-      this.state.script = mustache.render(this.state.codeTemplate, { inputs, outputs });
-      if (this.outputs.code) this.outputs.code.state.script = this.state.script;
-    }
-    updateOutputVariableName() {
-      if (this.outputs.code) this.outputs.code.name = this.variableName;
-    }
-  }
-  class CodeNode extends AbstractCodeNode {
-    /**
-     * The default implementation does nothing.
-     * Overwrite this method to do calculation.
-     * @param inputs Values of all input interfaces
-     * @param globalValues Set of values passed to every node by the engine plugin
-     * @return Values for output interfaces
-     */
-    calculate;
-    load(state) {
-      super.load(state);
-      loadNodeState(this.graph, state);
-    }
-    save() {
-      const state = super.save();
-      saveNodeState(this.graph, state);
-      return state;
-    }
-    updateModules(modules) {
-      if (modules) {
-        this.state.modules = modules;
-      } else if (this.type.includes(".")) {
-        const modules2 = this.type.split(".");
-        this.state.modules.push(modules2.slice(0, modules2.length - 1).join("."));
-      }
-    }
-  }
-  const loadNodeState = (graph, nodeState) => {
-    if (!graph) return;
-    const node = graph.findNodeById(nodeState.id);
-    if (!node || node.subgraph) return;
-    const codeNode = node;
-    if (codeNode.state) {
-      codeNode.state.integrated = nodeState.integrated;
-      codeNode.state.modules = nodeState.modules;
-      codeNode.state.props = nodeState.props;
-    }
-    Object.entries(nodeState.inputs).forEach(([inputKey, inputItem]) => {
-      if (inputKey === "_node") return;
-      if (codeNode.inputs[inputKey]) codeNode.inputs[inputKey].hidden = inputItem.hidden;
-    });
-    Object.entries(nodeState.outputs).forEach(([outputKey, outputItem]) => {
-      if (outputKey === "_node") return;
-      if (codeNode.outputs[outputKey]) codeNode.outputs[outputKey].hidden = outputItem.hidden;
-    });
-  };
-  const saveNodeState = (graph, nodeState) => {
-    if (!graph) return;
-    const node = graph.findNodeById(nodeState.id);
-    if (!node || node.subgraph) return;
-    const codeNode = node;
-    if (codeNode.state) {
-      nodeState.integrated = codeNode.state.integrated;
-      nodeState.modules = codeNode.state.modules;
-    }
-    Object.entries(nodeState.inputs).forEach(([inputKey, inputItem]) => {
-      if (inputKey === "_node") return;
-      if (codeNode.inputs[inputKey]) inputItem.hidden = codeNode.inputs[inputKey].hidden;
-    });
-    Object.entries(nodeState.outputs).forEach(([outputKey, outputItem]) => {
-      if (outputKey === "_node") return;
-      if (codeNode.outputs[outputKey]) outputItem.hidden = codeNode.outputs[outputKey].hidden;
-    });
-  };
-  new baklavajs.NodeInterfaceType("boolean");
-  new baklavajs.NodeInterfaceType("dict");
-  new baklavajs.NodeInterfaceType("list");
-  const nodeType = new baklavajs.NodeInterfaceType("node");
-  const numberType = new baklavajs.NodeInterfaceType("number");
-  const stringType = new baklavajs.NodeInterfaceType("string");
-  const _hoisted_1$f = ["title"];
-  const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeNodeInterface",
-    props: {
-      intf: {}
-    },
-    setup(__props) {
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          title: _ctx.intf.state?.script
-        }, vue.toDisplayString(_ctx.intf.name), 9, _hoisted_1$f);
-      };
-    }
-  });
-  class CodeNodeInterface extends baklavajs.NodeInterface {
-    optional = false;
-    code;
-    state;
-    constructor(name, value) {
-      super(name, value);
-      this.setComponent(vue.markRaw(_sfc_main$g));
-      this.state = vue.reactive({
-        script: ""
-      });
-    }
-    get shortId() {
-      return this.id.slice(0, 6);
-    }
-    // override get value(): T {
-    //   return super.value
-    // }
-    // override set value(value: T) {
-    //   super.value = value;
-    //   if (this.name !== '_node') this.setHidden(false);
-    // }
-  }
-  class ButtonInterface extends CodeNodeInterface {
-    component = vue.markRaw(baklavajs.ButtonInterfaceComponent);
-    callback;
-    constructor(name, callback) {
-      super(name, void 0);
-      this.callback = callback;
-      this.setPort(false);
-    }
-  }
-  class CheckboxInterface extends CodeNodeInterface {
-    component = vue.markRaw(baklavajs.CheckboxInterfaceComponent);
-  }
-  class BaseNumericInterface extends CodeNodeInterface {
-    min;
-    max;
-    constructor(name, value, min, max) {
-      super(name, value);
-      this.min = min;
-      this.max = max;
-    }
-    validate(v) {
-      return (this.min === void 0 || v >= this.min) && (this.max === void 0 || v <= this.max);
-    }
-  }
-  class IntegerInterface extends BaseNumericInterface {
-    component = vue.markRaw(baklavajs.IntegerInterfaceComponent);
-    validate(v) {
-      return Number.isInteger(v) && super.validate(v);
-    }
-  }
-  class CodeInputInterface extends CodeNodeInterface {
-    isCodeInput = true;
-    constructor(name = "", value) {
-      super(name, value);
-      this.setComponent(vue.markRaw(_sfc_main$g));
-    }
-  }
-  class CodeOutputInterface extends CodeNodeInterface {
-    isCodeOutput = true;
-    constructor(name = "", value = "") {
-      super(name, value);
-      this.setComponent(vue.markRaw(_sfc_main$g));
-    }
-    get script() {
-      return this.state.script;
-    }
-    get value() {
-      return super.value;
-    }
-    set value(value) {
-      super.value = value;
-      this.state.script = this.name.length > 0 ? this.name : this.value;
-    }
-  }
-  class NumberInterface extends BaseNumericInterface {
-    component = vue.markRaw(baklavajs.NumberInterfaceComponent);
-  }
-  class SelectInterface extends CodeNodeInterface {
-    component = vue.markRaw(baklavajs.SelectInterfaceComponent);
-    items;
-    constructor(name, value, items) {
-      super(name, value);
-      this.items = items;
-    }
-  }
-  class SliderInterface extends BaseNumericInterface {
-    component = vue.markRaw(baklavajs.SliderInterfaceComponent);
-    min;
-    max;
-    constructor(name, value, min, max) {
-      super(name, value, min, max);
-      this.min = min;
-      this.max = max;
-    }
-  }
-  class TextInterface extends CodeNodeInterface {
-    component = vue.markRaw(baklavajs.TextInputInterfaceComponent);
-    constructor(name, value) {
-      super(name, value);
-      this.setPort(false);
-    }
-  }
-  class TextInputInterface extends CodeNodeInterface {
-    isString = true;
-    component = vue.markRaw(baklavajs.TextInputInterfaceComponent);
-  }
-  class TextareaInputInterface extends CodeNodeInterface {
-    component = vue.markRaw(baklavajs.TextareaInputInterfaceComponent);
-  }
-  function defineCodeNode(definition) {
-    return class extends CodeNode {
-      type = definition.type;
-      inputs = {};
-      outputs = {};
-      constructor() {
-        super();
-        this._title = definition.title ?? definition.type;
-        this.updateModules(definition.modules);
-        if (definition.codeTemplate) this.state.codeTemplate = definition.codeTemplate(this);
-        if (definition.variableName) this.state.variableName = definition.variableName;
-        this.addInput(
-          "_node",
-          new CodeNodeInterface("", []).use(baklavajs.setType, nodeType).use(baklavajs.allowMultipleConnections).setHidden(true)
-        );
-        this.addOutput(
-          "_node",
-          new CodeNodeInterface("", []).use(baklavajs.setType, nodeType).use(baklavajs.allowMultipleConnections).setHidden(true)
-        );
-        this.executeFactory("input", definition.inputs);
-        this.executeFactory("output", definition.outputs);
-        definition.onCreate?.call(this);
-      }
-      calculate = definition.calculate ? (inputs, globalValues) => ({
-        ...definition.calculate.call(this, inputs, globalValues),
-        _node: null
-      }) : void 0;
-      onPlaced() {
-        definition.onPlaced?.call(this);
-      }
-      onDestroy() {
-        definition.onDestroy?.call(this);
-      }
-      onCodeUpdate() {
-        definition.onCodeUpdate?.call(this);
-      }
-      executeFactory(type, factory) {
-        Object.keys(factory || {}).forEach((k) => {
-          const intf = factory[k]();
-          if (type === "input") {
-            this.addInput(k, intf);
-          } else {
-            this.addOutput(k, intf);
-          }
-        });
-      }
-    };
-  }
-  class DynamicCodeNode extends CodeNode {
-    /**
-     * The default implementation does nothing.
-     * Overwrite this method to do calculation.
-     * @param inputs Values of all input interfaces
-     * @param globalValues Set of values passed to every node by the engine plugin
-     * @return Values for output interfaces
-     */
-    calculate;
-  }
-  function defineDynamicCodeNode(definition) {
-    return class extends DynamicCodeNode {
-      type = definition.type;
-      inputs = {};
-      outputs = {};
-      calculate;
-      preventUpdate = false;
-      staticInputKeys = Object.keys(definition.inputs ?? {});
-      staticOutputKeys = Object.keys(definition.outputs ?? {});
-      constructor() {
-        super();
-        this._title = definition.title ?? definition.type;
-        this.updateModules(definition.modules);
-        if (definition.codeTemplate) this.state.codeTemplate = definition.codeTemplate(this);
-        if (definition.variableName) this.state.variableName = definition.variableName;
-        this.addInput(
-          "_node",
-          new CodeNodeInterface("", []).use(baklavajs.setType, nodeType).use(baklavajs.allowMultipleConnections).setHidden(true)
-        );
-        this.addOutput(
-          "_node",
-          new CodeNodeInterface("", []).use(baklavajs.setType, nodeType).use(baklavajs.allowMultipleConnections).setHidden(true)
-        );
-        this.staticInputKeys.push("_node");
-        this.staticOutputKeys.push("_node");
-        this.executeFactory("input", definition.inputs);
-        this.executeFactory("output", definition.outputs);
-        if (definition.calculate) {
-          this.calculate = (inputs, globalValues) => ({
-            ...definition.calculate?.call(this, inputs, globalValues),
-            _node: null
-          });
-        }
-        definition.onCreate?.call(this);
-      }
-      onPlaced() {
-        this.events.update.subscribe(this, (data) => {
-          if (!data) return;
-          if (data.type === "input" && this.staticInputKeys.includes(data.name) || data.type === "output" && this.staticOutputKeys.includes(data.name)) {
-            this.onUpdate();
-          }
-        });
-        this.onUpdate();
-        definition.onPlaced?.call(this);
-      }
-      onDestroy() {
-        definition.onDestroy?.call(this);
-      }
-      onCodeUpdate() {
-        definition.onCodeUpdate?.call(this);
-      }
-      load(state) {
-        this.preventUpdate = true;
-        this.hooks.beforeLoad.execute(state);
-        this.id = state.id;
-        this.title = state.title;
-        for (const k of this.staticInputKeys) {
-          this.inputs[k].load(state.inputs[k]);
-          this.inputs[k].nodeId = this.id;
-          if (k === "_node") continue;
-          this.inputs[k].hidden = state.inputs[k].hidden;
-        }
-        for (const k of this.staticOutputKeys) {
-          this.outputs[k].load(state.outputs[k]);
-          this.outputs[k].nodeId = this.id;
-          if (k === "_node") continue;
-          this.outputs[k].hidden = state.outputs[k].hidden;
-        }
-        this.preventUpdate = false;
-        this.onUpdate();
-        this.preventUpdate = true;
-        for (const k of Object.keys(state.inputs)) {
-          if (this.staticInputKeys.includes(k)) continue;
-          if (!this.inputs[k]) {
-            const value = state.inputs[k].value;
-            let inputInterface;
-            if (typeof value == "number") {
-              inputInterface = new baklavajs.IntegerInterface(k, value).use(baklavajs.setType, numberType);
-            } else {
-              inputInterface = new baklavajs.TextInputInterface(k, JSON.stringify(value)).use(baklavajs.setType, stringType);
-            }
-            inputInterface.use(baklavajs.displayInSidebar, true);
-            this.addInput(k, inputInterface);
-          }
-          if (this.inputs[k]) {
-            this.inputs[k].load(state.inputs[k]);
-            this.inputs[k].nodeId = this.id;
-          }
-        }
-        for (const k of Object.keys(state.outputs)) {
-          if (this.staticOutputKeys.includes(k)) continue;
-          if (!this.outputs[k]) {
-            const outputInterface = new CodeOutputInterface(k);
-            this.addOutput(k, outputInterface);
-          }
-          if (this.outputs[k]) {
-            this.outputs[k].load(state.outputs[k]);
-            this.outputs[k].nodeId = this.id;
-          }
-        }
-        loadNodeState(this.graph, state);
-        this.preventUpdate = false;
-        this.events.loaded.emit(this);
-      }
-      onUpdate() {
-        if (this.preventUpdate) return;
-        if (this.graph) this.graph.activeTransactions++;
-        const inputValues = this.getStaticValues(this.staticInputKeys, this.inputs);
-        const outputValues = this.getStaticValues(this.staticOutputKeys, this.outputs);
-        const result = definition.onUpdate.call(this, inputValues, outputValues);
-        this.updateInterfaces("input", result.inputs ?? {}, result.forceUpdateInputs ?? []);
-        this.updateInterfaces("output", result.outputs ?? {}, result.forceUpdateOutputs ?? []);
-        if (this.graph) this.graph.activeTransactions--;
-      }
-      getStaticValues(keys, interfaces) {
-        const values = {};
-        for (const k of keys) {
-          values[k] = interfaces[k].value;
-        }
-        return values;
-      }
-      updateInterfaces(type, newInterfaces, forceUpdates) {
-        const staticKeys = type === "input" ? this.staticInputKeys : this.staticOutputKeys;
-        const currentInterfaces = type === "input" ? this.inputs : this.outputs;
-        for (const k of Object.keys(currentInterfaces)) {
-          if (staticKeys.includes(k) || newInterfaces[k] && !forceUpdates.includes(k)) continue;
-          if (type === "input") {
-            this.removeInput(k);
-          } else {
-            this.removeOutput(k);
-          }
-        }
-        for (const k of Object.keys(newInterfaces)) {
-          if (currentInterfaces[k]) continue;
-          const intf = newInterfaces[k]();
-          if (type === "input") {
-            this.addInput(k, intf);
-          } else {
-            this.addOutput(k, intf);
-          }
-        }
-      }
-      executeFactory(type, factory) {
-        Object.keys(factory || {}).forEach((k) => {
-          const intf = factory[k]();
-          if (type === "input") {
-            this.addInput(k, intf);
-          } else {
-            this.addOutput(k, intf);
-          }
-        });
-      }
-    };
-  }
-  class Code {
-    _id;
-    _viewModel;
-    _state;
-    constructor(viewModel) {
-      this._id = uuid.v4();
-      this._viewModel = viewModel;
-      this._state = vue.reactive({
-        autosort: false,
-        modules: {},
-        script: "",
-        token: null,
-        template: ""
-      });
-    }
-    get codeNodes() {
-      return getCodeNodes(this.graph);
-    }
-    get connections() {
-      return this.graph.connections;
-    }
-    set connections(values) {
-      this.graph._connections = values;
-    }
-    get graph() {
-      return this.viewModel.displayedGraph;
-    }
-    get id() {
-      return this._id;
-    }
-    get modules() {
-      let categories = [];
-      this.codeNodes.filter((node) => node.state.modules?.length > 0).forEach((node) => {
-        categories = categories.concat(node.state.modules);
-      });
-      if (!categories) return [];
-      categories.sort();
-      return Array.from(new Set(categories.map((category) => this.viewModel.state.modules[category])));
-    }
-    get nodeIds() {
-      return this.codeNodes.map((node) => node.id);
-    }
-    get nodes() {
-      return this.graph.nodes;
-    }
-    set nodes(values) {
-      this.graph._nodes = values;
-    }
-    get scriptedCodeNodes() {
-      return getCodeNodes(this.graph).filter(
-        (codeNode) => codeNode.state?.script.length > 0
-      );
-    }
-    get shortId() {
-      return this.id.slice(0, 6);
-    }
-    get state() {
-      return this._state;
-    }
-    get viewModel() {
-      return this._viewModel;
-    }
-    get visibleNodes() {
-      return this.codeNodes.filter((node) => !node.state?.hidden);
-    }
-    /**
-     * Add code node to graph.
-     * @param node code node
-     * @param props optional
-     */
-    addNode(node, props) {
-      if (!node.code) node.code = this;
-      if (props) node.state.props = props;
-      return this.graph.addNode(node);
-    }
-    /**
-     * Add code node at coordinates.
-     * @param node code node
-     * @param position position
-     * @param props optional
-     * @returns code node
-     */
-    addNodeAtCoordinates = (node, position = { x: 0, y: 0 }, props) => {
-      this.addNode(node, props);
-      if (node.position) node.position = position;
-      return node;
-    };
-    /**
-     * Add connection of code nodes
-     * @param from code node interface
-     * @param to code node interface
-     */
-    addConnection(from, to) {
-      if (from.name !== "_node") from.hidden = false;
-      if (to.name !== "_node") to.hidden = false;
-      this.graph.addConnection(from, to);
-    }
-    /**
-     * Clear code graph.
-     */
-    clear() {
-      this.nodes = [];
-      this.connections = [];
-    }
-    findNodeById(id) {
-      return this.graph.findNodeById(id);
-    }
-    findNodeByType(nodeType2) {
-      return this.codeNodes.find((codeNode) => codeNode.type === nodeType2);
-    }
-    getNodesBySameType(type) {
-      return this.codeNodes.filter((codeNode) => codeNode.type === type);
-    }
-    getNodesBySameVariableNames(variableName) {
-      return this.codeNodes.filter(
-        (codeNode) => codeNode.state.variableName === variableName
-      );
-    }
-    /**
-     * Check whether the graph has this connection.
-     * @param from node interface
-     * @param to node interface
-     * @returns boolean
-     */
-    hasConnection(from, to) {
-      return this.connections.some(
-        (connection) => connection.from.id === from.id && connection.to.id === to.id
-      );
-    }
-    /**
-     * Load template from the file.
-     */
-    loadTemplate(resolve) {
-      resolve.then((template) => {
-        this._state.template = template.default ?? "";
-      });
-    }
-    onCodeUpdate() {
-      this.codeNodes.forEach((codeNode) => codeNode.onCodeUpdate());
-    }
-    /**
-     * Remove connection from the graph
-     * @param connection connection between code nodes
-     */
-    removeConnection(connection) {
-      this.graph.removeConnection(connection);
-    }
-    /**
-     * Remove node from the graph.
-     * @param codeNode code node
-     */
-    removeNode(codeNode) {
-      this.graph.removeNode(codeNode);
-    }
-    /**
-     * Render node codes.
-     */
-    renderNodeCodes() {
-      if (this.codeNodes.length === 0) return;
-      this.codeNodes.forEach((node) => node.renderCode());
-    }
-    /**
-     * Render code.
-     */
-    renderCode() {
-      this.state.script = mustache.render(this.state.template || "", this);
-    }
-    /**
-     * Save code graph.
-     * @returns graph state
-     */
-    save() {
-      if (this.state.autosort) this.sortNodes();
-      const editorState = this.viewModel.editor.save();
-      editorState.graph.id = this.id;
-      this.saveNodeStates(editorState.graph.nodes);
-      return JSON.parse(JSON.stringify(editorState));
-    }
-    /**
-     * Save node states.
-     * @param nodeStates a list of node state.
-     */
-    saveNodeStates(nodeStates) {
-      nodeStates.forEach((nodeState, nodeIdx) => {
-        const node = this.nodes[nodeIdx];
-        Object.entries(nodeState.inputs).forEach(([inputKey]) => {
-          if (nodeState.inputs && node.inputs[inputKey]) nodeState.inputs[inputKey].hidden = node.inputs[inputKey].hidden;
-        });
-        Object.entries(nodeState.outputs).forEach(([outputKey]) => {
-          if (nodeState.outputs && node.outputs[outputKey])
-            nodeState.outputs[outputKey].hidden = node.outputs[outputKey].hidden;
-        });
-      });
-    }
-    /**
-     * Sort code nodes.
-     */
-    sortNodes() {
-      if (this.nodes.length === 0 || this.connections.length === 0) return;
-      try {
-        const edges = this.connections.map((connection) => [
-          connection.to.nodeId,
-          connection.from.nodeId
-        ]);
-        let nodeIds = [...this.nodeIds];
-        nodeIds.reverse();
-        nodeIds = toposort.array(nodeIds, edges);
-        nodeIds.reverse();
-        const unconnected = this.graph.nodes.map((node) => node.id).filter((nodeId) => !nodeIds.includes(nodeId));
-        nodeIds = nodeIds.concat(unconnected);
-        const nodes = nodeIds.map((nodeId) => this.findNodeById(nodeId));
-        if (nodes) this.nodes = nodes;
-      } catch {
-        console.warn("Failed to sort nodes.");
-      }
-    }
-    updateOutputVariableNames() {
-      this.codeNodes.forEach((codeNode) => codeNode.updateOutputVariableName());
-    }
-  }
-  const getCodeNodes = (graph) => {
-    let nodes = [];
-    graph.nodes.forEach((node) => {
-      if (node.subgraph) {
-        nodes = nodes.concat(getCodeNodes(node.subgraph));
-      } else if (node.isCodeNode) {
-        nodes.push(node);
-      }
-    });
-    return nodes;
-  };
-  const getPositionAtColumn = (col = 0, offset = 100) => {
-    const width = 350;
-    const padding = 70;
-    return {
-      x: col * (width + padding),
-      y: offset
-    };
-  };
-  const getPositionBeforeNode = (node) => {
-    const position = { ...node.position };
-    position.x -= 400;
-    position.y += 50;
-    return position;
-  };
-  const transferCodeScript = (graph) => {
-    const { calculationOrder, connectionsFromNode } = baklavajs.sortTopologically(graph);
-    calculationOrder.forEach((node) => {
-      if (!node.isCodeNode) return;
-      const codeNode = node;
-      if (connectionsFromNode.has(codeNode)) {
-        connectionsFromNode.get(codeNode).forEach((c) => {
-          if (c.to.state && c.from.script) c.to.state.script = c.from.script;
-        });
-      }
-    });
-  };
-  const _hoisted_1$e = ["id"];
-  const _hoisted_2$5 = { class: "align-middle" };
-  const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeGraphNodeInterface",
-    props: {
-      node: {},
-      intf: {}
-    },
-    setup(__props) {
-      const props = __props;
-      const { viewModel } = baklavajs.useViewModel();
-      const { hoveredOver, temporaryConnection } = baklavajs.useTemporaryConnection();
-      const el = vue.ref(null);
-      const isConnected = vue.computed(() => props.intf.connectionCount > 0);
-      const classes = vue.computed(() => ({
-        "--connected": isConnected.value
-      }));
-      const startHover = () => {
-        hoveredOver(props.intf);
-      };
-      const endHover = () => {
-        hoveredOver(void 0);
-      };
-      const onRender = () => {
-        if (el.value) {
-          viewModel.value.hooks.renderInterface.execute({ intf: props.intf, el: el.value });
-        }
-      };
-      vue.onMounted(onRender);
-      vue.onUpdated(onRender);
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          id: _ctx.intf.id,
-          ref_key: "el",
-          ref: el,
-          class: vue.normalizeClass(["baklava-node-interface", classes.value])
-        }, [
-          _ctx.intf.port ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 0,
-            class: vue.normalizeClass(["__port", { "--selected": vue.unref(temporaryConnection)?.from === _ctx.intf }]),
-            onPointerover: startHover,
-            onPointerout: endHover
-          }, null, 34)) : vue.createCommentVNode("", true),
-          vue.createElementVNode("span", _hoisted_2$5, [
-            vue.renderSlot(_ctx.$slots, "default")
-          ])
-        ], 10, _hoisted_1$e);
-      };
-    }
-  });
-  const _export_sfc = (sfc, props) => {
-    const target = sfc.__vccOpts || sfc;
-    for (const [key, val] of props) {
-      target[key] = val;
-    }
-    return target;
-  };
-  const _sfc_main$e = {};
-  const _hoisted_1$d = {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-collapse"
-  };
-  function _sfc_render$9(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$d, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("path", { d: "M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm0 2h-9v14h9a1 1 0 0 0 .993 -.883l.007 -.117v-12a1 1 0 0 0 -.883 -.993l-.117 -.007zm-2.293 4.293a1 1 0 0 1 .083 1.32l-.083 .094l-1.292 1.293l1.292 1.293a1 1 0 0 1 .083 1.32l-.083 .094a1 1 0 0 1 -1.32 .083l-.094 -.083l-2 -2a1 1 0 0 1 -.083 -1.32l.083 -.094l2 -2a1 1 0 0 1 1.414 0z" }, null, -1)
-    ])]);
-  }
-  const LayoutSidebarLeftCollapse = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["render", _sfc_render$9]]);
-  const _sfc_main$d = {};
-  const _hoisted_1$c = {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-expand"
-  };
-  function _sfc_render$8(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$c, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("path", { d: "M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm0 2h-9v14h9a1 1 0 0 0 .993 -.883l.007 -.117v-12a1 1 0 0 0 -.883 -.993l-.117 -.007zm-4.387 4.21l.094 .083l2 2a1 1 0 0 1 .083 1.32l-.083 .094l-2 2a1 1 0 0 1 -1.497 -1.32l.083 -.094l1.292 -1.293l-1.292 -1.293a1 1 0 0 1 -.083 -1.32l.083 -.094a1 1 0 0 1 1.32 -.083z" }, null, -1)
-    ])]);
-  }
-  const LayoutSidebarLeftExpand = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$8]]);
-  const _sfc_main$c = {};
-  const _hoisted_1$b = {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    class: "balkava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right"
-  };
-  function _sfc_render$7(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$b, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("path", { d: "M6 21a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3zm8 -16h-8a1 1 0 0 0 -1 1v12a1 1 0 0 0 1 1h8z" }, null, -1)
-    ])]);
-  }
-  const LayoutSidebarRight = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$7]]);
-  const _sfc_main$b = {};
-  const _hoisted_1$a = {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-collapse"
-  };
-  function _sfc_render$6(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$a, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("path", { d: "M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm-3 2h-9a1 1 0 0 0 -.993 .883l-.007 .117v12a1 1 0 0 0 .883 .993l.117 .007h9v-14zm-5.387 4.21l.094 .083l2 2a1 1 0 0 1 .083 1.32l-.083 .094l-2 2a1 1 0 0 1 -1.497 -1.32l.083 -.094l1.292 -1.293l-1.292 -1.293a1 1 0 0 1 -.083 -1.32l.083 -.094a1 1 0 0 1 1.32 -.083z" }, null, -1)
-    ])]);
-  }
-  const LayoutSidebarRightCollapse = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$6]]);
-  const _sfc_main$a = {};
-  const _hoisted_1$9 = {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-expand"
-  };
-  function _sfc_render$5(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$9, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("path", { d: "M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm-3 2h-9a1 1 0 0 0 -.993 .883l-.007 .117v12a1 1 0 0 0 .883 .993l.117 .007h9v-14zm-3.293 4.293a1 1 0 0 1 .083 1.32l-.083 .094l-1.292 1.293l1.292 1.293a1 1 0 0 1 .083 1.32l-.083 .094a1 1 0 0 1 -1.32 .083l-.094 -.083l-2 -2a1 1 0 0 1 -.083 -1.32l.083 -.094l2 -2a1 1 0 0 1 1.414 0z" }, null, -1)
-    ])]);
-  }
-  const LayoutSidebarRightExpand = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$5]]);
-  const _sfc_main$9 = {};
-  const _hoisted_1$8 = {
-    xmlns: "http://www.w3.org/2000/svg",
-    class: "baklava-icon",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    "stroke-width": "2",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round"
-  };
-  function _sfc_render$4(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, [..._cache[0] || (_cache[0] = [
-      vue.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M5 2h5v4h-5z"></path><path d="M15 10h5v4h-5z"></path><path d="M5 18h5v4h-5z"></path><path d="M5 10h5v4h-5z"></path><path d="M10 12h5"></path><path d="M7.5 6v4"></path><path d="M7.5 14v4"></path>', 8)
-    ])]);
-  }
-  const Schema = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$4]]);
-  const _sfc_main$8 = {};
-  const _hoisted_1$7 = {
-    xmlns: "http://www.w3.org/2000/svg",
-    class: "baklava-icon",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    "stroke-width": "2",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round"
-  };
-  function _sfc_render$3(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$7, [..._cache[0] || (_cache[0] = [
-      vue.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M6 2h4v4m-4 0h-1v-1"></path><path d="M15 11v-1h5v4h-2"></path><path d="M5 18h5v4h-5z"></path><path d="M5 10h5v4h-5z"></path><path d="M10 12h2"></path><path d="M7.5 7.5v2.5"></path><path d="M7.5 14v4"></path><path d="M3 3l18 18"></path>', 9)
-    ])]);
-  }
-  const SchemaOff = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$3]]);
-  const _sfc_main$7 = {};
-  const _hoisted_1$6 = {
-    xmlns: "http://www.w3.org/2000/svg",
-    class: "baklava-icon",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    "stroke-width": "2",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round"
-  };
-  function _sfc_render$2(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$6, [..._cache[0] || (_cache[0] = [
-      vue.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M3 3l18 18"></path><path d="M4 7h3m4 0h9"></path><path d="M10 11l0 6"></path><path d="M14 14l0 3"></path><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l.077 -.923"></path><path d="M18.384 14.373l.616 -7.373"></path><path d="M9 5v-1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3"></path>', 8)
-    ])]);
-  }
-  const TrashOff = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$2]]);
-  const _sfc_main$6 = {};
-  const _hoisted_1$5 = {
-    xmlns: "http://www.w3.org/2000/svg",
-    class: "baklava-icon",
-    width: "16",
-    height: "16",
-    viewBox: "0 0 24 24",
-    "stroke-width": "2",
-    stroke: "currentColor",
-    fill: "none",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round"
-  };
-  function _sfc_render$1(_ctx, _cache) {
-    return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$5, [..._cache[0] || (_cache[0] = [
-      vue.createElementVNode("path", {
-        stroke: "none",
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, -1),
-      vue.createElementVNode("circle", {
-        cx: "12",
-        cy: "12",
-        r: "1"
-      }, null, -1),
-      vue.createElementVNode("circle", {
-        cx: "12",
-        cy: "19",
-        r: "1"
-      }, null, -1),
-      vue.createElementVNode("circle", {
-        cx: "12",
-        cy: "5",
-        r: "1"
-      }, null, -1)
-    ])]);
-  }
-  const VerticalDots = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$1]]);
-  const _hoisted_1$4 = ["id", "data-node-type"];
-  const _hoisted_2$4 = {
-    class: "__title-label",
-    style: { "flex-grow": "1" }
-  };
-  const _hoisted_3$2 = { key: 0 };
-  const _hoisted_4$1 = {
-    class: "__menu",
-    style: { "display": "flex" }
-  };
-  const _hoisted_5 = { class: "__outputs" };
-  const _hoisted_6 = { key: 0 };
-  const _hoisted_7 = ["id", "title"];
-  const _hoisted_8 = { class: "__inputs" };
-  const _hoisted_9 = { key: 0 };
-  const _hoisted_10 = ["id", "title"];
-  const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeGraphNode",
-    props: {
-      node: {},
-      selected: { type: Boolean, default: false },
-      dragging: { type: Boolean }
-    },
-    emits: ["select", "start-drag", "update"],
-    setup(__props, { emit: __emit }) {
-      const ContextMenu = baklavajs.Components.ContextMenu;
-      const NodeInterface = baklavajs.Components.NodeInterface;
-      const props = __props;
-      const node = vue.computed(() => props.node);
-      const emit = __emit;
-      const { viewModel } = baklavajs.useViewModel();
-      const { graph, switchGraph } = baklavajs.useGraph();
-      const el = vue.ref(null);
-      const renaming = vue.ref(false);
-      const tempName = vue.ref("");
-      const renameInputEl = vue.ref(null);
-      const isResizing = vue.ref(false);
-      let resizeStartWidth = 0;
-      let resizeStartMouseX = 0;
-      const showContextMenu = vue.ref(false);
-      const contextMenuItems = vue.computed(() => {
-        const items = [
-          { value: "edit", label: "Edit" },
-          { value: "rename", label: "Rename" },
-          { value: "delete", label: "Delete" }
-        ];
-        if (props.node.type.startsWith(baklavajs.GRAPH_NODE_TYPE_PREFIX)) {
-          items.push({ value: "editSubgraph", label: "Edit Subgraph" });
-        }
-        return items;
-      });
-      const classes = vue.computed(() => ({
-        "--selected": props.selected,
-        "--dragging": props.dragging,
-        "--two-column": !!props.node.twoColumn,
-        "--hidden": node.value.state?.hidden
-      }));
-      const classesContent = vue.computed(() => ({
-        "--reverse-y": props.node.reverseY ?? viewModel.value.settings.nodes.reverseY
-      }));
-      const styles = vue.computed(() => ({
-        "top": `${props.node.position?.y ?? 0}px`,
-        "left": `${props.node.position?.x ?? 0}px`,
-        "--width": `${props.node.width ?? viewModel.value.settings.nodes.defaultWidth}px`
-      }));
-      const displayedInputs = vue.computed(() => Object.values(props.node.inputs).filter((ni) => !ni.hidden));
-      const displayedOutputs = vue.computed(() => Object.values(props.node.outputs).filter((ni) => !ni.hidden));
-      const select = () => {
-        emit("select");
-      };
-      const startDrag = (ev) => {
-        if (!props.selected) {
-          select();
-        }
-        emit("start-drag", ev);
-      };
-      const openContextMenu = () => {
-        showContextMenu.value = true;
-      };
-      const closeSidebar = () => {
-        const sidebar = viewModel.value.displayedGraph.sidebar;
-        sidebar.nodeId = "";
-        sidebar.visible = false;
-      };
-      const openSidebar = () => {
-        const sidebar = viewModel.value.displayedGraph.sidebar;
-        sidebar.nodeId = props.node.id;
-        sidebar.visible = true;
-      };
-      const updateSidebar = () => {
-        const sidebar = viewModel.value.displayedGraph.sidebar;
-        sidebar.nodeId = props.node.id;
-      };
-      const onContextMenuClick = async (action) => {
-        switch (action) {
-          case "edit":
-            openSidebar();
-            break;
-          case "delete":
-            graph.value.removeNode(props.node);
-            break;
-          case "rename":
-            tempName.value = props.node.title;
-            renaming.value = true;
-            await vue.nextTick();
-            renameInputEl.value?.focus();
-            break;
-          case "editSubgraph":
-            switchGraph(props.node.template);
-            break;
-        }
-      };
-      const doneRenaming = () => {
-        props.node.title = tempName.value;
-        renaming.value = false;
-      };
-      const onRender = () => {
-        if (el.value) {
-          viewModel.value.hooks.renderNode.execute({ node: props.node, el: el.value });
-        }
-      };
-      const startResize = (ev) => {
-        isResizing.value = true;
-        resizeStartWidth = props.node.width;
-        resizeStartMouseX = ev.clientX;
-        ev.preventDefault();
-      };
-      const doResize = (ev) => {
-        if (!isResizing.value) return;
-        const deltaX = ev.clientX - resizeStartMouseX;
-        const newWidth = resizeStartWidth + deltaX / graph.value.scaling;
-        const minWidth = viewModel.value.settings.nodes.minWidth;
-        const maxWidth = viewModel.value.settings.nodes.maxWidth;
-        props.node.width = Math.max(minWidth, Math.min(maxWidth, newWidth));
-      };
-      const stopResize = () => {
-        isResizing.value = false;
-      };
-      vue.onMounted(() => {
-        onRender();
-        window.addEventListener("mousemove", doResize);
-        window.addEventListener("mouseup", stopResize);
-      });
-      vue.onUpdated(onRender);
-      vue.onBeforeUnmount(() => {
-        window.removeEventListener("mousemove", doResize);
-        window.removeEventListener("mouseup", stopResize);
-      });
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          id: node.value.id,
-          ref_key: "el",
-          ref: el,
-          class: vue.normalizeClass([classes.value, "baklava-node"]),
-          "data-node-type": node.value.type,
-          style: vue.normalizeStyle(styles.value),
-          onPointerdown: select
-        }, [
-          vue.unref(viewModel).settings.nodes.resizable ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 0,
-            class: "__resize-handle",
-            onMousedown: startResize
-          }, null, 32)) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", {
-            class: "__title",
-            onPointerdown: vue.withModifiers(startDrag, ["self", "stop"]),
-            onContextmenu: vue.withModifiers(openContextMenu, ["prevent"])
-          }, [
-            node.value.inputs._node ? (vue.openBlock(), vue.createBlock(_sfc_main$f, {
-              key: 0,
-              node: node.value,
-              intf: node.value.inputs._node,
-              class: "--input",
-              "data-interface-type": "node",
-              style: { "flex-grow": "0" }
-            }, null, 8, ["node", "intf"])) : vue.createCommentVNode("", true),
-            !renaming.value ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
-              vue.createElementVNode("div", _hoisted_2$4, [
-                node.value.idx > -1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$2, vue.toDisplayString(node.value.idx + 1) + " - ", 1)) : vue.createCommentVNode("", true),
-                vue.createTextVNode(vue.toDisplayString(node.value.title) + " (" + vue.toDisplayString(node.value.shortId) + ") ", 1)
-              ]),
-              vue.createElementVNode("div", _hoisted_4$1, [
-                !node.value.subgraph ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-                  !vue.unref(viewModel).displayedGraph.sidebar.visible && vue.unref(viewModel).displayedGraph.sidebar.nodeId !== node.value.id ? (vue.openBlock(), vue.createBlock(vue.unref(LayoutSidebarRightExpand), {
-                    key: 0,
-                    class: "--clickable mx-1",
-                    onClick: openSidebar
-                  })) : vue.unref(viewModel).displayedGraph.sidebar.visible && vue.unref(viewModel).displayedGraph.sidebar.nodeId !== node.value.id ? (vue.openBlock(), vue.createBlock(vue.unref(LayoutSidebarRight), {
-                    key: 1,
-                    class: "--clickable mx-1",
-                    onClick: updateSidebar
-                  })) : (vue.openBlock(), vue.createBlock(vue.unref(LayoutSidebarRightCollapse), {
-                    key: 2,
-                    class: "--clickable mx-1",
-                    onClick: closeSidebar
-                  }))
-                ], 64)) : vue.createCommentVNode("", true),
-                vue.createVNode(vue.unref(VerticalDots), {
-                  class: "--clickable mx-1",
-                  onClick: openContextMenu
-                }),
-                vue.createVNode(vue.unref(ContextMenu), {
-                  modelValue: showContextMenu.value,
-                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => showContextMenu.value = $event),
-                  x: 0,
-                  y: 0,
-                  items: contextMenuItems.value,
-                  onClick: onContextMenuClick
-                }, null, 8, ["modelValue", "items"])
-              ])
-            ], 64)) : vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-              key: 2,
-              ref_key: "renameInputEl",
-              ref: renameInputEl,
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => tempName.value = $event),
-              class: "baklava-input",
-              placeholder: "Node Name",
-              style: { "flex-grow": "1" },
-              type: "text",
-              onBlur: doneRenaming,
-              onKeydown: vue.withKeys(doneRenaming, ["enter"])
-            }, null, 544)), [
-              [vue.vModelText, tempName.value]
-            ]),
-            node.value.outputs._node ? (vue.openBlock(), vue.createBlock(_sfc_main$f, {
-              key: 3,
-              node: node.value,
-              intf: node.value.outputs._node,
-              class: "--output",
-              "data-interface-type": "node"
-            }, null, 8, ["node", "intf"])) : vue.createCommentVNode("", true)
-          ], 32),
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["__content", classesContent.value]),
-            onKeydown: _cache[2] || (_cache[2] = vue.withKeys(vue.withModifiers(() => {
-            }, ["stop"]), ["delete"])),
-            onContextmenu: _cache[3] || (_cache[3] = vue.withModifiers(() => {
-            }, ["prevent"]))
-          }, [
-            vue.createElementVNode("div", _hoisted_5, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayedOutputs.value, (output) => {
-                return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
-                  key: output.id
-                }, [
-                  node.value.state?.hidden ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
-                    output.port ? (vue.openBlock(), vue.createElementBlock("div", {
-                      key: 0,
-                      id: output.id,
-                      title: output.name,
-                      class: "baklava-node-interface --output --connected"
-                    }, [..._cache[4] || (_cache[4] = [
-                      vue.createElementVNode("div", { class: "__port" }, null, -1)
-                    ])], 8, _hoisted_7)) : vue.createCommentVNode("", true)
-                  ])) : vue.renderSlot(_ctx.$slots, "nodeInterface", {
-                    key: 1,
-                    type: "output",
-                    node: node.value,
-                    intf: output
-                  }, () => [
-                    vue.createVNode(vue.unref(NodeInterface), {
-                      node: node.value,
-                      intf: output
-                    }, null, 8, ["node", "intf"])
-                  ])
-                ], 64);
-              }), 128))
-            ]),
-            vue.createElementVNode("div", _hoisted_8, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayedInputs.value, (input) => {
-                return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
-                  key: input.id
-                }, [
-                  node.value.state?.hidden ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
-                    input.port ? (vue.openBlock(), vue.createElementBlock("div", {
-                      key: 0,
-                      id: input.id,
-                      title: input.name,
-                      class: "baklava-node-interface --input --connected"
-                    }, [..._cache[5] || (_cache[5] = [
-                      vue.createElementVNode("div", { class: "__port" }, null, -1)
-                    ])], 8, _hoisted_10)) : vue.createCommentVNode("", true)
-                  ])) : vue.renderSlot(_ctx.$slots, "nodeInterface", {
-                    key: 1,
-                    node: node.value,
-                    intf: input,
-                    type: "input"
-                  }, () => [
-                    vue.createVNode(vue.unref(NodeInterface), {
-                      node: node.value,
-                      intf: input,
-                      title: input.name
-                    }, null, 8, ["node", "intf", "title"])
-                  ])
-                ], 64);
-              }), 128))
-            ])
-          ], 34)
-        ], 46, _hoisted_1$4);
-      };
-    }
-  });
-  const _hoisted_1$3 = ["title"];
-  const _hoisted_2$3 = {
-    key: 0,
-    class: "__label"
-  };
-  const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
-    __name: "Checkbox",
-    props: {
-      modelValue: { type: Boolean },
-      inversed: { type: Boolean },
-      name: {}
-    },
-    emits: ["update:modelValue"],
-    setup(__props, { emit: __emit }) {
-      const emit = __emit;
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["baklava-checkbox", { "--checked": _ctx.inversed ? !_ctx.modelValue : _ctx.modelValue }]),
-          title: _ctx.name,
-          onClick: _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", !_ctx.modelValue))
-        }, [
-          _cache[1] || (_cache[1] = vue.createElementVNode("div", { class: "__checkmark-container" }, [
-            vue.createElementVNode("svg", {
-              xmlns: "http://www.w3.org/2000/svg",
-              width: "18",
-              height: "18",
-              viewBox: "0 0 18 18"
-            }, [
-              vue.createElementVNode("path", {
-                class: "__checkmark",
-                d: "M 6 5 L 6 10 L 16 10",
-                transform: "rotate(-45 10 10)"
-              })
-            ])
-          ], -1)),
-          _ctx.name ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$3, vue.toDisplayString(_ctx.name), 1)) : vue.createCommentVNode("", true)
-        ], 10, _hoisted_1$3);
-      };
-    }
-  });
-  const _hoisted_1$2 = { class: "__header" };
-  const _hoisted_2$2 = { class: "__node-name" };
-  const _hoisted_3$1 = { style: { "display": "flex" } };
-  const _hoisted_4 = {
-    key: 1,
-    class: "__interface"
-  };
-  const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeGraphSidebar",
-    setup(__props) {
-      const { viewModel } = baklavajs.useViewModel();
-      const { graph } = baklavajs.useGraph();
-      const el = vue.ref(null);
-      const width = vue.toRef(viewModel.value.settings.sidebar, "width");
-      const resizable = vue.computed(() => viewModel.value.settings.sidebar.resizable);
-      let resizeStartWidth = 0;
-      let resizeStartMouseX = 0;
-      const node = vue.computed(() => {
-        const id = graph.value.sidebar.nodeId;
-        return graph.value.nodes.find((x) => x.id === id);
-      });
-      const codeNode = vue.computed(() => node.value);
-      const styles = vue.computed(() => ({
-        width: `${width.value}px`
-      }));
-      const displayedInterfaces = vue.computed(() => {
-        if (!node.value) return [];
-        const allIntfs = [...Object.values(node.value.inputs), ...Object.values(node.value.outputs)];
-        return allIntfs.filter((intf) => intf.displayInSidebar && intf.component);
-      });
-      const close = () => {
-        graph.value.sidebar.visible = false;
-      };
-      const doneRenaming = () => {
-        node.value?.events.update.emit(null);
-      };
-      const startResize = (event) => {
-        resizeStartWidth = width.value;
-        resizeStartMouseX = event.clientX;
-        window.addEventListener("mousemove", onMouseMove);
-        window.addEventListener(
-          "mouseup",
-          () => {
-            window.removeEventListener("mousemove", onMouseMove);
-          },
-          { once: true }
-        );
-      };
-      const onMouseMove = (event) => {
-        const maxwidth = el.value?.parentElement?.getBoundingClientRect().width ?? 500;
-        const deltaX = event.clientX - resizeStartMouseX;
-        let newWidth = resizeStartWidth - deltaX;
-        if (newWidth < 300) {
-          newWidth = 300;
-        } else if (newWidth > 0.9 * maxwidth) {
-          newWidth = 0.9 * maxwidth;
-        }
-        width.value = newWidth;
-      };
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          ref_key: "el",
-          ref: el,
-          class: vue.normalizeClass(["baklava-sidebar", { "--open": vue.unref(graph).sidebar.visible }]),
-          style: vue.normalizeStyle(styles.value)
-        }, [
-          resizable.value ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 0,
-            class: "__resizer",
-            onMousedown: startResize
-          }, null, 32)) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_1$2, [
-            vue.createElementVNode("button", {
-              tabindex: "-1",
-              class: "__close",
-              onClick: close
-            }, "×"),
-            vue.createElementVNode("div", _hoisted_2$2, [
-              vue.createElementVNode("b", null, vue.toDisplayString(node.value ? node.value.title : ""), 1)
-            ])
-          ]),
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayedInterfaces.value, (intf) => {
-            return vue.openBlock(), vue.createElementBlock("div", {
-              key: intf.id,
-              class: "__interface"
-            }, [
-              vue.createElementVNode("div", _hoisted_3$1, [
-                vue.createVNode(_sfc_main$4, {
-                  modelValue: intf.hidden,
-                  "onUpdate:modelValue": [
-                    ($event) => intf.hidden = $event,
-                    _cache[0] || (_cache[0] = () => node.value?.events.update.emit(null))
-                  ],
-                  inversed: "",
-                  style: { "margin-right": "8px" }
-                }, null, 8, ["modelValue", "onUpdate:modelValue"]),
-                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(intf.component), {
-                  modelValue: intf.value,
-                  "onUpdate:modelValue": ($event) => intf.value = $event,
-                  node: node.value,
-                  intf,
-                  style: { "width": "100%" }
-                }, null, 8, ["modelValue", "onUpdate:modelValue", "node", "intf"]))
-              ])
-            ]);
-          }), 128)),
-          codeNode.value && codeNode.value.state ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
-            _cache[2] || (_cache[2] = vue.createElementVNode("label", null, "Variable name", -1)),
-            vue.withDirectives(vue.createElementVNode("input", {
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => codeNode.value.state.variableName = $event),
-              type: "text",
-              class: "baklava-input",
-              title: "Variable name",
-              onBlur: doneRenaming,
-              onKeydown: vue.withKeys(doneRenaming, ["enter"])
-            }, null, 544), [
-              [vue.vModelText, codeNode.value.state.variableName]
-            ])
-          ])) : vue.createCommentVNode("", true)
-        ], 6);
-      };
-    }
-  });
-  const _sfc_main$2 = vue.defineComponent({
-    props: {
-      type: {
-        type: String,
-        required: true
-      },
-      title: {
-        type: String,
-        required: true
-      }
-    },
-    setup(props) {
-      const { viewModel } = baklavajs.useViewModel();
-      const { switchGraph } = baklavajs.useGraph();
-      const showContextMenu = vue.ref(false);
-      const hasContextMenu = vue.computed(() => props.type.startsWith(baklavajs.GRAPH_NODE_TYPE_PREFIX));
-      const contextMenuItems = [
-        { label: "Edit Subgraph", value: "editSubgraph" },
-        { label: "Delete Subgraph", value: "deleteSubgraph" }
-      ];
-      const openContextMenu = () => {
-        showContextMenu.value = true;
-      };
-      const onContextMenuClick = (action) => {
-        const graphTemplateId = props.type.substring(baklavajs.GRAPH_NODE_TYPE_PREFIX.length);
-        const graphTemplate = viewModel.value.editor.graphTemplates.find((gt) => gt.id === graphTemplateId);
-        if (!graphTemplate) {
-          return;
-        }
-        switch (action) {
-          case "editSubgraph":
-            switchGraph(graphTemplate);
-            break;
-          case "deleteSubgraph":
-            viewModel.value.editor.removeGraphTemplate(graphTemplate);
-            break;
-        }
-      };
-      return { showContextMenu, hasContextMenu, contextMenuItems, openContextMenu, onContextMenuClick };
-    }
-  });
-  const _hoisted_1$1 = ["data-node-type"];
-  const _hoisted_2$1 = { class: "__title" };
-  const _hoisted_3 = { class: "__title-label" };
-  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("div", {
-      class: "baklava-node --palette",
-      "data-node-type": _ctx.type
-    }, [
-      vue.createElementVNode("div", _hoisted_2$1, [
-        vue.createElementVNode("div", _hoisted_3, vue.toDisplayString(_ctx.title), 1)
-      ])
-    ], 8, _hoisted_1$1);
-  }
-  const PaletteEntry = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render]]);
-  const _hoisted_1 = {
-    class: "baklava-node --palette",
-    style: { "margin-top": "-20px", "margin-bottom": "30px" }
-  };
-  const _hoisted_2 = { key: 0 };
-  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeNodePalette",
-    setup(__props) {
-      const { viewModel } = baklavajs.useViewModel();
-      const { x: mouseX, y: mouseY } = core.usePointer();
-      const { transform } = baklavajs.useTransform();
-      const categories = baklavajs.useNodeCategories(viewModel);
-      const editorEl = vue.inject("editorEl");
-      const searchQuery = vue.ref("");
-      const draggedNode = vue.ref(null);
-      const filterCategoryBySearch = (categories2) => {
-        if (searchQuery.value) {
-          return categories2.filter(
-            (c) => Object.values(c.nodeTypes).some(
-              (nodeType2) => nodeType2.title.toLowerCase().includes(searchQuery.value?.toLowerCase())
-            )
-          );
-        }
-        return categories2;
-      };
-      const filterNodesBySearch = (nodeTypes) => {
-        if (searchQuery.value) {
-          return Object.values(nodeTypes).filter(
-            (nt) => nt.title.toLowerCase().includes(searchQuery.value?.toLowerCase())
-          );
-        }
-        return Object.values(nodeTypes);
-      };
-      const draggedNodeStyles = vue.computed(() => {
-        if (!draggedNode.value || !editorEl?.value) return {};
-        const { left, top } = editorEl.value.getBoundingClientRect();
-        return {
-          top: `${mouseY.value - top}px`,
-          left: `${mouseX.value - left}px`
-        };
-      });
-      const onDragStart = (type, nodeInformation) => {
-        draggedNode.value = {
-          type,
-          nodeInformation
-        };
-        const onDragEnd = () => {
-          const instance = vue.reactive(new nodeInformation.type());
-          viewModel.value.displayedGraph.addNode(instance);
-          const rect = editorEl.value.getBoundingClientRect();
-          const [x, y] = transform(mouseX.value - rect.left, mouseY.value - rect.top);
-          instance.position.x = x;
-          instance.position.y = y;
-          draggedNode.value = null;
-          document.removeEventListener("pointerup", onDragEnd);
-        };
-        document.addEventListener("pointerup", onDragEnd);
-      };
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["baklava-node-palette", { "--open": vue.unref(viewModel).settings.palette.enabled }]),
-            onContextmenu: _cache[1] || (_cache[1] = vue.withModifiers(() => {
-            }, ["stop", "prevent"]))
-          }, [
-            vue.createElementVNode("div", _hoisted_1, [
-              vue.withDirectives(vue.createElementVNode("input", {
-                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
-                type: "text",
-                class: "baklava-input",
-                title: "Filter node types"
-              }, null, 512), [
-                [vue.vModelText, searchQuery.value]
-              ])
-            ]),
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filterCategoryBySearch(vue.unref(categories)), (c) => {
-              return vue.openBlock(), vue.createElementBlock("section", {
-                key: c.name
-              }, [
-                c.name !== "default" ? (vue.openBlock(), vue.createElementBlock("h3", _hoisted_2, vue.toDisplayString(c.name), 1)) : vue.createCommentVNode("", true),
-                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filterNodesBySearch(c.nodeTypes), (ni, nt) => {
-                  return vue.openBlock(), vue.createBlock(PaletteEntry, {
-                    key: nt,
-                    type: nt,
-                    title: ni.title,
-                    onPointerdown: ($event) => onDragStart(nt, ni)
-                  }, null, 8, ["type", "title", "onPointerdown"]);
-                }), 128))
-              ]);
-            }), 128))
-          ], 34),
-          vue.createVNode(vue.Transition, { name: "fade" }, {
-            default: vue.withCtx(() => [
-              draggedNode.value ? (vue.openBlock(), vue.createElementBlock("div", {
-                key: 0,
-                class: "baklava-dragged-node",
-                style: vue.normalizeStyle(draggedNodeStyles.value)
-              }, [
-                vue.createVNode(PaletteEntry, {
-                  type: draggedNode.value.type,
-                  title: draggedNode.value.nodeInformation.title
-                }, null, 8, ["type", "title"])
-              ], 4)) : vue.createCommentVNode("", true)
-            ]),
-            _: 1
-          })
-        ], 64);
-      };
-    }
-  });
-  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-    __name: "CodeGraphEditor",
-    props: {
-      viewModel: {}
-    },
-    setup(__props) {
-      const props = __props;
-      const viewModel = vue.toRef(props, "viewModel");
-      const onUpdate = (node) => node.events.update.emit(null);
-      vue.onMounted(() => {
-        viewModel.value.subscribe();
-        viewModel.value.engine.start();
-      });
-      vue.onUnmounted(() => {
-        viewModel.value.unsubscribe();
-        viewModel.value.engine.stop();
-      });
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(vue.unref(baklavajs.BaklavaEditor), { "view-model": viewModel.value }, {
-          palette: vue.withCtx(() => [
-            vue.createVNode(_sfc_main$1)
-          ]),
-          node: vue.withCtx((nodeProps) => [
-            vue.createVNode(_sfc_main$5, vue.mergeProps(nodeProps, {
-              onUpdate: ($event) => onUpdate(nodeProps.node)
-            }), null, 16, ["onUpdate"])
-          ]),
-          sidebar: vue.withCtx((nodeProps) => [
-            vue.createVNode(_sfc_main$3, vue.normalizeProps(vue.guardReactiveProps(nodeProps)), null, 16)
-          ]),
-          _: 1
-        }, 8, ["view-model"]);
-      };
-    }
-  });
-  const addToolbarCommands = (viewModel) => {
-    const TOGGLE_PALETTE_COMMAND = "TOGGLE_PALETTE";
-    viewModel.commandHandler.registerCommand(TOGGLE_PALETTE_COMMAND, {
-      execute: () => viewModel.settings.palette.enabled = !viewModel.settings.palette.enabled,
-      canExecute: () => true
-    });
-    const CLEAR_ALL_COMMAND = "CLEAR_ALL";
-    viewModel.commandHandler.registerCommand(CLEAR_ALL_COMMAND, {
-      execute: () => viewModel.displayedGraph.nodes.forEach((node) => viewModel.displayedGraph.removeNode(node)),
-      canExecute: () => viewModel.displayedGraph.nodes.length > 0
-    });
-    const TOGGLE_MINIMAP_COMMAND = "TOGGLE_MINIMAP";
-    viewModel.commandHandler.registerCommand(TOGGLE_MINIMAP_COMMAND, {
-      execute: () => viewModel.settings.enableMinimap = !viewModel.settings.enableMinimap,
-      canExecute: () => viewModel.displayedGraph.nodes.length > 1
-    });
-    viewModel.settings.toolbar.commands = [
-      {
-        command: TOGGLE_PALETTE_COMMAND,
-        title: "Toggle palette",
-        // Tooltip text
-        icon: vue.computed(() => viewModel.settings.palette.enabled ? LayoutSidebarLeftCollapse : LayoutSidebarLeftExpand)
-      },
-      ...baklavajs.DEFAULT_TOOLBAR_COMMANDS,
-      {
-        command: CLEAR_ALL_COMMAND,
-        title: "Clear all",
-        // Tooltip text
-        icon: TrashOff
-      },
-      {
-        command: TOGGLE_MINIMAP_COMMAND,
-        title: "Toggle minimap",
-        // Tooltip text
-        icon: vue.computed(() => viewModel.settings.enableMinimap ? SchemaOff : Schema)
-      }
-    ];
-  };
-  const DEFAULT_SETTINGS = {
-    enableMinimap: false,
-    toolbar: {
-      enabled: true
-    },
-    palette: {
-      enabled: true
-    },
-    sidebar: {
-      enabled: true,
-      resizable: true,
-      width: 350
-    },
-    displayValueOnHover: false
-  };
-  function useCodeGraph(props) {
-    const viewModel = baklavajs.useBaklava(props?.existingEditor);
-    viewModel.code = props?.code ? new props.code(viewModel) : new Code(viewModel);
-    addToolbarCommands(viewModel);
-    const settings = {};
-    Object.keys(DEFAULT_SETTINGS).forEach((K) => {
-      settings[K] = typeof DEFAULT_SETTINGS[K] === "object" ? { ...viewModel.settings[K], ...DEFAULT_SETTINGS[K] } : DEFAULT_SETTINGS[K];
-    });
-    viewModel.settings = vue.reactive({ ...viewModel.settings, ...settings });
-    viewModel.settings.nodes.defaultWidth = 350;
-    viewModel.state = vue.reactive({
-      modules: {},
-      token: null
-    });
-    viewModel.engine = new baklavajs.DependencyEngine(viewModel.editor);
-    viewModel.subscribe = () => {
-      if (viewModel.state.token) viewModel.unsubscribe();
-      const token = Symbol();
-      viewModel.displayedGraph.events.addNode.subscribe(token, (node) => node.code = viewModel.code);
-      viewModel.engine.events.beforeRun.subscribe(token, () => {
-        viewModel.engine.pause();
-        if (viewModel.code) {
-          viewModel.code.onCodeUpdate();
-          viewModel.code.sortNodes();
-          viewModel.code.updateOutputVariableNames();
-        }
-        viewModel.engine.resume();
-      });
-      viewModel.engine.events.afterRun.subscribe(token, (result) => {
-        viewModel.engine.pause();
-        baklavajs.applyResult(result, viewModel.editor);
-        transferCodeScript(viewModel.displayedGraph);
-        if (viewModel.code) {
-          viewModel.code.renderNodeCodes();
-          viewModel.code.renderCode();
-        }
-        viewModel.engine.resume();
-      });
-      viewModel.state.token = token;
-    };
-    viewModel.unsubscribe = () => {
-      if (!viewModel.state.token) return;
-      const token = viewModel.state.token;
-      viewModel.displayedGraph.events.addNode.unsubscribe(token);
-      viewModel.engine.events.beforeRun.unsubscribe(token);
-      viewModel.engine.events.afterRun.unsubscribe(token);
-      viewModel.state.token = null;
-    };
-    return viewModel;
-  }
-  Object.defineProperty(exports2, "ButtonInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.ButtonInterfaceComponent
-  });
-  Object.defineProperty(exports2, "CheckboxInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.CheckboxInterfaceComponent
-  });
-  Object.defineProperty(exports2, "IntegerInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.IntegerInterfaceComponent
-  });
-  Object.defineProperty(exports2, "NumberInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.NumberInterfaceComponent
-  });
-  Object.defineProperty(exports2, "SelectInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.SelectInterfaceComponent
-  });
-  Object.defineProperty(exports2, "SliderInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.SliderInterfaceComponent
-  });
-  Object.defineProperty(exports2, "TextInputInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.TextInputInterfaceComponent
-  });
-  Object.defineProperty(exports2, "TextareaInputInterfaceComponent", {
-    enumerable: true,
-    get: () => baklavajs.TextareaInputInterfaceComponent
-  });
-  exports2.AbstractCodeNode = AbstractCodeNode;
-  exports2.ButtonInterface = ButtonInterface;
-  exports2.CheckboxInterface = CheckboxInterface;
-  exports2.Code = Code;
-  exports2.CodeGraphEditor = _sfc_main;
-  exports2.CodeInputInterface = CodeInputInterface;
-  exports2.CodeNode = CodeNode;
-  exports2.CodeNodeInterface = CodeNodeInterface;
-  exports2.CodeOutputInterface = CodeOutputInterface;
-  exports2.DEFAULT_SETTINGS = DEFAULT_SETTINGS;
-  exports2.DynamicCodeNode = DynamicCodeNode;
-  exports2.IntegerInterface = IntegerInterface;
-  exports2.NumberInterface = NumberInterface;
-  exports2.SelectInterface = SelectInterface;
-  exports2.SliderInterface = SliderInterface;
-  exports2.TextInputInterface = TextInputInterface;
-  exports2.TextInterface = TextInterface;
-  exports2.TextareaInputInterface = TextareaInputInterface;
-  exports2.addToolbarCommands = addToolbarCommands;
-  exports2.defineCodeNode = defineCodeNode;
-  exports2.defineDynamicCodeNode = defineDynamicCodeNode;
-  exports2.getCodeNodes = getCodeNodes;
-  exports2.getPositionAtColumn = getPositionAtColumn;
-  exports2.getPositionBeforeNode = getPositionBeforeNode;
-  exports2.loadNodeState = loadNodeState;
-  exports2.saveNodeState = saveNodeState;
-  exports2.transferCodeScript = transferCodeScript;
-  exports2.useCodeGraph = useCodeGraph;
-  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
-}));
+(function(l,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("baklavajs"),require("mustache"),require("vue"),require("toposort"),require("uuid"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","baklavajs","mustache","vue","toposort","uuid","@vueuse/core"],i):(l=typeof globalThis<"u"?globalThis:l||self,i(l["@babsey/code-graph"]={},l.baklavajs,l.mustache,l.Vue,l.toposort,l.uuid,l["@vueuse/core"]))})(this,(function(l,i,v,e,Z,j,ee){"use strict";class R extends i.AbstractNode{state;code;isCodeNode=!0;inputs={};outputs={};constructor(){super(),this.initializeIo(),this.width=400,this.twoColumn=!0,this.state=e.reactive({codeTemplate:"{{ &outputs.code }}",hidden:!1,integrated:!1,modules:[],script:"",variableName:""})}get codeTemplate(){return this.state.codeTemplate}get idx(){return this.code?.codeNodes.filter(t=>!t.state.integrated).indexOf(this)??-1}get idxByVariableNames(){return this.code?.getNodesBySameVariableNames(this.state.variableName).indexOf(this)??-1}get script(){return this.state.script}get shortId(){return this.id.slice(0,6)}get variableName(){return this.state.variableName?this.state.variableName+(this.idxByVariableNames+1):""}getConnectedNodes(t){let n=[];if(t!=="inputs"){const o=this.graph?.connections.filter(s=>s.from.name!=="_node").filter(s=>s.from.nodeId===this.id).map(s=>s.to.nodeId);o&&(n=n.concat(o))}if(t!=="outputs"){const o=this.graph?.connections.filter(s=>s.from.name!=="_node").filter(s=>s.to.nodeId===this.id).map(s=>s.from.nodeId);o&&(n=n.concat(o))}return!n||n.length==0?[]:n.map(o=>this.graph?.findNodeById(o))}registerCode(t){this.code=t}renderCode(){const t={};Object.keys(this.inputs).forEach(o=>{if(o==="_node")return;const s=this.inputs[o],r=s.isString?`'${s.value}'`:s.value;s&&s.state&&(t[o]=s.state.script.length>0?s.state.script:r)});const n={};Object.keys(this.outputs).forEach(o=>{if(o==="_node")return;const s=this.outputs[o],r=s.isString?`'${s.value}'`:s.value;s&&s.state&&(n[o]=r)}),this.state.script=v.render(this.state.codeTemplate,{inputs:t,outputs:n}),this.outputs.code&&(this.outputs.code.state.script=this.state.script)}updateOutputVariableName(){this.outputs.code&&(this.outputs.code.name=this.variableName)}}class O extends R{calculate;load(t){super.load(t),S(this.graph,t)}save(){const t=super.save();return L(this.graph,t),t}updateModules(t){if(t)this.state.modules=t;else if(this.type.includes(".")){const n=this.type.split(".");this.state.modules.push(n.slice(0,n.length-1).join("."))}}}const S=(a,t)=>{if(!a)return;const n=a.findNodeById(t.id);if(!n||n.subgraph)return;const o=n;o.state&&(o.state.integrated=t.integrated,o.state.modules=t.modules,o.state.props=t.props),Object.entries(t.inputs).forEach(([s,r])=>{s!=="_node"&&o.inputs[s]&&(o.inputs[s].hidden=r.hidden)}),Object.entries(t.outputs).forEach(([s,r])=>{s!=="_node"&&o.outputs[s]&&(o.outputs[s].hidden=r.hidden)})},L=(a,t)=>{if(!a)return;const n=a.findNodeById(t.id);if(!n||n.subgraph)return;const o=n;o.state&&(t.integrated=o.state.integrated,t.modules=o.state.modules),Object.entries(t.inputs).forEach(([s,r])=>{s!=="_node"&&o.inputs[s]&&(r.hidden=o.inputs[s].hidden)}),Object.entries(t.outputs).forEach(([s,r])=>{s!=="_node"&&o.outputs[s]&&(r.hidden=o.outputs[s].hidden)})};new i.NodeInterfaceType("boolean"),new i.NodeInterfaceType("dict"),new i.NodeInterfaceType("list");const M=new i.NodeInterfaceType("node"),te=new i.NodeInterfaceType("number"),ne=new i.NodeInterfaceType("string"),oe=["title"],$=e.defineComponent({__name:"CodeNodeInterface",props:{intf:{}},setup(a){return(t,n)=>(e.openBlock(),e.createElementBlock("div",{title:t.intf.state?.script},e.toDisplayString(t.intf.name),9,oe))}});class C extends i.NodeInterface{optional=!1;code;state;constructor(t,n){super(t,n),this.setComponent(e.markRaw($)),this.state=e.reactive({script:""})}get shortId(){return this.id.slice(0,6)}}class se extends C{component=e.markRaw(i.ButtonInterfaceComponent);callback;constructor(t,n){super(t,void 0),this.callback=n,this.setPort(!1)}}class ae extends C{component=e.markRaw(i.CheckboxInterfaceComponent)}class z extends C{min;max;constructor(t,n,o,s){super(t,n),this.min=o,this.max=s}validate(t){return(this.min===void 0||t>=this.min)&&(this.max===void 0||t<=this.max)}}class re extends z{component=e.markRaw(i.IntegerInterfaceComponent);validate(t){return Number.isInteger(t)&&super.validate(t)}}class ie extends C{isCodeInput=!0;constructor(t="",n){super(t,n),this.setComponent(e.markRaw($))}}class P extends C{isCodeOutput=!0;constructor(t="",n=""){super(t,n),this.setComponent(e.markRaw($))}get script(){return this.state.script}get value(){return super.value}set value(t){super.value=t,this.state.script=this.name.length>0?this.name:this.value}}class le extends z{component=e.markRaw(i.NumberInterfaceComponent)}class de extends C{component=e.markRaw(i.SelectInterfaceComponent);items;constructor(t,n,o){super(t,n),this.items=o}}class ce extends z{component=e.markRaw(i.SliderInterfaceComponent);min;max;constructor(t,n,o,s){super(t,n,o,s),this.min=o,this.max=s}}class pe extends C{component=e.markRaw(i.TextInputInterfaceComponent);constructor(t,n){super(t,n),this.setPort(!1)}}class ue extends C{isString=!0;component=e.markRaw(i.TextInputInterfaceComponent)}class he extends C{component=e.markRaw(i.TextareaInputInterfaceComponent)}function me(a){return class extends O{type=a.type;inputs={};outputs={};constructor(){super(),this._title=a.title??a.type,this.updateModules(a.modules),a.codeTemplate&&(this.state.codeTemplate=a.codeTemplate(this)),a.variableName&&(this.state.variableName=a.variableName),this.addInput("_node",new C("",[]).use(i.setType,M).use(i.allowMultipleConnections).setHidden(!0)),this.addOutput("_node",new C("",[]).use(i.setType,M).use(i.allowMultipleConnections).setHidden(!0)),this.executeFactory("input",a.inputs),this.executeFactory("output",a.outputs),a.onCreate?.call(this)}calculate=a.calculate?(t,n)=>({...a.calculate.call(this,t,n),_node:null}):void 0;onPlaced(){a.onPlaced?.call(this)}onDestroy(){a.onDestroy?.call(this)}onCodeUpdate(){a.onCodeUpdate?.call(this)}executeFactory(t,n){Object.keys(n||{}).forEach(o=>{const s=n[o]();t==="input"?this.addInput(o,s):this.addOutput(o,s)})}}}class G extends O{calculate}function fe(a){return class extends G{type=a.type;inputs={};outputs={};calculate;preventUpdate=!1;staticInputKeys=Object.keys(a.inputs??{});staticOutputKeys=Object.keys(a.outputs??{});constructor(){super(),this._title=a.title??a.type,this.updateModules(a.modules),a.codeTemplate&&(this.state.codeTemplate=a.codeTemplate(this)),a.variableName&&(this.state.variableName=a.variableName),this.addInput("_node",new C("",[]).use(i.setType,M).use(i.allowMultipleConnections).setHidden(!0)),this.addOutput("_node",new C("",[]).use(i.setType,M).use(i.allowMultipleConnections).setHidden(!0)),this.staticInputKeys.push("_node"),this.staticOutputKeys.push("_node"),this.executeFactory("input",a.inputs),this.executeFactory("output",a.outputs),a.calculate&&(this.calculate=(t,n)=>({...a.calculate?.call(this,t,n),_node:null})),a.onCreate?.call(this)}onPlaced(){this.events.update.subscribe(this,t=>{t&&(t.type==="input"&&this.staticInputKeys.includes(t.name)||t.type==="output"&&this.staticOutputKeys.includes(t.name))&&this.onUpdate()}),this.onUpdate(),a.onPlaced?.call(this)}onDestroy(){a.onDestroy?.call(this)}onCodeUpdate(){a.onCodeUpdate?.call(this)}load(t){this.preventUpdate=!0,this.hooks.beforeLoad.execute(t),this.id=t.id,this.title=t.title;for(const n of this.staticInputKeys)this.inputs[n].load(t.inputs[n]),this.inputs[n].nodeId=this.id,n!=="_node"&&(this.inputs[n].hidden=t.inputs[n].hidden);for(const n of this.staticOutputKeys)this.outputs[n].load(t.outputs[n]),this.outputs[n].nodeId=this.id,n!=="_node"&&(this.outputs[n].hidden=t.outputs[n].hidden);this.preventUpdate=!1,this.onUpdate(),this.preventUpdate=!0;for(const n of Object.keys(t.inputs))if(!this.staticInputKeys.includes(n)){if(!this.inputs[n]){const o=t.inputs[n].value;let s;typeof o=="number"?s=new i.IntegerInterface(n,o).use(i.setType,te):s=new i.TextInputInterface(n,JSON.stringify(o)).use(i.setType,ne),s.use(i.displayInSidebar,!0),this.addInput(n,s)}this.inputs[n]&&(this.inputs[n].load(t.inputs[n]),this.inputs[n].nodeId=this.id)}for(const n of Object.keys(t.outputs))if(!this.staticOutputKeys.includes(n)){if(!this.outputs[n]){const o=new P(n);this.addOutput(n,o)}this.outputs[n]&&(this.outputs[n].load(t.outputs[n]),this.outputs[n].nodeId=this.id)}S(this.graph,t),this.preventUpdate=!1,this.events.loaded.emit(this)}onUpdate(){if(this.preventUpdate)return;this.graph&&this.graph.activeTransactions++;const t=this.getStaticValues(this.staticInputKeys,this.inputs),n=this.getStaticValues(this.staticOutputKeys,this.outputs),o=a.onUpdate.call(this,t,n);this.updateInterfaces("input",o.inputs??{},o.forceUpdateInputs??[]),this.updateInterfaces("output",o.outputs??{},o.forceUpdateOutputs??[]),this.graph&&this.graph.activeTransactions--}getStaticValues(t,n){const o={};for(const s of t)o[s]=n[s].value;return o}updateInterfaces(t,n,o){const s=t==="input"?this.staticInputKeys:this.staticOutputKeys,r=t==="input"?this.inputs:this.outputs;for(const c of Object.keys(r))s.includes(c)||n[c]&&!o.includes(c)||(t==="input"?this.removeInput(c):this.removeOutput(c));for(const c of Object.keys(n)){if(r[c])continue;const d=n[c]();t==="input"?this.addInput(c,d):this.addOutput(c,d)}}executeFactory(t,n){Object.keys(n||{}).forEach(o=>{const s=n[o]();t==="input"?this.addInput(o,s):this.addOutput(o,s)})}}}class D{_id;_viewModel;_state;constructor(t){this._id=j.v4(),this._viewModel=t,this._state=e.reactive({autosort:!1,modules:{},script:"",token:null,template:""})}get codeNodes(){return T(this.graph)}get connections(){return this.graph.connections}set connections(t){this.graph._connections=t}get graph(){return this.viewModel.displayedGraph}get id(){return this._id}get modules(){let t=[];return this.codeNodes.filter(n=>n.state.modules?.length>0).forEach(n=>{t=t.concat(n.state.modules)}),t?(t.sort(),Array.from(new Set(t.map(n=>this.viewModel.state.modules[n])))):[]}get nodeIds(){return this.codeNodes.map(t=>t.id)}get nodes(){return this.graph.nodes}set nodes(t){this.graph._nodes=t}get scriptedCodeNodes(){return T(this.graph).filter(t=>t.state?.script.length>0)}get shortId(){return this.id.slice(0,6)}get state(){return this._state}get viewModel(){return this._viewModel}get visibleNodes(){return this.codeNodes.filter(t=>!t.state?.hidden)}addNode(t,n){return t.code||(t.code=this),n&&(t.state.props=n),this.graph.addNode(t)}addNodeAtCoordinates=(t,n={x:0,y:0},o)=>(this.addNode(t,o),t.position&&(t.position=n),t);addConnection(t,n){t.name!=="_node"&&(t.hidden=!1),n.name!=="_node"&&(n.hidden=!1),this.graph.addConnection(t,n)}clear(){this.nodes=[],this.connections=[]}findNodeById(t){return this.graph.findNodeById(t)}findNodeByType(t){return this.codeNodes.find(n=>n.type===t)}getNodesBySameType(t){return this.codeNodes.filter(n=>n.type===t)}getNodesBySameVariableNames(t){return this.codeNodes.filter(n=>n.state.variableName===t)}hasConnection(t,n){return this.connections.some(o=>o.from.id===t.id&&o.to.id===n.id)}loadTemplate(t){t.then(n=>{this._state.template=n.default??""})}onCodeUpdate(){this.codeNodes.forEach(t=>t.onCodeUpdate())}removeConnection(t){this.graph.removeConnection(t)}removeNode(t){this.graph.removeNode(t)}renderNodeCodes(){this.codeNodes.length!==0&&this.codeNodes.forEach(t=>t.renderCode())}renderCode(){this.state.script=v.render(this.state.template||"",this)}save(){this.state.autosort&&this.sortNodes();const t=this.viewModel.editor.save();return t.graph.id=this.id,this.saveNodeStates(t.graph.nodes),JSON.parse(JSON.stringify(t))}saveNodeStates(t){t.forEach((n,o)=>{const s=this.nodes[o];Object.entries(n.inputs).forEach(([r])=>{n.inputs&&s.inputs[r]&&(n.inputs[r].hidden=s.inputs[r].hidden)}),Object.entries(n.outputs).forEach(([r])=>{n.outputs&&s.outputs[r]&&(n.outputs[r].hidden=s.outputs[r].hidden)})})}sortNodes(){if(!(this.nodes.length===0||this.connections.length===0))try{const t=this.connections.map(r=>[r.to.nodeId,r.from.nodeId]);let n=[...this.nodeIds];n.reverse(),n=Z.array(n,t),n.reverse();const o=this.graph.nodes.map(r=>r.id).filter(r=>!n.includes(r));n=n.concat(o);const s=n.map(r=>this.findNodeById(r));s&&(this.nodes=s)}catch{console.warn("Failed to sort nodes.")}}updateOutputVariableNames(){this.codeNodes.forEach(t=>t.updateOutputVariableName())}}const T=a=>{let t=[];return a.nodes.forEach(n=>{n.subgraph?t=t.concat(T(n.subgraph)):n.isCodeNode&&t.push(n)}),t},ge=(a=0,t=100)=>({x:a*420,y:t}),ye=a=>{const t={...a.position};return t.x-=400,t.y+=50,t},U=a=>{const{calculationOrder:t,connectionsFromNode:n}=i.sortTopologically(a);t.forEach(o=>{if(!o.isCodeNode)return;const s=o;n.has(s)&&n.get(s).forEach(r=>{r.to.state&&r.from.script&&(r.to.state.script=r.from.script)})})},_e=["id"],Ne={class:"align-middle"},A=e.defineComponent({__name:"CodeGraphNodeInterface",props:{node:{},intf:{}},setup(a){const t=a,{viewModel:n}=i.useViewModel(),{hoveredOver:o,temporaryConnection:s}=i.useTemporaryConnection(),r=e.ref(null),c=e.computed(()=>t.intf.connectionCount>0),d=e.computed(()=>({"--connected":c.value})),h=()=>{o(t.intf)},E=()=>{o(void 0)},b=()=>{r.value&&n.value.hooks.renderInterface.execute({intf:t.intf,el:r.value})};return e.onMounted(b),e.onUpdated(b),(k,x)=>(e.openBlock(),e.createElementBlock("div",{id:k.intf.id,ref_key:"el",ref:r,class:e.normalizeClass(["baklava-node-interface",d.value])},[k.intf.port?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["__port",{"--selected":e.unref(s)?.from===k.intf}]),onPointerover:h,onPointerout:E},null,34)):e.createCommentVNode("",!0),e.createElementVNode("span",Ne,[e.renderSlot(k.$slots,"default")])],10,_e))}}),B=(a,t)=>{const n=a.__vccOpts||a;for(const[o,s]of t)n[o]=s;return n},Ce={},be={xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"currentColor",class:"baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-collapse"};function ke(a,t){return e.openBlock(),e.createElementBlock("svg",be,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("path",{d:"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm0 2h-9v14h9a1 1 0 0 0 .993 -.883l.007 -.117v-12a1 1 0 0 0 -.883 -.993l-.117 -.007zm-2.293 4.293a1 1 0 0 1 .083 1.32l-.083 .094l-1.292 1.293l1.292 1.293a1 1 0 0 1 .083 1.32l-.083 .094a1 1 0 0 1 -1.32 .083l-.094 -.083l-2 -2a1 1 0 0 1 -.083 -1.32l.083 -.094l2 -2a1 1 0 0 1 1.414 0z"},null,-1)])])}const we=B(Ce,[["render",ke]]),Ie={},Ee={xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"currentColor",class:"baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-expand"};function Be(a,t){return e.openBlock(),e.createElementBlock("svg",Ee,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("path",{d:"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm0 2h-9v14h9a1 1 0 0 0 .993 -.883l.007 -.117v-12a1 1 0 0 0 -.883 -.993l-.117 -.007zm-4.387 4.21l.094 .083l2 2a1 1 0 0 1 .083 1.32l-.083 .094l-2 2a1 1 0 0 1 -1.497 -1.32l.083 -.094l1.292 -1.293l-1.292 -1.293a1 1 0 0 1 -.083 -1.32l.083 -.094a1 1 0 0 1 1.32 -.083z"},null,-1)])])}const xe=B(Ie,[["render",Be]]),Ve={},Me={xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"currentColor",class:"balkava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right"};function Te(a,t){return e.openBlock(),e.createElementBlock("svg",Me,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("path",{d:"M6 21a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3zm8 -16h-8a1 1 0 0 0 -1 1v12a1 1 0 0 0 1 1h8z"},null,-1)])])}const Oe=B(Ve,[["render",Te]]),Se={},$e={xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"currentColor",class:"baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-collapse"};function ze(a,t){return e.openBlock(),e.createElementBlock("svg",$e,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("path",{d:"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm-3 2h-9a1 1 0 0 0 -.993 .883l-.007 .117v12a1 1 0 0 0 .883 .993l.117 .007h9v-14zm-5.387 4.21l.094 .083l2 2a1 1 0 0 1 .083 1.32l-.083 .094l-2 2a1 1 0 0 1 -1.497 -1.32l.083 -.094l1.292 -1.293l-1.292 -1.293a1 1 0 0 1 -.083 -1.32l.083 -.094a1 1 0 0 1 1.32 -.083z"},null,-1)])])}const ve=B(Se,[["render",ze]]),Re={},Le={xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"currentColor",class:"baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-expand"};function Pe(a,t){return e.openBlock(),e.createElementBlock("svg",Le,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("path",{d:"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm-3 2h-9a1 1 0 0 0 -.993 .883l-.007 .117v12a1 1 0 0 0 .883 .993l.117 .007h9v-14zm-3.293 4.293a1 1 0 0 1 .083 1.32l-.083 .094l-1.292 1.293l1.292 1.293a1 1 0 0 1 .083 1.32l-.083 .094a1 1 0 0 1 -1.32 .083l-.094 -.083l-2 -2a1 1 0 0 1 -.083 -1.32l.083 -.094l2 -2a1 1 0 0 1 1.414 0z"},null,-1)])])}const Ge=B(Re,[["render",Pe]]),De={},Ue={xmlns:"http://www.w3.org/2000/svg",class:"baklava-icon",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Ae(a,t){return e.openBlock(),e.createElementBlock("svg",Ue,[...t[0]||(t[0]=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M5 2h5v4h-5z"></path><path d="M15 10h5v4h-5z"></path><path d="M5 18h5v4h-5z"></path><path d="M5 10h5v4h-5z"></path><path d="M10 12h5"></path><path d="M7.5 6v4"></path><path d="M7.5 14v4"></path>',8)])])}const Fe=B(De,[["render",Ae]]),He={},We={xmlns:"http://www.w3.org/2000/svg",class:"baklava-icon",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Xe(a,t){return e.openBlock(),e.createElementBlock("svg",We,[...t[0]||(t[0]=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M6 2h4v4m-4 0h-1v-1"></path><path d="M15 11v-1h5v4h-2"></path><path d="M5 18h5v4h-5z"></path><path d="M5 10h5v4h-5z"></path><path d="M10 12h2"></path><path d="M7.5 7.5v2.5"></path><path d="M7.5 14v4"></path><path d="M3 3l18 18"></path>',9)])])}const qe=B(He,[["render",Xe]]),Ye={},Je={xmlns:"http://www.w3.org/2000/svg",class:"baklava-icon",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Ke(a,t){return e.openBlock(),e.createElementBlock("svg",Je,[...t[0]||(t[0]=[e.createStaticVNode('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M3 3l18 18"></path><path d="M4 7h3m4 0h9"></path><path d="M10 11l0 6"></path><path d="M14 14l0 3"></path><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l.077 -.923"></path><path d="M18.384 14.373l.616 -7.373"></path><path d="M9 5v-1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3"></path>',8)])])}const Qe=B(Ye,[["render",Ke]]),Ze={},je={xmlns:"http://www.w3.org/2000/svg",class:"baklava-icon",width:"16",height:"16",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"};function et(a,t){return e.openBlock(),e.createElementBlock("svg",je,[...t[0]||(t[0]=[e.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"},null,-1),e.createElementVNode("circle",{cx:"12",cy:"12",r:"1"},null,-1),e.createElementVNode("circle",{cx:"12",cy:"19",r:"1"},null,-1),e.createElementVNode("circle",{cx:"12",cy:"5",r:"1"},null,-1)])])}const tt=B(Ze,[["render",et]]),nt=["id","data-node-type"],ot={class:"__title-label",style:{"flex-grow":"1"}},st={key:0},at={class:"__menu",style:{display:"flex"}},rt={class:"__outputs"},it={key:0},lt=["id","title"],dt={class:"__inputs"},ct={key:0},pt=["id","title"],ut=e.defineComponent({__name:"CodeGraphNode",props:{node:{},selected:{type:Boolean,default:!1},dragging:{type:Boolean}},emits:["select","start-drag","update"],setup(a,{emit:t}){const n=i.Components.ContextMenu,o=i.Components.NodeInterface,s=a,r=e.computed(()=>s.node),c=t,{viewModel:d}=i.useViewModel(),{graph:h,switchGraph:E}=i.useGraph(),b=e.ref(null),k=e.ref(!1),x=e.ref(""),_=e.ref(null),f=e.ref(!1);let g=0,y=0;const u=e.ref(!1),N=e.computed(()=>{const p=[{value:"edit",label:"Edit"},{value:"rename",label:"Rename"},{value:"delete",label:"Delete"}];return s.node.type.startsWith(i.GRAPH_NODE_TYPE_PREFIX)&&p.push({value:"editSubgraph",label:"Edit Subgraph"}),p}),I=e.computed(()=>({"--selected":s.selected,"--dragging":s.dragging,"--two-column":!!s.node.twoColumn,"--hidden":r.value.state?.hidden})),Ot=e.computed(()=>({"--reverse-y":s.node.reverseY??d.value.settings.nodes.reverseY})),St=e.computed(()=>({top:`${s.node.position?.y??0}px`,left:`${s.node.position?.x??0}px`,"--width":`${s.node.width??d.value.settings.nodes.defaultWidth}px`})),$t=e.computed(()=>Object.values(s.node.inputs).filter(p=>!p.hidden)),zt=e.computed(()=>Object.values(s.node.outputs).filter(p=>!p.hidden)),W=()=>{c("select")},vt=p=>{s.selected||W(),c("start-drag",p)},X=()=>{u.value=!0},Rt=()=>{const p=d.value.displayedGraph.sidebar;p.nodeId="",p.visible=!1},q=()=>{const p=d.value.displayedGraph.sidebar;p.nodeId=s.node.id,p.visible=!0},Lt=()=>{const p=d.value.displayedGraph.sidebar;p.nodeId=s.node.id},Pt=async p=>{switch(p){case"edit":q();break;case"delete":h.value.removeNode(s.node);break;case"rename":x.value=s.node.title,k.value=!0,await e.nextTick(),_.value?.focus();break;case"editSubgraph":E(s.node.template);break}},Y=()=>{s.node.title=x.value,k.value=!1},J=()=>{b.value&&d.value.hooks.renderNode.execute({node:s.node,el:b.value})},Gt=p=>{f.value=!0,g=s.node.width,y=p.clientX,p.preventDefault()},K=p=>{if(!f.value)return;const w=p.clientX-y,m=g+w/h.value.scaling,Dt=d.value.settings.nodes.minWidth,Ut=d.value.settings.nodes.maxWidth;s.node.width=Math.max(Dt,Math.min(Ut,m))},Q=()=>{f.value=!1};return e.onMounted(()=>{J(),window.addEventListener("mousemove",K),window.addEventListener("mouseup",Q)}),e.onUpdated(J),e.onBeforeUnmount(()=>{window.removeEventListener("mousemove",K),window.removeEventListener("mouseup",Q)}),(p,w)=>(e.openBlock(),e.createElementBlock("div",{id:r.value.id,ref_key:"el",ref:b,class:e.normalizeClass([I.value,"baklava-node"]),"data-node-type":r.value.type,style:e.normalizeStyle(St.value),onPointerdown:W},[e.unref(d).settings.nodes.resizable?(e.openBlock(),e.createElementBlock("div",{key:0,class:"__resize-handle",onMousedown:Gt},null,32)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"__title",onPointerdown:e.withModifiers(vt,["self","stop"]),onContextmenu:e.withModifiers(X,["prevent"])},[r.value.inputs._node?(e.openBlock(),e.createBlock(A,{key:0,node:r.value,intf:r.value.inputs._node,class:"--input","data-interface-type":"node",style:{"flex-grow":"0"}},null,8,["node","intf"])):e.createCommentVNode("",!0),k.value?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:2,ref_key:"renameInputEl",ref:_,"onUpdate:modelValue":w[1]||(w[1]=m=>x.value=m),class:"baklava-input",placeholder:"Node Name",style:{"flex-grow":"1"},type:"text",onBlur:Y,onKeydown:e.withKeys(Y,["enter"])},null,544)),[[e.vModelText,x.value]]):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("div",ot,[r.value.idx>-1?(e.openBlock(),e.createElementBlock("span",st,e.toDisplayString(r.value.idx+1)+" - ",1)):e.createCommentVNode("",!0),e.createTextVNode(e.toDisplayString(r.value.title)+" ("+e.toDisplayString(r.value.shortId)+") ",1)]),e.createElementVNode("div",at,[r.value.subgraph?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[!e.unref(d).displayedGraph.sidebar.visible&&e.unref(d).displayedGraph.sidebar.nodeId!==r.value.id?(e.openBlock(),e.createBlock(e.unref(Ge),{key:0,class:"--clickable mx-1",onClick:q})):e.unref(d).displayedGraph.sidebar.visible&&e.unref(d).displayedGraph.sidebar.nodeId!==r.value.id?(e.openBlock(),e.createBlock(e.unref(Oe),{key:1,class:"--clickable mx-1",onClick:Lt})):(e.openBlock(),e.createBlock(e.unref(ve),{key:2,class:"--clickable mx-1",onClick:Rt}))],64)),e.createVNode(e.unref(tt),{class:"--clickable mx-1",onClick:X}),e.createVNode(e.unref(n),{modelValue:u.value,"onUpdate:modelValue":w[0]||(w[0]=m=>u.value=m),x:0,y:0,items:N.value,onClick:Pt},null,8,["modelValue","items"])])],64)),r.value.outputs._node?(e.openBlock(),e.createBlock(A,{key:3,node:r.value,intf:r.value.outputs._node,class:"--output","data-interface-type":"node"},null,8,["node","intf"])):e.createCommentVNode("",!0)],32),e.createElementVNode("div",{class:e.normalizeClass(["__content",Ot.value]),onKeydown:w[2]||(w[2]=e.withKeys(e.withModifiers(()=>{},["stop"]),["delete"])),onContextmenu:w[3]||(w[3]=e.withModifiers(()=>{},["prevent"]))},[e.createElementVNode("div",rt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(zt.value,m=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:m.id},[r.value.state?.hidden?(e.openBlock(),e.createElementBlock("div",it,[m.port?(e.openBlock(),e.createElementBlock("div",{key:0,id:m.id,title:m.name,class:"baklava-node-interface --output --connected"},[...w[4]||(w[4]=[e.createElementVNode("div",{class:"__port"},null,-1)])],8,lt)):e.createCommentVNode("",!0)])):e.renderSlot(p.$slots,"nodeInterface",{key:1,type:"output",node:r.value,intf:m},()=>[e.createVNode(e.unref(o),{node:r.value,intf:m},null,8,["node","intf"])])],64))),128))]),e.createElementVNode("div",dt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList($t.value,m=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:m.id},[r.value.state?.hidden?(e.openBlock(),e.createElementBlock("div",ct,[m.port?(e.openBlock(),e.createElementBlock("div",{key:0,id:m.id,title:m.name,class:"baklava-node-interface --input --connected"},[...w[5]||(w[5]=[e.createElementVNode("div",{class:"__port"},null,-1)])],8,pt)):e.createCommentVNode("",!0)])):e.renderSlot(p.$slots,"nodeInterface",{key:1,node:r.value,intf:m,type:"input"},()=>[e.createVNode(e.unref(o),{node:r.value,intf:m,title:m.name},null,8,["node","intf","title"])])],64))),128))])],34)],46,nt))}}),ht=["title"],mt={key:0,class:"__label"},ft=e.defineComponent({__name:"Checkbox",props:{modelValue:{type:Boolean},inversed:{type:Boolean},name:{}},emits:["update:modelValue"],setup(a,{emit:t}){const n=t;return(o,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["baklava-checkbox",{"--checked":o.inversed?!o.modelValue:o.modelValue}]),title:o.name,onClick:s[0]||(s[0]=r=>n("update:modelValue",!o.modelValue))},[s[1]||(s[1]=e.createElementVNode("div",{class:"__checkmark-container"},[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",viewBox:"0 0 18 18"},[e.createElementVNode("path",{class:"__checkmark",d:"M 6 5 L 6 10 L 16 10",transform:"rotate(-45 10 10)"})])],-1)),o.name?(e.openBlock(),e.createElementBlock("div",mt,e.toDisplayString(o.name),1)):e.createCommentVNode("",!0)],10,ht))}}),gt={class:"__header"},yt={class:"__node-name"},_t={style:{display:"flex"}},Nt={key:1,class:"__interface"},Ct=e.defineComponent({__name:"CodeGraphSidebar",setup(a){const{viewModel:t}=i.useViewModel(),{graph:n}=i.useGraph(),o=e.ref(null),s=e.toRef(t.value.settings.sidebar,"width"),r=e.computed(()=>t.value.settings.sidebar.resizable);let c=0,d=0;const h=e.computed(()=>{const y=n.value.sidebar.nodeId;return n.value.nodes.find(u=>u.id===y)}),E=e.computed(()=>h.value),b=e.computed(()=>({width:`${s.value}px`})),k=e.computed(()=>h.value?[...Object.values(h.value.inputs),...Object.values(h.value.outputs)].filter(u=>u.displayInSidebar&&u.component):[]),x=()=>{n.value.sidebar.visible=!1},_=()=>{h.value?.events.update.emit(null)},f=y=>{c=s.value,d=y.clientX,window.addEventListener("mousemove",g),window.addEventListener("mouseup",()=>{window.removeEventListener("mousemove",g)},{once:!0})},g=y=>{const u=o.value?.parentElement?.getBoundingClientRect().width??500,N=y.clientX-d;let I=c-N;I<300?I=300:I>.9*u&&(I=.9*u),s.value=I};return(y,u)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"el",ref:o,class:e.normalizeClass(["baklava-sidebar",{"--open":e.unref(n).sidebar.visible}]),style:e.normalizeStyle(b.value)},[r.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"__resizer",onMousedown:f},null,32)):e.createCommentVNode("",!0),e.createElementVNode("div",gt,[e.createElementVNode("button",{tabindex:"-1",class:"__close",onClick:x},"×"),e.createElementVNode("div",yt,[e.createElementVNode("b",null,e.toDisplayString(h.value?h.value.title:""),1)])]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.value,N=>(e.openBlock(),e.createElementBlock("div",{key:N.id,class:"__interface"},[e.createElementVNode("div",_t,[e.createVNode(ft,{modelValue:N.hidden,"onUpdate:modelValue":[I=>N.hidden=I,u[0]||(u[0]=()=>h.value?.events.update.emit(null))],inversed:"",style:{"margin-right":"8px"}},null,8,["modelValue","onUpdate:modelValue"]),(e.openBlock(),e.createBlock(e.resolveDynamicComponent(N.component),{modelValue:N.value,"onUpdate:modelValue":I=>N.value=I,node:h.value,intf:N,style:{width:"100%"}},null,8,["modelValue","onUpdate:modelValue","node","intf"]))])]))),128)),E.value&&E.value.state?(e.openBlock(),e.createElementBlock("div",Nt,[u[2]||(u[2]=e.createElementVNode("label",null,"Variable name",-1)),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":u[1]||(u[1]=N=>E.value.state.variableName=N),type:"text",class:"baklava-input",title:"Variable name",onBlur:_,onKeydown:e.withKeys(_,["enter"])},null,544),[[e.vModelText,E.value.state.variableName]])])):e.createCommentVNode("",!0)],6))}}),bt=e.defineComponent({props:{type:{type:String,required:!0},title:{type:String,required:!0}},setup(a){const{viewModel:t}=i.useViewModel(),{switchGraph:n}=i.useGraph(),o=e.ref(!1),s=e.computed(()=>a.type.startsWith(i.GRAPH_NODE_TYPE_PREFIX));return{showContextMenu:o,hasContextMenu:s,contextMenuItems:[{label:"Edit Subgraph",value:"editSubgraph"},{label:"Delete Subgraph",value:"deleteSubgraph"}],openContextMenu:()=>{o.value=!0},onContextMenuClick:h=>{const E=a.type.substring(i.GRAPH_NODE_TYPE_PREFIX.length),b=t.value.editor.graphTemplates.find(k=>k.id===E);if(b)switch(h){case"editSubgraph":n(b);break;case"deleteSubgraph":t.value.editor.removeGraphTemplate(b);break}}}}}),kt=["data-node-type"],wt={class:"__title"},It={class:"__title-label"};function Et(a,t,n,o,s,r){return e.openBlock(),e.createElementBlock("div",{class:"baklava-node --palette","data-node-type":a.type},[e.createElementVNode("div",wt,[e.createElementVNode("div",It,e.toDisplayString(a.title),1)])],8,kt)}const F=B(bt,[["render",Et]]),Bt={class:"baklava-node --palette",style:{"margin-top":"-20px","margin-bottom":"30px"}},xt={key:0},Vt=e.defineComponent({__name:"CodeNodePalette",setup(a){const{viewModel:t}=i.useViewModel(),{x:n,y:o}=ee.usePointer(),{transform:s}=i.useTransform(),r=i.useNodeCategories(t),c=e.inject("editorEl"),d=e.ref(""),h=e.ref(null),E=_=>d.value?_.filter(f=>Object.values(f.nodeTypes).some(g=>g.title.toLowerCase().includes(d.value?.toLowerCase()))):_,b=_=>d.value?Object.values(_).filter(f=>f.title.toLowerCase().includes(d.value?.toLowerCase())):Object.values(_),k=e.computed(()=>{if(!h.value||!c?.value)return{};const{left:_,top:f}=c.value.getBoundingClientRect();return{top:`${o.value-f}px`,left:`${n.value-_}px`}}),x=(_,f)=>{h.value={type:_,nodeInformation:f};const g=()=>{const y=e.reactive(new f.type);t.value.displayedGraph.addNode(y);const u=c.value.getBoundingClientRect(),[N,I]=s(n.value-u.left,o.value-u.top);y.position.x=N,y.position.y=I,h.value=null,document.removeEventListener("pointerup",g)};document.addEventListener("pointerup",g)};return(_,f)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{class:e.normalizeClass(["baklava-node-palette",{"--open":e.unref(t).settings.palette.enabled}]),onContextmenu:f[1]||(f[1]=e.withModifiers(()=>{},["stop","prevent"]))},[e.createElementVNode("div",Bt,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":f[0]||(f[0]=g=>d.value=g),type:"text",class:"baklava-input",title:"Filter node types"},null,512),[[e.vModelText,d.value]])]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(E(e.unref(r)),g=>(e.openBlock(),e.createElementBlock("section",{key:g.name},[g.name!=="default"?(e.openBlock(),e.createElementBlock("h3",xt,e.toDisplayString(g.name),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(b(g.nodeTypes),(y,u)=>(e.openBlock(),e.createBlock(F,{key:u,type:u,title:y.title,onPointerdown:N=>x(u,y)},null,8,["type","title","onPointerdown"]))),128))]))),128))],34),e.createVNode(e.Transition,{name:"fade"},{default:e.withCtx(()=>[h.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"baklava-dragged-node",style:e.normalizeStyle(k.value)},[e.createVNode(F,{type:h.value.type,title:h.value.nodeInformation.title},null,8,["type","title"])],4)):e.createCommentVNode("",!0)]),_:1})],64))}}),Mt=e.defineComponent({__name:"CodeGraphEditor",props:{viewModel:{}},setup(a){const t=a,n=e.toRef(t,"viewModel"),o=s=>s.events.update.emit(null);return e.onMounted(()=>{n.value.subscribe(),n.value.engine.start()}),e.onUnmounted(()=>{n.value.unsubscribe(),n.value.engine.stop()}),(s,r)=>(e.openBlock(),e.createBlock(e.unref(i.BaklavaEditor),{"view-model":n.value},{palette:e.withCtx(()=>[e.createVNode(Vt)]),node:e.withCtx(c=>[e.createVNode(ut,e.mergeProps(c,{onUpdate:d=>o(c.node)}),null,16,["onUpdate"])]),sidebar:e.withCtx(c=>[e.createVNode(Ct,e.normalizeProps(e.guardReactiveProps(c)),null,16)]),_:1},8,["view-model"]))}}),H=a=>{const t="TOGGLE_PALETTE";a.commandHandler.registerCommand(t,{execute:()=>a.settings.palette.enabled=!a.settings.palette.enabled,canExecute:()=>!0});const n="CLEAR_ALL";a.commandHandler.registerCommand(n,{execute:()=>a.displayedGraph.nodes.forEach(s=>a.displayedGraph.removeNode(s)),canExecute:()=>a.displayedGraph.nodes.length>0});const o="TOGGLE_MINIMAP";a.commandHandler.registerCommand(o,{execute:()=>a.settings.enableMinimap=!a.settings.enableMinimap,canExecute:()=>a.displayedGraph.nodes.length>1}),a.settings.toolbar.commands=[{command:t,title:"Toggle palette",icon:e.computed(()=>a.settings.palette.enabled?we:xe)},...i.DEFAULT_TOOLBAR_COMMANDS,{command:n,title:"Clear all",icon:Qe},{command:o,title:"Toggle minimap",icon:e.computed(()=>a.settings.enableMinimap?qe:Fe)}]},V={enableMinimap:!1,toolbar:{enabled:!0},palette:{enabled:!0},sidebar:{enabled:!0,resizable:!0,width:350},displayValueOnHover:!1};function Tt(a){const t=i.useBaklava(a?.existingEditor);t.code=a?.code?new a.code(t):new D(t),H(t);const n={};return Object.keys(V).forEach(o=>{n[o]=typeof V[o]=="object"?{...t.settings[o],...V[o]}:V[o]}),t.settings=e.reactive({...t.settings,...n}),t.settings.nodes.defaultWidth=350,t.state=e.reactive({modules:{},token:null}),t.engine=new i.DependencyEngine(t.editor),t.subscribe=()=>{t.state.token&&t.unsubscribe();const o=Symbol();t.displayedGraph.events.addNode.subscribe(o,s=>s.code=t.code),t.engine.events.beforeRun.subscribe(o,()=>{t.engine.pause(),t.code&&(t.code.onCodeUpdate(),t.code.sortNodes(),t.code.updateOutputVariableNames()),t.engine.resume()}),t.engine.events.afterRun.subscribe(o,s=>{t.engine.pause(),i.applyResult(s,t.editor),U(t.displayedGraph),t.code&&(t.code.renderNodeCodes(),t.code.renderCode()),t.engine.resume()}),t.state.token=o},t.unsubscribe=()=>{if(!t.state.token)return;const o=t.state.token;t.displayedGraph.events.addNode.unsubscribe(o),t.engine.events.beforeRun.unsubscribe(o),t.engine.events.afterRun.unsubscribe(o),t.state.token=null},t}Object.defineProperty(l,"ButtonInterfaceComponent",{enumerable:!0,get:()=>i.ButtonInterfaceComponent}),Object.defineProperty(l,"CheckboxInterfaceComponent",{enumerable:!0,get:()=>i.CheckboxInterfaceComponent}),Object.defineProperty(l,"IntegerInterfaceComponent",{enumerable:!0,get:()=>i.IntegerInterfaceComponent}),Object.defineProperty(l,"NumberInterfaceComponent",{enumerable:!0,get:()=>i.NumberInterfaceComponent}),Object.defineProperty(l,"SelectInterfaceComponent",{enumerable:!0,get:()=>i.SelectInterfaceComponent}),Object.defineProperty(l,"SliderInterfaceComponent",{enumerable:!0,get:()=>i.SliderInterfaceComponent}),Object.defineProperty(l,"TextInputInterfaceComponent",{enumerable:!0,get:()=>i.TextInputInterfaceComponent}),Object.defineProperty(l,"TextareaInputInterfaceComponent",{enumerable:!0,get:()=>i.TextareaInputInterfaceComponent}),l.AbstractCodeNode=R,l.ButtonInterface=se,l.CheckboxInterface=ae,l.Code=D,l.CodeGraphEditor=Mt,l.CodeInputInterface=ie,l.CodeNode=O,l.CodeNodeInterface=C,l.CodeOutputInterface=P,l.DEFAULT_SETTINGS=V,l.DynamicCodeNode=G,l.IntegerInterface=re,l.NumberInterface=le,l.SelectInterface=de,l.SliderInterface=ce,l.TextInputInterface=ue,l.TextInterface=pe,l.TextareaInputInterface=he,l.addToolbarCommands=H,l.defineCodeNode=me,l.defineDynamicCodeNode=fe,l.getCodeNodes=T,l.getPositionAtColumn=ge,l.getPositionBeforeNode=ye,l.loadNodeState=S,l.saveNodeState=L,l.transferCodeScript=U,l.useCodeGraph=Tt,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})}));