@babsey/code-graph 0.4.2 → 0.4.3

package/dist/code-graph.js

@@ -1,10 +1,10 @@
 import ce from "mustache";
-import { reactive as te, defineComponent as F, createElementBlock as b, openBlock as p, toDisplayString as P, markRaw as Y, computed as A, createElementVNode as m, withDirectives as ke, vModelText as xe, createStaticVNode as fe, toRef as $e, ref as B, createVNode as G, unref as O, mergeModels as He, useModel as Nt, resolveComponent as qe, createCommentVNode as L, onMounted as Se, onBeforeUnmount as Je, watch as Qe, createBlock as H, withCtx as ee, normalizeProps as Et, guardReactiveProps as Tt, renderSlot as q, mergeProps as Ot, onUpdated as Ze, normalizeStyle as Ae, normalizeClass as oe, withModifiers as ue, Fragment as U, createTextVNode as et, withKeys as Oe, renderList as ae, nextTick as Mt, resolveDynamicComponent as Be, inject as $t, Transition as St, shallowReadonly as At } from "vue";
+import { reactive as te, defineComponent as F, createElementBlock as b, openBlock as p, toDisplayString as P, markRaw as Y, computed as A, createElementVNode as m, withDirectives as ke, vModelText as xe, createStaticVNode as fe, toRef as $e, ref as H, createVNode as G, unref as O, mergeModels as Be, useModel as Nt, resolveComponent as qe, createCommentVNode as L, onMounted as Se, onBeforeUnmount as Je, watch as Qe, createBlock as B, withCtx as ee, normalizeProps as Et, guardReactiveProps as Tt, renderSlot as q, mergeProps as Ot, onUpdated as Ze, normalizeStyle as Ae, normalizeClass as oe, withModifiers as de, Fragment as U, createTextVNode as et, withKeys as Oe, renderList as ae, nextTick as Mt, resolveDynamicComponent as He, inject as $t, Transition as St, shallowReadonly as At } from "vue";
 import { v4 as re } from "uuid";
-import { AbstractNode as Gt, NodeInterface as J, Graph as Rt, getGraphNodeTypeString as tt, GraphTemplate as jt, GRAPH_NODE_TYPE_PREFIX as Lt, GRAPH_INPUT_NODE_TYPE as Pt, GRAPH_OUTPUT_NODE_TYPE as Vt, Editor as Ht } from "@baklavajs/core";
-import { NodeInterfaceType as ie, BaklavaInterfaceTypes as Bt, setType as V } from "@baklavajs/interface-types";
-import { allowMultipleConnections as de, BaseEngine as zt, sortTopologically as Ut, applyResult as nt } from "@baklavajs/engine";
-import { displayInSidebar as ot, CheckboxInterfaceComponent as Dt, useGraph as Ge, IntegerInterfaceComponent as Ft, TextInputInterfaceComponent as st, NumberInterfaceComponent as Yt, SelectInterfaceComponent as Wt, SliderInterfaceComponent as Kt, TextareaInputInterfaceComponent as Xt, Commands as ne, DEFAULT_TOOLBAR_COMMANDS as qt, BaklavaEditor as Jt, Components as Me, useViewModel as me, useTemporaryConnection as Qt, useTransform as Zt, useNodeCategories as en, TextInputInterface as at, DEFAULT_SETTINGS as tn, useCommandHandler as nn, useHistory as on, useClipboard as sn, registerDeleteNodesCommand as an, registerSaveSubgraphCommand as rn, registerSwitchToMainGraphCommand as ln, registerSidebarCommands as un, registerZoomToFitCommands as dn, setViewNodeProperties as cn } from "@baklavajs/renderer-vue";
+import { AbstractNode as Gt, NodeInterface as J, Graph as Rt, getGraphNodeTypeString as tt, GraphTemplate as jt, GRAPH_NODE_TYPE_PREFIX as Lt, GRAPH_INPUT_NODE_TYPE as Pt, GRAPH_OUTPUT_NODE_TYPE as Vt, Editor as Bt } from "@baklavajs/core";
+import { NodeInterfaceType as ie, BaklavaInterfaceTypes as Ht, setType as V } from "@baklavajs/interface-types";
+import { allowMultipleConnections as ue, BaseEngine as zt, sortTopologically as Ut, applyResult as nt } from "@baklavajs/engine";
+import { displayInSidebar as ot, CheckboxInterfaceComponent as Dt, useGraph as Ge, IntegerInterfaceComponent as Ft, TextInputInterfaceComponent as st, NumberInterfaceComponent as Yt, SelectInterfaceComponent as Wt, SliderInterfaceComponent as Kt, TextareaInputInterfaceComponent as Xt, Commands as ne, DEFAULT_TOOLBAR_COMMANDS as qt, BaklavaEditor as Jt, Components as Me, useViewModel as me, useTemporaryConnection as Qt, useTransform as Zt, useNodeCategories as en, TextInputInterface as at, DEFAULT_SETTINGS as tn, useCommandHandler as nn, useHistory as on, useClipboard as sn, registerDeleteNodesCommand as an, registerSaveSubgraphCommand as rn, registerSwitchToMainGraphCommand as ln, registerSidebarCommands as dn, registerZoomToFitCommands as un, setViewNodeProperties as cn } from "@baklavajs/renderer-vue";
 import pn from "toposort";
 import { SequentialHook as ze } from "@baklavajs/events";
 import { usePointer as hn } from "@vueuse/core";
@@ -309,8 +309,8 @@ class ve extends D {
     super.value = e, this.name !== "_code" && this.setHidden(!1);
   }
 }
-const lt = new ie("boolean"), bn = new ie("dict"), ut = new ie("list"), K = new ie("node"), dt = new ie("number"), ct = new ie("string"), pt = new ie("tuple"), la = (n) => {
-  new Bt(n.editor, { viewPlugin: n }).addTypes(lt, bn, ut, K, dt, ct, pt);
+const lt = new ie("boolean"), bn = new ie("dict"), dt = new ie("list"), K = new ie("node"), ut = new ie("number"), ct = new ie("string"), pt = new ie("tuple"), la = (n) => {
+  new Ht(n.editor, { viewPlugin: n }).addTypes(lt, bn, dt, K, ut, ct, pt);
 };
 class yn extends ve {
   constructor(e, t) {
@@ -336,7 +336,7 @@ class Le extends ve {
   min;
   max;
   constructor(e, t, s, o) {
-    super(e, t), this.min = s, this.max = o, this.use(V, dt);
+    super(e, t), this.min = s, this.max = o, this.use(V, ut);
   }
   validate(e) {
     return (this.min === void 0 || e >= this.min) && (this.max === void 0 || e <= this.max);
@@ -348,9 +348,9 @@ class ht extends Le {
     return Number.isInteger(e) && super.validate(e);
   }
 }
-class ua extends ve {
+class da extends ve {
   constructor(e = "", t = "") {
-    super(e, t), this.setComponent(Y(st)), this.use(V, ut);
+    super(e, t), this.setComponent(Y(st)), this.use(V, dt);
   }
   getValue = () => `[${this.value}]`;
 }
@@ -370,7 +370,7 @@ class wn extends Pe {
     super(e, t), this.items = s;
   }
 }
-class da extends Le {
+class ua extends Le {
   component = Y(Kt);
   min;
   max;
@@ -440,10 +440,10 @@ function ha(n) {
     constructor() {
       super(), this._title = n.title ?? n.type, this.executeFactory("input", n.inputs), this.executeFactory("output", n.outputs), n.calculate && (this.calculate = (e, t) => n.calculate.call(this, { inputs: e, ...t })), n.onCreate?.call(this), this.name = n.name ?? n.type, this.updateModules(n.modules), n.variableName != null && (this.state.variableName = n.variableName), n.codeTemplate && (this.codeTemplate = n.codeTemplate), this.addInput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       ), this.addOutput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       );
     }
     onPlaced() {
@@ -482,10 +482,10 @@ function fa(n) {
     constructor() {
       super(), this._title = n.title ?? n.type, this.executeFactory("input", n.inputs), this.executeFactory("output", n.outputs), n.calculate && (this.calculate = (e, t) => n.calculate?.call(this, e, t)), n.onCreate?.call(this), this.name = n.name ?? n.type, this.updateModules(n.modules), n.codeTemplate && (this.codeTemplate = n.codeTemplate), n.variableName && (this.state.variableName = n.variableName), this.addInput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       ), this.addOutput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       ), this.staticInputKeys.push("_code"), this.staticOutputKeys.push("_code");
     }
     onPlaced() {
@@ -667,24 +667,24 @@ class Mn extends zt {
       Object.entries(r.inputs).forEach(([f, C]) => {
         l[f] = this.getInterfaceValue(t, C.id);
       }), r.isCodeNode && (r.updateCodeTemplate(), r.updateOutputNames()), this.events.beforeNodeCalculation.emit({ inputValues: l, node: r });
-      let d;
+      let u;
       if (r.calculate) {
-        if (d = await r.calculate(l, { globalValues: s, engine: this }), a.has(r))
-          for (const [f, C] of Object.entries(d))
-            this.hooks.transferData.execute(d[f], C), a.get(r).forEach((h) => t.set(h.to.id, C));
+        if (u = await r.calculate(l, { globalValues: s, engine: this }), a.has(r))
+          for (const [f, C] of Object.entries(u))
+            this.hooks.transferData.execute(u[f], C), a.get(r).forEach((h) => t.set(h.to.id, C));
       } else {
-        d = {};
+        u = {};
         for (const [f, C] of Object.entries(r.outputs))
-          d[f] = this.getInterfaceValue(t, C.id);
+          u[f] = this.getInterfaceValue(t, C.id);
       }
-      this.events.afterNodeCalculation.emit({ outputValues: d, node: r }), i.set(r.id, new Map(Object.entries(d))), a.has(r) && a.get(r).forEach((f) => {
+      this.events.afterNodeCalculation.emit({ outputValues: u, node: r }), i.set(r.id, new Map(Object.entries(u))), a.has(r) && a.get(r).forEach((f) => {
         const C = Object.entries(r.outputs).find(([, N]) => N.id === f.from.id)?.[0];
         if (!C)
           throw new Error(
             `Could not find key for interface ${f.from.id}
 This is likely an internal issue. Please report it on GitHub.`
           );
-        const h = this.hooks.transferData.execute(d[C], f);
+        const h = this.hooks.transferData.execute(u[C], f);
         C !== "_code" && (f.to.allowMultipleConnections ? t.has(f.to.id) ? t.get(f.to.id).push(h) : t.set(f.to.id, [h]) : t.set(f.to.id, h));
       });
     }
@@ -761,7 +761,7 @@ function Ln(n, e) {
     m("path", { d: "M4 8m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" }, null, -1)
   ])]);
 }
-const Pn = /* @__PURE__ */ R(Rn, [["render", Ln]]), Vn = {}, Hn = {
+const Pn = /* @__PURE__ */ R(Rn, [["render", Ln]]), Vn = {}, Bn = {
   xmlns: "http://www.w3.org/2000/svg",
   width: "24",
   height: "24",
@@ -773,8 +773,8 @@ const Pn = /* @__PURE__ */ R(Rn, [["render", Ln]]), Vn = {}, Hn = {
   "stroke-linejoin": "round",
   class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-copy"
 };
-function Bn(n, e) {
-  return p(), b("svg", Hn, [...e[0] || (e[0] = [
+function Hn(n, e) {
+  return p(), b("svg", Bn, [...e[0] || (e[0] = [
     m("path", {
       stroke: "none",
       d: "M0 0h24v24H0z",
@@ -784,7 +784,7 @@ function Bn(n, e) {
     m("path", { d: "M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" }, null, -1)
   ])]);
 }
-const zn = /* @__PURE__ */ R(Vn, [["render", Bn]]), Un = {}, Dn = {
+const zn = /* @__PURE__ */ R(Vn, [["render", Hn]]), Un = {}, Dn = {
   xmlns: "http://www.w3.org/2000/svg",
   width: "24",
   height: "24",
@@ -1028,7 +1028,7 @@ function Vo(n, e) {
     fe('<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 Ho = /* @__PURE__ */ R(Lo, [["render", Vo]]), Bo = {}, zo = {
+const Bo = /* @__PURE__ */ R(Lo, [["render", Vo]]), Ho = {}, zo = {
   xmlns: "http://www.w3.org/2000/svg",
   width: "24",
   height: "24",
@@ -1051,7 +1051,7 @@ function Uo(n, e) {
     m("path", { d: "M6 6l12 12" }, null, -1)
   ])]);
 }
-const Do = /* @__PURE__ */ R(Bo, [["render", Uo]]), vt = "CLEAR_ALL", gt = "RUN_ENGINE", bt = "TOGGLE_MINIMAP", yt = "TOGGLE_PALETTE", Fo = (n, e, t) => {
+const Do = /* @__PURE__ */ R(Ho, [["render", Uo]]), vt = "CLEAR_ALL", gt = "RUN_ENGINE", bt = "TOGGLE_MINIMAP", yt = "TOGGLE_PALETTE", Fo = (n, e, t) => {
   const s = t.zoomToFit.paddingLeft;
   e.registerCommand(yt, {
     execute: () => {
@@ -1082,7 +1082,7 @@ const Do = /* @__PURE__ */ R(Bo, [["render", Uo]]), vt = "CLEAR_ALL", gt = "RUN_
     command: vt,
     title: "Clear all",
     // Tooltip text
-    icon: A(() => Ho)
+    icon: A(() => Bo)
   }, o = {
     command: bt,
     title: "Toggle minimap",
@@ -1412,10 +1412,10 @@ function qo(n) {
         this.subgraph.outputs.some((s) => s.id === t) || this.removeOutput(t);
       this.addInput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       ), this.addOutput(
         "_code",
-        new D("_code", []).use(V, K).use(de).setHidden(!0)
+        new D("_code", []).use(V, K).use(ue).setHidden(!0)
       ), this.addOutput("_calculationResults", new J("_calculationResults", void 0).setHidden(!0));
     }
     /**
@@ -1435,8 +1435,8 @@ function qo(n) {
           )?.outputs.placeholder.id : r = this.subgraph?.nodes.find(
             (C) => kt.isGraphOutputNode(C) && C.graphInterfaceId === t.id
           )?.inputs.placeholder.id;
-          const l = this.subgraph?.connections.find((f) => r === (s ? f.from : f.to)?.id), d = s ? l?.to : l?.from;
-          if (d) return Reflect.get(d, i);
+          const l = this.subgraph?.connections.find((f) => r === (s ? f.from : f.to)?.id), u = s ? l?.to : l?.from;
+          if (u) return Reflect.get(u, i);
         }
       });
     }
@@ -1489,7 +1489,7 @@ class Ne extends jt {
       name: h.name,
       nodeId: o(h.nodeId),
       nodeInterfaceId: o(h.nodeInterfaceId)
-    })), d = this.outputs.map((h) => ({
+    })), u = this.outputs.map((h) => ({
       id: h.id,
       name: h.name,
       nodeId: o(h.nodeId),
@@ -1499,7 +1499,7 @@ class Ne extends jt {
       nodes: i,
       connections: r,
       inputs: l,
-      outputs: d
+      outputs: u
     };
     return e || (e = new Ie(this.editor)), e.load(f).forEach((h) => console.warn(h)), e.template = this, e;
   }
@@ -1546,7 +1546,7 @@ function os() {
                     );
                   }
                 });
-                var l = r(279), d = /* @__PURE__ */ r.n(l), f = r(370), C = /* @__PURE__ */ r.n(f), h = r(817), N = /* @__PURE__ */ r.n(h);
+                var l = r(279), u = /* @__PURE__ */ r.n(l), f = r(370), C = /* @__PURE__ */ r.n(f), h = r(817), N = /* @__PURE__ */ r.n(h);
                 function v(g) {
                   try {
                     return document.execCommand(g);
@@ -1557,7 +1557,7 @@ function os() {
                 var w = function(c) {
                   var _ = N()(c);
                   return v("cut"), _;
-                }, u = w;
+                }, d = w;
                 function y(g) {
                   var c = document.documentElement.getAttribute("dir") === "rtl", _ = document.createElement("textarea");
                   _.style.fontSize = "12pt", _.style.border = "0", _.style.padding = "0", _.style.margin = "0", _.style.position = "absolute", _.style[c ? "right" : "left"] = "-9999px";
@@ -1600,7 +1600,7 @@ function os() {
                       container: I
                     });
                   if (E)
-                    return x === "cut" ? u(E) : S(E, {
+                    return x === "cut" ? d(E) : S(E, {
                       container: I
                     });
                 }, pe = Z;
@@ -1781,7 +1781,7 @@ function os() {
                   }, {
                     key: "cut",
                     value: function(I) {
-                      return u(I);
+                      return d(I);
                     }
                     /**
                      * Returns the support of the given action, or all actions if no action is
@@ -1797,7 +1797,7 @@ function os() {
                       }), W;
                     }
                   }]), _;
-                })(d()), M = _e;
+                })(u()), M = _e;
               })
             ),
             /***/
@@ -1809,11 +1809,11 @@ function os() {
                   var r = Element.prototype;
                   r.matches = r.matchesSelector || r.mozMatchesSelector || r.msMatchesSelector || r.oMatchesSelector || r.webkitMatchesSelector;
                 }
-                function l(d, f) {
-                  for (; d && d.nodeType !== i; ) {
-                    if (typeof d.matches == "function" && d.matches(f))
-                      return d;
-                    d = d.parentNode;
+                function l(u, f) {
+                  for (; u && u.nodeType !== i; ) {
+                    if (typeof u.matches == "function" && u.matches(f))
+                      return u;
+                    u = u.parentNode;
                   }
                 }
                 a.exports = l;
@@ -1824,22 +1824,22 @@ function os() {
               /***/
               (function(a, i, r) {
                 var l = r(828);
-                function d(h, N, v, w, u) {
+                function u(h, N, v, w, d) {
                   var y = C.apply(this, arguments);
-                  return h.addEventListener(v, y, u), {
+                  return h.addEventListener(v, y, d), {
                     destroy: function() {
-                      h.removeEventListener(v, y, u);
+                      h.removeEventListener(v, y, d);
                     }
                   };
                 }
-                function f(h, N, v, w, u) {
-                  return typeof h.addEventListener == "function" ? d.apply(null, arguments) : typeof v == "function" ? d.bind(null, document).apply(null, arguments) : (typeof h == "string" && (h = document.querySelectorAll(h)), Array.prototype.map.call(h, function(y) {
-                    return d(y, N, v, w, u);
+                function f(h, N, v, w, d) {
+                  return typeof h.addEventListener == "function" ? u.apply(null, arguments) : typeof v == "function" ? u.bind(null, document).apply(null, arguments) : (typeof h == "string" && (h = document.querySelectorAll(h)), Array.prototype.map.call(h, function(y) {
+                    return u(y, N, v, w, d);
                   }));
                 }
                 function C(h, N, v, w) {
-                  return function(u) {
-                    u.delegateTarget = l(u.target, N), u.delegateTarget && w.call(h, u);
+                  return function(d) {
+                    d.delegateTarget = l(d.target, N), d.delegateTarget && w.call(h, d);
                   };
                 }
                 a.exports = f;
@@ -1866,42 +1866,42 @@ function os() {
             370: (
               /***/
               (function(a, i, r) {
-                var l = r(879), d = r(438);
-                function f(v, w, u) {
-                  if (!v && !w && !u)
+                var l = r(879), u = r(438);
+                function f(v, w, d) {
+                  if (!v && !w && !d)
                     throw new Error("Missing required arguments");
                   if (!l.string(w))
                     throw new TypeError("Second argument must be a String");
-                  if (!l.fn(u))
+                  if (!l.fn(d))
                     throw new TypeError("Third argument must be a Function");
                   if (l.node(v))
-                    return C(v, w, u);
+                    return C(v, w, d);
                   if (l.nodeList(v))
-                    return h(v, w, u);
+                    return h(v, w, d);
                   if (l.string(v))
-                    return N(v, w, u);
+                    return N(v, w, d);
                   throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList");
                 }
-                function C(v, w, u) {
-                  return v.addEventListener(w, u), {
+                function C(v, w, d) {
+                  return v.addEventListener(w, d), {
                     destroy: function() {
-                      v.removeEventListener(w, u);
+                      v.removeEventListener(w, d);
                     }
                   };
                 }
-                function h(v, w, u) {
+                function h(v, w, d) {
                   return Array.prototype.forEach.call(v, function(y) {
-                    y.addEventListener(w, u);
+                    y.addEventListener(w, d);
                   }), {
                     destroy: function() {
                       Array.prototype.forEach.call(v, function(y) {
-                        y.removeEventListener(w, u);
+                        y.removeEventListener(w, d);
                       });
                     }
                   };
                 }
-                function N(v, w, u) {
-                  return d(document.body, v, w, u);
+                function N(v, w, d) {
+                  return u(document.body, v, w, d);
                 }
                 a.exports = f;
               })
@@ -1915,8 +1915,8 @@ function os() {
                   if (r.nodeName === "SELECT")
                     r.focus(), l = r.value;
                   else if (r.nodeName === "INPUT" || r.nodeName === "TEXTAREA") {
-                    var d = r.hasAttribute("readonly");
-                    d || r.setAttribute("readonly", ""), r.select(), r.setSelectionRange(0, r.value.length), d || r.removeAttribute("readonly"), l = r.value;
+                    var u = r.hasAttribute("readonly");
+                    u || r.setAttribute("readonly", ""), r.select(), r.setSelectionRange(0, r.value.length), u || r.removeAttribute("readonly"), l = r.value;
                   } else {
                     r.hasAttribute("contenteditable") && r.focus();
                     var f = window.getSelection(), C = document.createRange();
@@ -1934,32 +1934,32 @@ function os() {
                 function i() {
                 }
                 i.prototype = {
-                  on: function(r, l, d) {
+                  on: function(r, l, u) {
                     var f = this.e || (this.e = {});
                     return (f[r] || (f[r] = [])).push({
                       fn: l,
-                      ctx: d
+                      ctx: u
                     }), this;
                   },
-                  once: function(r, l, d) {
+                  once: function(r, l, u) {
                     var f = this;
                     function C() {
-                      f.off(r, C), l.apply(d, arguments);
+                      f.off(r, C), l.apply(u, arguments);
                     }
-                    return C._ = l, this.on(r, C, d);
+                    return C._ = l, this.on(r, C, u);
                   },
                   emit: function(r) {
-                    var l = [].slice.call(arguments, 1), d = ((this.e || (this.e = {}))[r] || []).slice(), f = 0, C = d.length;
+                    var l = [].slice.call(arguments, 1), u = ((this.e || (this.e = {}))[r] || []).slice(), f = 0, C = u.length;
                     for (f; f < C; f++)
-                      d[f].fn.apply(d[f].ctx, l);
+                      u[f].fn.apply(u[f].ctx, l);
                     return this;
                   },
                   off: function(r, l) {
-                    var d = this.e || (this.e = {}), f = d[r], C = [];
+                    var u = this.e || (this.e = {}), f = u[r], C = [];
                     if (f && l)
                       for (var h = 0, N = f.length; h < N; h++)
                         f[h].fn !== l && f[h].fn._ !== l && C.push(f[h]);
-                    return C.length ? d[r] = C : delete d[r], this;
+                    return C.length ? u[r] = C : delete u[r], this;
                   }
                 }, a.exports = i, a.exports.TinyEmitter = i;
               })
@@ -2033,7 +2033,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
   __name: "CopyToClipboard",
   props: { text: String },
   setup(n) {
-    const { toClipboard: e } = rs(), s = $e(n, "text"), o = B(!1), a = async () => {
+    const { toClipboard: e } = rs(), s = $e(n, "text"), o = H(!1), a = async () => {
       try {
         await e(s.value), o.value = !0, setTimeout(() => o.value = !1, 1500), console.log("Copied to clipboard");
       } catch (i) {
@@ -2052,22 +2052,22 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
       ]))
     ]));
   }
-}), us = { class: "code-editor" }, ds = { class: "code-buttons" }, Ca = /* @__PURE__ */ F({
+}), ds = { class: "code-editor" }, us = { class: "code-buttons" }, Ca = /* @__PURE__ */ F({
   __name: "CodeEditor",
-  props: /* @__PURE__ */ He({
+  props: /* @__PURE__ */ Be({
     locked: { type: Boolean },
     extensions: {}
   }, {
     modelValue: { required: !0, type: String },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ He(["update:locked"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Be(["update:locked"], ["update:modelValue"]),
   setup(n, { emit: e }) {
     const t = Nt(n, "modelValue"), s = e, o = (a) => s("update:locked", a);
     return (a, i) => {
       const r = qe("codemirror");
-      return p(), b("div", us, [
-        m("div", ds, [
+      return p(), b("div", ds, [
+        m("div", us, [
           n.locked ? (p(), b("button", {
             key: 0,
             class: "baklava-button",
@@ -2096,15 +2096,11 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
   },
   setup(n) {
     const t = $e(n, "viewModel"), s = (o) => o.events.update.emit(null);
-    return Se(() => {
-      t.value.subscribe && t.value.subscribe(), t.value.engine?.start();
-    }), Je(() => {
-      t.value.unsubscribe && t.value.unsubscribe(), t.value.engine?.stop();
-    }), Qe(t, (o, a) => {
-      a && a.unsubscribe(), o && o.subscribe();
-    }), (o, a) => (p(), H(O(Jt), { viewModel: t.value }, {
+    return Se(t.value.onMounted), Je(t.value.onBeforeUnmount), Qe(t, (o, a) => {
+      a && a.onBeforeUnmount(), o && o.onMounted();
+    }), (o, a) => (p(), B(O(Jt), { "view-model": t.value }, {
       palette: ee(() => [
-        G(O(Hs))
+        G(O(Bs))
       ]),
       node: ee((i) => [
         G(O(ws), Ot(i, {
@@ -2120,7 +2116,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
         }, 16)
       ]),
       _: 3
-    }, 8, ["viewModel"]));
+    }, 8, ["view-model"]));
   }
 }), cs = { class: "code-graph-info" }, ka = /* @__PURE__ */ F({
   __name: "CodeGraphInfo",
@@ -2136,7 +2132,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
       m("div", null, "Engine status: " + P(n.viewModel.engine?.status), 1)
     ]));
   }
-}), ps = ["id", "data-node-type"], hs = {
+}), ps = ["data-node-type", "id"], hs = {
   class: "__title-label",
   style: { "flex-grow": "1" }
 }, fs = { key: 0 }, ms = {
@@ -2151,9 +2147,9 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
   },
   emits: ["select", "start-drag", "update"],
   setup(n, { emit: e }) {
-    const t = Me.ContextMenu, s = Me.NodeInterface, o = n, a = A(() => o.node), i = e, { viewModel: r } = me(), { graph: l, switchGraph: d } = Ge(), f = B(null), C = B(!1), h = B(""), N = B(null), v = B(!1);
-    let w = 0, u = 0;
-    const y = B(!1), $ = A(() => {
+    const t = Me.ContextMenu, s = Me.NodeInterface, o = n, a = A(() => o.node), i = e, { viewModel: r } = me(), { graph: l, switchGraph: u } = Ge(), f = H(null), C = H(!1), h = H(""), N = H(null), v = H(!1);
+    let w = 0, d = 0;
+    const y = H(!1), $ = A(() => {
       const M = [
         { value: "edit", label: "Edit" },
         { value: "rename", label: "Rename" },
@@ -2198,7 +2194,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
           h.value = o.node.title, C.value = !0, await Mt(), N.value?.focus();
           break;
         case "editSubgraph":
-          d(o.node.template);
+          u(o.node.template);
           break;
       }
     }, be = () => {
@@ -2206,12 +2202,12 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
     }, ye = () => {
       f.value && r.value.hooks.renderNode.execute({ node: o.node, el: f.value });
     }, Te = (M) => {
-      v.value = !0, w = o.node.width, u = M.clientX, M.preventDefault();
+      v.value = !0, w = o.node.width, d = M.clientX, M.preventDefault();
     }, se = (M) => {
       a.value.state && (a.value.state.integrated = M, i("update"));
     }, le = (M) => {
       if (!v.value) return;
-      const g = M.clientX - u, c = w + g / l.value.scaling, _ = r.value.settings.nodes.minWidth, x = r.value.settings.nodes.maxWidth;
+      const g = M.clientX - d, c = w + g / l.value.scaling, _ = r.value.settings.nodes.minWidth, x = r.value.settings.nodes.maxWidth;
       a.value.width = Math.max(_, Math.min(x, c));
     }, _e = () => {
       v.value = !1;
@@ -2221,12 +2217,12 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
     }), Ze(ye), Je(() => {
       window.removeEventListener("mousemove", le), window.removeEventListener("mouseup", _e);
     }), (M, g) => (p(), b("div", {
-      id: a.value.id,
-      ref_key: "el",
-      ref: f,
       class: oe([T.value, "baklava-node"]),
       "data-node-type": a.value.type,
+      id: a.value.id,
       style: Ae(Q.value),
+      ref_key: "el",
+      ref: f,
       onPointerdown: X
     }, [
       O(r).settings.nodes.resizable ? (p(), b("div", {
@@ -2236,18 +2232,18 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
       }, null, 32)) : L("", !0),
       m("div", {
         class: "__title",
-        onPointerdown: ue(k, ["self", "stop"]),
-        onContextmenu: ue(j, ["prevent"])
+        onPointerdown: de(k, ["self", "stop"]),
+        onContextmenu: de(j, ["prevent"])
       }, [
-        a.value.inputs._code ? (p(), H(O(Ye), {
+        a.value.inputs._code ? (p(), B(O(Ye), {
           key: 0,
-          node: a.value,
           intf: a.value.inputs._code,
+          node: a.value,
           title: a.value.inputs._code.value,
           class: "--input",
           "data-interface-type": "node",
           style: { "flex-grow": "0" }
-        }, null, 8, ["node", "intf", "title"])) : L("", !0),
+        }, null, 8, ["intf", "node", "title"])) : L("", !0),
         C.value ? ke((p(), b("input", {
           key: 2,
           ref_key: "renameInputEl",
@@ -2268,29 +2264,29 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
           ]),
           m("div", ms, [
             a.value.isCodeNode ? (p(), b(U, { key: 0 }, [
-              a.value.state.lockCode ? (p(), H(O(mt), {
+              a.value.state.lockCode ? (p(), B(O(mt), {
                 key: 0,
                 class: "--clickable mx-1",
                 onClick: g[0] || (g[0] = (c) => a.value.lockCode = !1)
               })) : L("", !0),
-              a.value.state.integrated ? (p(), H(O(Pn), {
+              a.value.state.integrated ? (p(), B(O(Pn), {
                 key: 1,
                 class: "--clickable mx-1",
                 onClick: g[1] || (g[1] = (c) => se(!1))
-              })) : (p(), H(O(jo), {
+              })) : (p(), B(O(jo), {
                 key: 2,
                 class: "--clickable mx-1",
                 onClick: g[2] || (g[2] = (c) => se(!0))
               })),
-              !O(r).displayedGraph.sidebar.visible && O(r).displayedGraph.sidebar.nodeId !== a.value.id ? (p(), H(O(ho), {
+              !O(r).displayedGraph.sidebar.visible && O(r).displayedGraph.sidebar.nodeId !== a.value.id ? (p(), B(O(ho), {
                 key: 3,
                 class: "--clickable mx-1",
                 onClick: ge
-              })) : O(r).displayedGraph.sidebar.visible && O(r).displayedGraph.sidebar.nodeId !== a.value.id ? (p(), H(O(so), {
+              })) : O(r).displayedGraph.sidebar.visible && O(r).displayedGraph.sidebar.nodeId !== a.value.id ? (p(), B(O(so), {
                 key: 4,
                 class: "--clickable mx-1",
                 onClick: he
-              })) : (p(), H(O(lo), {
+              })) : (p(), B(O(lo), {
                 key: 5,
                 class: "--clickable mx-1",
                 onClick: z
@@ -2310,7 +2306,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
             }, null, 8, ["modelValue", "items"])
           ])
         ], 64)),
-        a.value.outputs._code ? (p(), H(O(Ye), {
+        a.value.outputs._code ? (p(), B(O(Ye), {
           key: 3,
           node: a.value,
           intf: a.value.outputs._code,
@@ -2321,9 +2317,9 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
       ], 32),
       m("div", {
         class: oe(["__content", S.value]),
-        onKeydown: g[5] || (g[5] = Oe(ue(() => {
+        onKeydown: g[5] || (g[5] = Oe(de(() => {
         }, ["stop"]), ["delete"])),
-        onContextmenu: g[6] || (g[6] = ue(() => {
+        onContextmenu: g[6] || (g[6] = de(() => {
         }, ["prevent"]))
       }, [
         m("div", vs, [
@@ -2390,11 +2386,11 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
     intf: {}
   },
   setup(n) {
-    const e = n, { viewModel: t } = me(), { hoveredOver: s, temporaryConnection: o } = Qt(), a = B(null), i = A(() => e.intf.connectionCount > 0), r = A(() => ({
+    const e = n, { viewModel: t } = me(), { hoveredOver: s, temporaryConnection: o } = Qt(), a = H(null), i = A(() => e.intf.connectionCount > 0), r = A(() => ({
       "--connected": i.value
     })), l = () => {
       s(e.intf);
-    }, d = () => {
+    }, u = () => {
       s(void 0);
     }, f = () => {
       a.value && t.value.hooks.renderInterface.execute({ intf: e.intf, el: a.value });
@@ -2407,9 +2403,9 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
     }, [
       n.intf.port ? (p(), b("div", {
         key: 0,
-        class: oe(["__port", { "--selected": O(o)?.from === n.intf }]),
+        class: oe([{ "--selected": O(o)?.from === n.intf }, "__port"]),
         onPointerover: l,
-        onPointerout: d
+        onPointerout: u
       }, null, 34)) : L("", !0),
       m("span", xs, [
         q(C.$slots, "default")
@@ -2458,26 +2454,26 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
 }, Gs = { style: { display: "flex" } }, Rs = /* @__PURE__ */ F({
   __name: "CodeGraphSidebar",
   setup(n) {
-    const { viewModel: e } = me(), { graph: t } = Ge(), s = B(null), o = $e(e.value.settings.sidebar, "width"), a = A(() => e.value.settings.sidebar.resizable);
+    const { viewModel: e } = me(), { graph: t } = Ge(), s = H(null), o = $e(e.value.settings.sidebar, "width"), a = A(() => e.value.settings.sidebar.resizable);
     let i = 0, r = 0;
     const l = A(() => {
       const y = t.value.sidebar.nodeId;
       return t.value.nodes.find(($) => $.id === y);
-    }), d = A(() => l.value), f = A(() => ({
+    }), u = A(() => l.value), f = A(() => ({
       width: `${o.value}px`
-    })), C = A(() => d.value ? Object.values(d.value.inputs).filter((y) => y.displayInSidebar && y.component) : []), h = A(() => d.value ? Object.values(d.value.outputs).filter((y) => y.displayInSidebar && y.component) : []), N = () => {
+    })), C = A(() => u.value ? Object.values(u.value.inputs).filter((y) => y.displayInSidebar && y.component) : []), h = A(() => u.value ? Object.values(u.value.outputs).filter((y) => y.displayInSidebar && y.component) : []), N = () => {
       t.value.sidebar.visible = !1;
     }, v = () => {
       l.value?.events.update.emit(null);
     }, w = (y) => {
-      i = o.value, r = y.clientX, window.addEventListener("mousemove", u), window.addEventListener(
+      i = o.value, r = y.clientX, window.addEventListener("mousemove", d), window.addEventListener(
         "mouseup",
         () => {
-          window.removeEventListener("mousemove", u);
+          window.removeEventListener("mousemove", d);
         },
         { once: !0 }
       );
-    }, u = (y) => {
+    }, d = (y) => {
       const $ = s.value?.parentElement?.getBoundingClientRect().width ?? 500, T = y.clientX - r;
       let S = i - T;
       S < 300 ? S = 300 : S > 0.9 * $ && (S = 0.9 * $), o.value = S;
@@ -2521,7 +2517,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
                   inversed: "",
                   style: { "padding-right": "8px" }
                 }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
-                (p(), H(Be(T.component), {
+                (p(), B(He(T.component), {
                   modelValue: T.value,
                   "onUpdate:modelValue": (S) => T.value = S,
                   node: l.value,
@@ -2532,17 +2528,17 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
             ]))), 128))
           ]),
           m("div", Ss, [
-            d.value && d.value.state ? (p(), b("div", As, [
+            u.value && u.value.state ? (p(), b("div", As, [
               $[3] || ($[3] = m("label", null, "Variable name", -1)),
               ke(m("input", {
-                "onUpdate:modelValue": $[1] || ($[1] = (T) => d.value.state.variableName = T),
+                "onUpdate:modelValue": $[1] || ($[1] = (T) => u.value.state.variableName = T),
                 type: "text",
                 class: "baklava-input",
                 title: "Variable name",
                 onBlur: v,
                 onKeydown: Oe(v, ["enter"])
               }, null, 544), [
-                [xe, d.value.state.variableName]
+                [xe, u.value.state.variableName]
               ])
             ])) : L("", !0),
             (p(!0), b(U, null, ae(h.value, (T) => (p(), b("div", {
@@ -2560,7 +2556,7 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
                   inversed: "",
                   style: { "padding-right": "8px" }
                 }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
-                (p(), H(Be(T.component), {
+                (p(), B(He(T.component), {
                   modelValue: T.value,
                   "onUpdate:modelValue": (S) => T.value = S,
                   node: l.value,
@@ -2584,45 +2580,45 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
 }, Ps = ["onClick"], Vs = {
   key: 0,
   style: { margin: "auto 0", "font-size": "12px" }
-}, Hs = /* @__PURE__ */ F({
+}, Bs = /* @__PURE__ */ F({
   __name: "CodeNodePalette",
   setup(n) {
-    const e = Me.PaletteEntry, { viewModel: t } = me(), { x: s, y: o } = hn(), { transform: a } = Zt(), i = en(t), r = $t("editorEl"), l = B(""), d = B(null), f = () => l.value ? i.value.filter(
+    const e = Me.PaletteEntry, { viewModel: t } = me(), { x: s, y: o } = hn(), { transform: a } = Zt(), i = en(t), r = $t("editorEl"), l = H(""), u = H(null), f = () => l.value ? i.value.filter(
       (v) => v.name.toLowerCase().includes(l.value.toLowerCase()) || Object.values(v.nodeTypes).some(
         (w) => w.title.toLowerCase().includes(l.value.toLowerCase())
       )
     ) : i.value, C = (v) => l.value ? Jo(v, (w) => {
-      const u = w[1];
-      return u.category.includes(l.value.toLowerCase()) || u.title?.toLowerCase().includes(l.value.toLowerCase());
+      const d = w[1];
+      return d.category.includes(l.value.toLowerCase()) || d.title?.toLowerCase().includes(l.value.toLowerCase());
     }) : v, h = A(() => {
-      if (!d.value || !r?.value) return {};
+      if (!u.value || !r?.value) return {};
       const { left: v, top: w } = r.value.getBoundingClientRect();
       return {
         top: `${o.value - w}px`,
         left: `${s.value - v}px`
       };
     }), N = (v, w) => {
-      d.value = {
+      u.value = {
         type: v,
         nodeInformation: w
       };
-      const u = () => {
+      const d = () => {
         const y = te(new w.type());
         t.value.displayedGraph.addNode(y);
         const $ = r.value.getBoundingClientRect(), [T, S] = a(s.value - $.left, o.value - $.top);
-        y.position.x = T, y.position.y = S, d.value = null, document.removeEventListener("pointerup", u);
+        y.position.x = T, y.position.y = S, u.value = null, document.removeEventListener("pointerup", d);
       };
-      document.addEventListener("pointerup", u);
+      document.addEventListener("pointerup", d);
     };
     return (v, w) => (p(), b(U, null, [
       m("div", {
         class: oe([{ "--open": O(t).settings.palette.enabled }, "baklava-node-palette"]),
-        onContextmenu: w[1] || (w[1] = ue(() => {
+        onContextmenu: w[1] || (w[1] = de(() => {
         }, ["stop", "prevent"]))
       }, [
         m("div", js, [
           ke(m("input", {
-            "onUpdate:modelValue": w[0] || (w[0] = (u) => l.value = u),
+            "onUpdate:modelValue": w[0] || (w[0] = (d) => l.value = d),
             type: "text",
             class: "baklava-input",
             title: "Filter nodes",
@@ -2631,34 +2627,34 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
             [xe, l.value]
           ])
         ]),
-        (p(!0), b(U, null, ae(f(), (u) => (p(), b("section", {
-          key: u.name
+        (p(!0), b(U, null, ae(f(), (d) => (p(), b("section", {
+          key: d.name
         }, [
-          u.name !== "default" ? (p(), b("h3", Ls, [
+          d.name !== "default" ? (p(), b("h3", Ls, [
             m("div", {
-              onClick: (y) => l.value = u.name,
+              onClick: (y) => l.value = d.name,
               style: { cursor: "pointer" }
-            }, P(u.name), 9, Ps),
-            Object.keys(C(u.nodeTypes)).length < Object.values(u.nodeTypes).length ? (p(), b("div", Vs, " ( " + P(Object.keys(C(u.nodeTypes)).length) + " / " + P(Object.values(u.nodeTypes).length) + " ) ", 1)) : L("", !0)
+            }, P(d.name), 9, Ps),
+            Object.keys(C(d.nodeTypes)).length < Object.values(d.nodeTypes).length ? (p(), b("div", Vs, " ( " + P(Object.keys(C(d.nodeTypes)).length) + " / " + P(Object.values(d.nodeTypes).length) + " ) ", 1)) : L("", !0)
           ])) : L("", !0),
-          (p(!0), b(U, null, ae(C(u.nodeTypes), (y, $) => (p(), H(O(e), {
+          (p(!0), b(U, null, ae(C(d.nodeTypes), (y, $) => (p(), B(O(e), {
             key: $,
-            type: $,
             title: y.title,
+            type: $,
             onPointerdown: (T) => N($, y)
-          }, null, 8, ["type", "title", "onPointerdown"]))), 128))
+          }, null, 8, ["title", "type", "onPointerdown"]))), 128))
         ]))), 128))
       ], 34),
       G(St, { name: "fade" }, {
         default: ee(() => [
-          d.value ? (p(), b("div", {
+          u.value ? (p(), b("div", {
             key: 0,
             class: "baklava-dragged-node",
             style: Ae(h.value)
           }, [
             G(O(e), {
-              type: d.value.type,
-              title: d.value.nodeInformation.title
+              type: u.value.type,
+              title: u.value.nodeInformation.title
             }, null, 8, ["type", "title"])
           ], 4)) : L("", !0)
         ]),
@@ -2666,10 +2662,10 @@ const as = /* @__PURE__ */ ts(ss), rs = (n) => ({
       })
     ], 64));
   }
-}), Bs = {}, zs = { class: "prependIcon" }, Us = { class: "appendIcon" };
+}), Hs = {}, zs = { class: "prependIcon" }, Us = { class: "appendIcon" };
 function Ds(n, e) {
   const t = qe("router-link");
-  return p(), H(t, { class: "navItem" }, {
+  return p(), B(t, { class: "navItem" }, {
     default: ee(() => [
       m("span", zs, [
         q(n.$slots, "prependIcon")
@@ -2682,7 +2678,7 @@ function Ds(n, e) {
     _: 3
   });
 }
-const Ke = /* @__PURE__ */ R(Bs, [["render", Ds]]), Fs = { class: "navbar" }, Ys = ["onClick"], xa = /* @__PURE__ */ F({
+const Ke = /* @__PURE__ */ R(Hs, [["render", Ds]]), Fs = { class: "navbar" }, Ys = ["onClick"], xa = /* @__PURE__ */ F({
   __name: "NavBar",
   props: {
     viewModel: {},
@@ -2696,7 +2692,7 @@ const Ke = /* @__PURE__ */ R(Bs, [["render", Ds]]), Fs = { class: "navbar" }, Ys
     };
     return (o, a) => (p(), b("nav", Fs, [
       q(o.$slots, "prepend"),
-      (p(!0), b(U, null, ae(n.editorStates, (i) => (p(), H(Ke, {
+      (p(!0), b(U, null, ae(n.editorStates, (i) => (p(), B(Ke, {
         key: i.graph.id,
         class: oe({ active: i.graph.id === n.viewModel.displayedGraph.id }),
         to: { name: n.routes?.edit ?? "edit", params: { editorId: i.graph.id } }
@@ -2704,7 +2700,7 @@ const Ke = /* @__PURE__ */ R(Bs, [["render", Ds]]), Fs = { class: "navbar" }, Ys
         appendIcon: ee(() => [
           m("button", {
             class: "remove",
-            onClick: ue((r) => s(i.graph.id), ["prevent"])
+            onClick: de((r) => s(i.graph.id), ["prevent"])
           }, [
             G(O(Do))
           ], 8, Ys)
@@ -2756,30 +2752,30 @@ function Ks(n, e, t) {
   const s = () => n.value.selectedNodes.filter((a) => !Xe.includes(a.type)).length > 0, o = () => {
     const { viewModel: a } = me(), i = n.value, r = n.value.editor;
     if (i.selectedNodes.length === 0) return;
-    const l = i.selectedNodes.filter((k) => !Xe.includes(k.type)), d = l.flatMap((k) => Object.values(k.inputs)), f = l.flatMap((k) => Object.values(k.outputs)), C = i.connections.filter(
-      (k) => !f.includes(k.from) && d.includes(k.to)
+    const l = i.selectedNodes.filter((k) => !Xe.includes(k.type)), u = l.flatMap((k) => Object.values(k.inputs)), f = l.flatMap((k) => Object.values(k.outputs)), C = i.connections.filter(
+      (k) => !f.includes(k.from) && u.includes(k.to)
     ), h = i.connections.filter(
-      (k) => f.includes(k.from) && !d.includes(k.to)
+      (k) => f.includes(k.from) && !u.includes(k.to)
     ), N = i.connections.filter(
-      (k) => f.includes(k.from) && d.includes(k.to)
+      (k) => f.includes(k.from) && u.includes(k.to)
     ), v = l.map((k) => k.save()), w = N.map((k) => ({
       id: k.id,
       from: k.from.id,
       to: k.to.id
-    })), u = /* @__PURE__ */ new Map(), { xLeft: y, xRight: $, yTop: T } = Xs(l);
+    })), d = /* @__PURE__ */ new Map(), { xLeft: y, xRight: $, yTop: T } = Xs(l);
     for (const [k, j] of C.entries()) {
       const z = new xt();
       z.inputs.name.value = j.to.name, v.push({
         ...z.save(),
         position: { x: $ - a.value.settings.nodes.defaultWidth - 100, y: T + k * 200 }
-      }), w.push({ id: re(), from: z.outputs.placeholder.id, to: j.to.id }), u.set(j.to.id, z.graphInterfaceId);
+      }), w.push({ id: re(), from: z.outputs.placeholder.id, to: j.to.id }), d.set(j.to.id, z.graphInterfaceId);
     }
     for (const [k, j] of h.entries()) {
       const z = new It();
       z.inputs.name.value = j.from.name, v.push({
         ...z.save(),
         position: { x: y + 100, y: T + k * 200 }
-      }), w.push({ id: re(), from: j.from.id, to: z.inputs.placeholder.id }), u.set(j.from.id, z.graphInterfaceId);
+      }), w.push({ id: re(), from: j.from.id, to: z.inputs.placeholder.id }), d.set(j.from.id, z.graphInterfaceId);
     }
     const S = te(
       new Ne(
@@ -2805,9 +2801,9 @@ function Ks(n, e, t) {
       l.map((k) => k.position.y).reduce((k, j) => k + j, 0) / l.length
     );
     Z.position.x = pe, Z.position.y = X, C.forEach((k) => {
-      i.removeConnection(k), i.addConnection(k.from, Z.inputs[u.get(k.to.id)]);
+      i.removeConnection(k), i.addConnection(k.from, Z.inputs[d.get(k.to.id)]);
     }), h.forEach((k) => {
-      i.removeConnection(k), i.addConnection(Z.outputs[u.get(k.from.id)], k.to);
+      i.removeConnection(k), i.addConnection(Z.outputs[d.get(k.from.id)], k.to);
     }), l.forEach((k) => i.removeNode(k)), i.activeTransactions--, e.canExecuteCommand(ne.SAVE_SUBGRAPH_COMMAND) && e.executeCommand(ne.SAVE_SUBGRAPH_COMMAND), t(S), n.value.panning = { ...i.panning }, n.value.scaling = i.scaling;
   };
   e.registerCommand(Ws, {
@@ -2828,7 +2824,7 @@ function Xs(n) {
     return i > o ? i : o;
   }, -1 / 0), xRight: e, yTop: t };
 }
-class qs extends Ht {
+class qs extends Bt {
   code;
   graph;
   constructor(e) {
@@ -2881,9 +2877,9 @@ class qs extends Ht {
   }
 }
 function Ia(n) {
-  const e = B(n?.code ?? new Ve()), t = B(n?.existingEditor ?? new qs(e.value)), s = Symbol("ViewModelToken"), o = B(null), a = At(o), { switchGraph: i } = es(t, o), r = A(() => a.value && a.value !== t.value.graph), l = te(tn());
+  const e = H(n?.code ?? new Ve()), t = H(n?.existingEditor ?? new qs(e.value)), s = Symbol("ViewModelToken"), o = H(null), a = At(o), { switchGraph: i } = es(t, o), r = A(() => a.value && a.value !== t.value.graph), l = te(tn());
   l.nodes.defaultWidth = 400;
-  const d = nn(), f = on(a, d), C = sn(a, t, d), h = {
+  const u = nn(), f = on(a, u), C = sn(a, t, u), h = {
     /** Called whenever a node is rendered */
     renderNode: new ze(null),
     /** Called whenever an interface is rendered */
@@ -2891,21 +2887,25 @@ function Ia(n) {
   }, N = te({
     clipboard: C,
     code: e,
-    commandHandler: d,
+    commandHandler: u,
     displayedGraph: a,
     editor: t,
     history: f,
     hooks: h,
     isSubgraph: r,
+    onBeforeUnmount: () => {
+    },
+    onMounted: () => {
+    },
     settings: l,
     switchGraph: i
   });
-  return e.value.registerViewModel(N), Ko(N), an(a, d), Ks(a, d, i), rn(a, d), ln(a, d, i), un(a, d), dn(a, d, l), Fo(a, d, l), Yo(l), Qe(
+  return e.value.registerViewModel(N), Ko(N), an(a, u), Ks(a, u, i), rn(a, u), ln(a, u, i), dn(a, u), un(a, u, l), Fo(a, u, l), Yo(l), Qe(
     t,
     (v, w) => {
-      w && (w.events.registerGraph.unsubscribe(s), w.graphEvents.beforeAddNode.unsubscribe(s), v.nodeHooks.beforeLoad.unsubscribe(s), v.nodeHooks.afterSave.unsubscribe(s), v.graphTemplateHooks.beforeLoad.unsubscribe(s), v.graphTemplateHooks.afterSave.unsubscribe(s), v.graph.hooks.load.unsubscribe(s), v.graph.hooks.save.unsubscribe(s)), v && (v.nodeHooks.beforeLoad.subscribe(s, (u, y) => (y.position = u.position ?? { x: 0, y: 0 }, y.width = u.width ?? l.nodes.defaultWidth, y.twoColumn = u.twoColumn ?? !1, u)), v.nodeHooks.afterSave.subscribe(s, (u, y) => (u.position = y.position, u.width = y.width, u.twoColumn = y.twoColumn, u)), v.graphTemplateHooks.beforeLoad.subscribe(s, (u, y) => (y.panning = u.panning, y.scaling = u.scaling, u)), v.graphTemplateHooks.afterSave.subscribe(s, (u, y) => (u.panning = y.panning, u.scaling = y.scaling, u)), v.graph.hooks.load.subscribe(s, (u, y) => (y.panning = u.panning, y.scaling = u.scaling, u)), v.graph.hooks.save.subscribe(s, (u, y) => (u.panning = y.panning, u.scaling = y.scaling, u)), v.graphEvents.beforeAddNode.subscribe(
+      w && (w.events.registerGraph.unsubscribe(s), w.graphEvents.beforeAddNode.unsubscribe(s), v.nodeHooks.beforeLoad.unsubscribe(s), v.nodeHooks.afterSave.unsubscribe(s), v.graphTemplateHooks.beforeLoad.unsubscribe(s), v.graphTemplateHooks.afterSave.unsubscribe(s), v.graph.hooks.load.unsubscribe(s), v.graph.hooks.save.unsubscribe(s)), v && (v.nodeHooks.beforeLoad.subscribe(s, (d, y) => (y.position = d.position ?? { x: 0, y: 0 }, y.width = d.width ?? l.nodes.defaultWidth, y.twoColumn = d.twoColumn ?? !1, d)), v.nodeHooks.afterSave.subscribe(s, (d, y) => (d.position = y.position, d.width = y.width, d.twoColumn = y.twoColumn, d)), v.graphTemplateHooks.beforeLoad.subscribe(s, (d, y) => (y.panning = d.panning, y.scaling = d.scaling, d)), v.graphTemplateHooks.afterSave.subscribe(s, (d, y) => (d.panning = y.panning, d.scaling = y.scaling, d)), v.graph.hooks.load.subscribe(s, (d, y) => (y.panning = d.panning, y.scaling = d.scaling, d)), v.graph.hooks.save.subscribe(s, (d, y) => (d.panning = y.panning, d.scaling = y.scaling, d)), v.graphEvents.beforeAddNode.subscribe(
         s,
-        (u) => cn(u, { defaultWidth: l.nodes.defaultWidth })
+        (d) => cn(d, { defaultWidth: l.nodes.defaultWidth })
       ), t.value.registerNodeType(xt, { category: "Subgraphs" }), t.value.registerNodeType(It, { category: "Subgraphs" }), i(v.graph));
     },
     { immediate: !0 }
@@ -2934,7 +2934,7 @@ export {
   D as CodeNodeInterface,
   je as CodeNodeInterfaceComponent,
   _n as CodeNodeOutputInterface,
-  Hs as CodeNodePalette,
+  Bs as CodeNodePalette,
   Pn as CodeVariable,
   zn as Copy,
   ls as CopyToClipboard,
@@ -2949,7 +2949,7 @@ export {
   so as LayoutSidebarRight,
   lo as LayoutSidebarRightCollapse,
   ho as LayoutSidebarRightExpand,
-  ua as ListInputInterface,
+  da as ListInputInterface,
   mt as LockCode,
   xa as NavBar,
   Ke as NavItem,
@@ -2962,7 +2962,7 @@ export {
   So as SchemaOff,
   wn as SelectInterface,
   We as SidebarCheckbox,
-  da as SliderInterface,
+  ua as SliderInterface,
   xt as SubgraphInputNode,
   It as SubgraphOutputNode,
   bt as TOGGLE_MINIMAP_COMMAND,
@@ -2971,7 +2971,7 @@ export {
   Tn as TextInputInterfaceComponent,
   ca as TextareaInputInterface,
   jo as TransitionBottom,
-  Ho as TrashOff,
+  Bo as TrashOff,
   pa as TupleInputInterface,
   Do as X,
   la as addDefaultInterfaceTypes,
@@ -2986,10 +2986,10 @@ export {
   _t as getCodeNodes,
   ba as getPositionAtColumn,
   ya as getPositionBeforeNode,
-  ut as listType,
+  dt as listType,
   it as loadNodeState,
   K as nodeType,
-  dt as numberType,
+  ut as numberType,
   Ko as registerCodeEngine,
   Ks as registerCreateSubgraphCommand,
   Fo as registerCustomCommands,