@babsey/code-graph 0.0.17 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/dist/code-graph.css +1 -1
  2. package/dist/code-graph.js +775 -509
  3. package/dist/code-graph.umd.cjs +1 -1
  4. package/dist/code.d.ts +19 -2
  5. package/dist/codeNode/codeNode.d.ts +32 -4
  6. package/dist/codeNode/defineCodeNode.d.ts +4 -2
  7. package/dist/codeNode/dynamicCodeNode.d.ts +3 -1
  8. package/dist/codeNodeInterfaces/checkbox/checkboxInterface.d.ts +0 -2
  9. package/dist/codeNodeInterfaces/codeNode/CodeNodeInterface.vue.d.ts +2 -1
  10. package/dist/codeNodeInterfaces/codeNode/codeNodeInterface.d.ts +4 -1
  11. package/dist/codeNodeInterfaces/codeNodeInput/codeNodeInputInterface.d.ts +1 -0
  12. package/dist/codeNodeInterfaces/number/numberInterface.d.ts +0 -2
  13. package/dist/codeNodeInterfaces/textInput/TextInputInterface.vue.d.ts +26 -0
  14. package/dist/codeNodeInterfaces/textInput/textInputInterface.d.ts +2 -0
  15. package/dist/components/CodeGraphEditor.vue.d.ts +14 -1
  16. package/dist/components/node/CodeGraphNode.vue.d.ts +7 -6
  17. package/dist/components/nodeInterface/CodeGraphNodeInterface.vue.d.ts +3 -2
  18. package/dist/components/nodePalette/CodeNodePalette.vue.d.ts +2 -1
  19. package/dist/components/nodePalette/PaletteEntry.vue.d.ts +2 -1
  20. package/dist/components/sidebar/Checkbox.vue.d.ts +2 -1
  21. package/dist/components/sidebar/CodeGraphSidebar.vue.d.ts +14 -1
  22. package/dist/icons/Check.vue.d.ts +3 -0
  23. package/dist/icons/CodeVariable.vue.d.ts +2 -1
  24. package/dist/icons/Copy.vue.d.ts +3 -0
  25. package/dist/icons/DotsVertical.vue.d.ts +2 -1
  26. package/dist/icons/LayoutSidebarLeftCollapse.vue.d.ts +2 -1
  27. package/dist/icons/LayoutSidebarLeftExpand.vue.d.ts +2 -1
  28. package/dist/icons/LayoutSidebarRight.vue.d.ts +2 -1
  29. package/dist/icons/LayoutSidebarRightCollapse.vue.d.ts +2 -1
  30. package/dist/icons/LayoutSidebarRightExpand.vue.d.ts +2 -1
  31. package/dist/icons/LockCode.vue.d.ts +3 -0
  32. package/dist/icons/Schema.vue.d.ts +2 -1
  33. package/dist/icons/SchemaOff.vue.d.ts +2 -1
  34. package/dist/icons/TransitionBottom.vue.d.ts +2 -1
  35. package/dist/icons/TrashOff.vue.d.ts +2 -1
  36. package/dist/icons/index.d.ts +3 -0
  37. package/dist/index.d.ts +1 -0
  38. package/package.json +7 -7
@@ -1,12 +1,11 @@
1
- import { AbstractNode as Ae, sortTopologically as Ce, NodeInterface as Fe, displayInSidebar as Ie, NodeInterfaceType as G, BaklavaInterfaceTypes as We, CheckboxInterfaceComponent as Xe, setType as E, IntegerInterfaceComponent as Je, TextInputInterfaceComponent as se, NumberInterfaceComponent as Ye, SelectInterfaceComponent as qe, SliderInterfaceComponent as Qe, TextareaInputInterfaceComponent as Ke, allowMultipleConnections as Y, IntegerInterface as Ze, TextInputInterface as et, useViewModel as F, useTemporaryConnection as tt, Components as we, useGraph as ne, GRAPH_NODE_TYPE_PREFIX as K, useTransform as st, useNodeCategories as nt, BaklavaEditor as ot, DEFAULT_TOOLBAR_COMMANDS as at, useBaklava as it, DependencyEngine as rt, applyResult as lt } from "baklavajs";
2
- import { CheckboxInterfaceComponent as In, NumberInterfaceComponent as Nn } from "baklavajs";
3
- import q from "mustache";
4
- import { reactive as R, defineComponent as L, createElementBlock as r, openBlock as i, toDisplayString as B, markRaw as M, ref as T, computed as _, onMounted as oe, onUpdated as Ne, normalizeClass as U, createCommentVNode as I, createElementVNode as l, unref as y, renderSlot as Z, createStaticVNode as Q, onBeforeUnmount as dt, normalizeStyle as ae, withModifiers as P, createBlock as S, withDirectives as ie, Fragment as z, createTextVNode as ut, createVNode as V, withKeys as ee, vModelText as re, renderList as H, nextTick as ct, toRef as Me, resolveDynamicComponent as pt, inject as ht, Transition as vt, withCtx as J, onUnmounted as mt, normalizeProps as ft, guardReactiveProps as gt, mergeProps as bt } from "vue";
5
- import yt from "toposort";
6
- import { v4 as _t } from "uuid";
1
+ import { AbstractNode as We, sortTopologically as Ne, NodeInterface as Xe, displayInSidebar as $e, NodeInterfaceType as R, BaklavaInterfaceTypes as qe, CheckboxInterfaceComponent as Je, setType as z, IntegerInterfaceComponent as Ye, TextInputInterfaceComponent as Me, NumberInterfaceComponent as Qe, SelectInterfaceComponent as Ke, SliderInterfaceComponent as Ze, TextareaInputInterfaceComponent as et, allowMultipleConnections as K, IntegerInterface as tt, TextInputInterface as st, useViewModel as q, useTemporaryConnection as nt, Components as ke, useGraph as ae, GRAPH_NODE_TYPE_PREFIX as se, useTransform as ot, useNodeCategories as at, BaklavaEditor as it, DEFAULT_TOOLBAR_COMMANDS as rt, useBaklava as lt, DependencyEngine as dt, applyResult as ut } from "baklavajs";
2
+ import Z from "mustache";
3
+ import { reactive as H, defineComponent as U, createElementBlock as l, openBlock as i, toDisplayString as j, markRaw as E, computed as b, createElementVNode as r, withDirectives as ee, vModelText as te, ref as V, onMounted as ie, onUpdated as Oe, normalizeClass as G, createCommentVNode as I, unref as _, renderSlot as W, createStaticVNode as J, onBeforeUnmount as ct, normalizeStyle as re, withModifiers as A, createBlock as O, Fragment as T, createTextVNode as pt, createVNode as S, withKeys as ne, renderList as P, nextTick as ht, toRef as Te, resolveDynamicComponent as we, inject as vt, Transition as mt, withCtx as F, onUnmounted as ft, normalizeProps as gt, guardReactiveProps as bt, mergeProps as yt } from "vue";
4
+ import _t from "toposort";
5
+ import { v4 as kt } from "uuid";
7
6
  import { usePointer as wt } from "@vueuse/core";
8
- q.escape = (s) => s;
9
- class kt extends Ae {
7
+ Z.escape = (s) => s;
8
+ class Ct extends We {
10
9
  state;
11
10
  code;
12
11
  isCodeNode = !0;
@@ -15,11 +14,13 @@ class kt extends Ae {
15
14
  inputs = {};
16
15
  outputs = {};
17
16
  constructor() {
18
- super(), this.initializeIo(), this.width = 400, this.twoColumn = !0, this.state = R({
17
+ super(), this.initializeIo(), this.width = 400, this.twoColumn = !0, this.state = H({
19
18
  codeTemplate: "",
20
19
  hidden: !1,
21
20
  integrated: !1,
21
+ lockCode: !1,
22
22
  modules: [],
23
+ props: null,
23
24
  script: "",
24
25
  variableName: ""
25
26
  }), this.codeTemplate = function() {
@@ -27,7 +28,14 @@ class kt extends Ae {
27
28
  };
28
29
  }
29
30
  get codeNodeInputs() {
30
- return Object.fromEntries(Object.entries(this.inputs).filter(([e, t]) => t.type != "node"));
31
+ return Object.fromEntries(
32
+ Object.entries(this.inputs).filter((e) => e[1].type != "node")
33
+ );
34
+ }
35
+ get codeNodeOutputs() {
36
+ return Object.fromEntries(
37
+ Object.entries(this.outputs).filter((e) => e[1].type != "node")
38
+ );
31
39
  }
32
40
  get idx() {
33
41
  return this.code?.codeNodes.filter((e) => !e.state.integrated).indexOf(this) ?? -1;
@@ -35,15 +43,28 @@ class kt extends Ae {
35
43
  get idxByVariableNames() {
36
44
  return this.code?.getNodesBySameVariableNames(this.state.variableName).indexOf(this) ?? -1;
37
45
  }
46
+ get lockCode() {
47
+ return this.state.lockCode;
48
+ }
49
+ set lockCode(e) {
50
+ this.state.lockCode = e, this.events.update.emit(null);
51
+ }
38
52
  get optionalInputs() {
39
- return Object.fromEntries(Object.entries(this.codeNodeInputs).filter(([e, t]) => t.optional));
53
+ return Object.fromEntries(
54
+ Object.entries(this.codeNodeInputs).filter((e) => e[1].optional)
55
+ );
40
56
  }
41
57
  get requiredInputs() {
42
- return Object.fromEntries(Object.entries(this.codeNodeInputs).filter(([e, t]) => !t.optional));
58
+ return Object.fromEntries(
59
+ Object.entries(this.codeNodeInputs).filter((e) => !e[1].optional)
60
+ );
43
61
  }
44
62
  get script() {
45
63
  return this.state.script;
46
64
  }
65
+ set script(e) {
66
+ this.state.script = e, this.events.update.emit(null);
67
+ }
47
68
  get shortId() {
48
69
  return this.id.slice(0, 6);
49
70
  }
@@ -52,6 +73,15 @@ class kt extends Ae {
52
73
  get variableName() {
53
74
  return this.state.variableName ? this.state.variableName + (this.idxByVariableNames + 1) : "";
54
75
  }
76
+ /**
77
+ * Get connected node to the node interface.
78
+ * @param nodeInterface string
79
+ * @returns code node instance or null
80
+ */
81
+ getConnectedNodeByInterface(e, t) {
82
+ const n = this.getConnectedNodesByInterface(e, t);
83
+ return n.length > 0 ? n[0] : null;
84
+ }
55
85
  /**
56
86
  * Get connected nodes to the node.
57
87
  * @param type inputs or outputs
@@ -69,6 +99,31 @@ class kt extends Ae {
69
99
  }
70
100
  return !t || t.length == 0 ? [] : t.map((n) => this.graph?.findNodeById(n));
71
101
  }
102
+ /**
103
+ * Get connected nodes to the node interface.
104
+ * @param nodeInterface string
105
+ * @returns code node instances
106
+ */
107
+ getConnectedNodesByInterface(e, t) {
108
+ let n = [];
109
+ if (t !== "outputs" && this.inputs[e]) {
110
+ const o = this.graph?.connections.filter(
111
+ (a) => a.to.id === this.inputs[e]?.id || a.from.id === this.inputs[e]?.id
112
+ ).map((a) => a.from.nodeId);
113
+ o && (n = n.concat(o));
114
+ }
115
+ if (t !== "inputs" && this.outputs[e]) {
116
+ const o = this.graph?.connections.filter(
117
+ (a) => a.from.id === this.outputs[e]?.id || a.from.id === this.outputs[e]?.id
118
+ ).map((a) => a.to.nodeId);
119
+ o && (n = n.concat(o));
120
+ }
121
+ return !n || n.length == 0 ? [] : n.map((o) => this.graph?.findNodeById(o));
122
+ }
123
+ /**
124
+ * Register code
125
+ * @param code
126
+ */
72
127
  registerCode(e) {
73
128
  this.code = e;
74
129
  }
@@ -76,19 +131,25 @@ class kt extends Ae {
76
131
  * Render code of this node.
77
132
  */
78
133
  renderCode() {
79
- const e = {};
80
- Object.keys(this.inputs).forEach((n) => {
81
- if (n === "_node") return;
82
- const o = this.inputs[n];
83
- o && o.state && (e[n] = o.state.script.length > 0 ? o.state.script : o.getValue());
84
- });
85
- const t = {};
86
- Object.keys(this.outputs).forEach((n) => {
87
- if (n === "_node") return;
88
- const o = this.outputs[n];
89
- o && o.state && (t[n] = o.getValue());
90
- }), this.state.script = q.render(this.state.codeTemplate, { inputs: e, outputs: t }), this.outputs.code && (this.outputs.code.state.script = this.state.script);
134
+ if (!this.lockCode) {
135
+ const e = {};
136
+ Object.keys(this.inputs).forEach((n) => {
137
+ if (n === "_node") return;
138
+ const o = this.inputs[n];
139
+ o && o.state && (e[n] = o.state.script.length > 0 ? o.state.script : o.getValue());
140
+ });
141
+ const t = {};
142
+ Object.keys(this.outputs).forEach((n) => {
143
+ if (n === "_node") return;
144
+ const o = this.outputs[n];
145
+ o && o.state && (t[n] = o.getValue());
146
+ }), this.state.script = Z.render(this.state.codeTemplate, { inputs: e, outputs: t });
147
+ }
148
+ this.outputs.out && (this.outputs.out.state.script = this.script);
91
149
  }
150
+ /**
151
+ * Reset script of input interfaces.
152
+ */
92
153
  resetInputInterfaceScript() {
93
154
  Object.values(this.inputs).forEach((e) => e.state.script = "");
94
155
  }
@@ -97,28 +158,25 @@ class kt extends Ae {
97
158
  }
98
159
  updateConnectedInputInterfaces() {
99
160
  if (!this.graph) return;
100
- const { connectionsFromNode: e } = Ce(this.graph);
161
+ const { connectionsFromNode: e } = Ne(this.graph);
101
162
  if (!e.has(this)) return;
102
163
  const t = e.get(this);
103
164
  t && t.forEach((n) => {
104
165
  if (!n.from.isCodeNode || !n.to.isCodeNode) return;
105
166
  const o = this.graph?.findNodeById(n.from.nodeId);
106
- if (o)
107
- if (o.renderCode(), n.to.allowMultipleConnections)
108
- if (n.to.state.script.startsWith("[") && n.to.state.script.endsWith("]")) {
109
- const a = JSON.parse(n.to.state.script);
110
- n.to.state.script = JSON.stringify([...a, n.from.script]);
111
- } else
112
- n.to.state.script += n.from.script;
113
- else
114
- n.to.state.script = n.from.script;
167
+ o && (o.renderCode(), n.to.script = n.from.script);
168
+ });
169
+ }
170
+ updateOutputNames() {
171
+ Object.values(this.codeNodeOutputs).forEach((e) => {
172
+ e.name = this.state.integrated ? "" : this.variableName + e.value;
115
173
  });
116
174
  }
117
- updateOutputVariableName() {
118
- this.outputs.code && (this.outputs.code.name = this.state.integrated ? "" : this.variableName);
175
+ updateProps(e) {
176
+ this.state.props = e;
119
177
  }
120
178
  }
121
- class $e extends kt {
179
+ class Ee extends Ct {
122
180
  /**
123
181
  * The default implementation does nothing.
124
182
  * Overwrite this method to do calculation.
@@ -128,11 +186,11 @@ class $e extends kt {
128
186
  */
129
187
  calculate;
130
188
  load(e) {
131
- super.load(e), Oe(this.graph, e);
189
+ super.load(e), Be(this.graph, e);
132
190
  }
133
191
  save() {
134
192
  const e = super.save();
135
- return Ct(this.graph, e), e;
193
+ return It(this.graph, e), e;
136
194
  }
137
195
  updateModules(e) {
138
196
  if (e)
@@ -143,14 +201,14 @@ class $e extends kt {
143
201
  }
144
202
  }
145
203
  }
146
- const xt = (s) => {
147
- const e = [], t = Object.keys(s);
148
- return t.forEach((n) => {
149
- if (s[n]?.hidden) return;
150
- const a = e.length < t.indexOf(n) ? `${n}=` : "";
151
- e.push(`${a}{{ inputs.${n} }}`);
152
- }), e;
153
- }, Oe = (s, e) => {
204
+ const xt = (s, e = !0) => {
205
+ const t = [], n = Object.keys(s);
206
+ return n.forEach((o) => {
207
+ if (s[o]?.hidden) return;
208
+ const d = e && t.length < n.indexOf(o) ? `${o}=` : "";
209
+ t.push(`${d}{{ inputs.${o} }}`);
210
+ }), t;
211
+ }, Be = (s, e) => {
154
212
  if (!s) return;
155
213
  const t = s.findNodeById(e.id);
156
214
  if (!t || t.subgraph) return;
@@ -160,7 +218,7 @@ const xt = (s) => {
160
218
  }), Object.entries(e.outputs).forEach(([o, a]) => {
161
219
  o !== "_node" && n.outputs[o] && (n.outputs[o].hidden = a.hidden);
162
220
  });
163
- }, Ct = (s, e) => {
221
+ }, It = (s, e) => {
164
222
  if (!s) return;
165
223
  const t = s.findNodeById(e.id);
166
224
  if (!t || t.subgraph) return;
@@ -170,24 +228,24 @@ const xt = (s) => {
170
228
  }), Object.entries(e.outputs).forEach(([o, a]) => {
171
229
  o !== "_node" && n.outputs[o] && (a.hidden = n.outputs[o].hidden);
172
230
  });
173
- }, It = ["title"], le = /* @__PURE__ */ L({
231
+ }, Nt = ["title"], le = /* @__PURE__ */ U({
174
232
  __name: "CodeNodeInterface",
175
233
  props: {
176
234
  intf: {}
177
235
  },
178
236
  setup(s) {
179
- return (e, t) => (i(), r("div", {
237
+ return (e, t) => (i(), l("div", {
180
238
  title: s.intf.state?.script
181
- }, B(s.intf.name), 9, It));
239
+ }, j(s.intf.name), 9, Nt));
182
240
  }
183
241
  });
184
- class D extends Fe {
242
+ class D extends Xe {
185
243
  isCodeNode = !0;
186
244
  code;
187
245
  state;
188
246
  type = null;
189
247
  constructor(e, t) {
190
- super(e, t), this.setComponent(M(le)), this.state = R({
248
+ super(e, t), this.setComponent(E(le)), this.state = H({
191
249
  optional: !1,
192
250
  script: ""
193
251
  });
@@ -195,17 +253,30 @@ class D extends Fe {
195
253
  get optional() {
196
254
  return this.state.optional;
197
255
  }
256
+ get script() {
257
+ return this.state.script;
258
+ }
259
+ set script(e) {
260
+ this.state.script = e;
261
+ }
198
262
  get shortId() {
199
263
  return this.id.slice(0, 6);
200
264
  }
201
265
  getValue = () => `${this.value ?? "None"}`;
202
266
  }
203
- const on = (s, e) => {
267
+ const In = (s, e) => {
204
268
  s.state.optional = e, s.setHidden(e);
205
269
  };
206
- class W extends D {
270
+ class Y extends D {
207
271
  constructor(e = "", t) {
208
- super(e, t), this.setComponent(M(le)), this.use(Ie, !0);
272
+ super(e, t), this.setComponent(E(le)), this.use($e, !0);
273
+ }
274
+ set script(e) {
275
+ if (this.state.script && this.allowMultipleConnections) {
276
+ const t = this.state.script;
277
+ t.startsWith("[") && t.endsWith("]") ? e = JSON.stringify([e, ...JSON.parse(t)]) : e = [e, t].join(", ");
278
+ }
279
+ this.state.script = e;
209
280
  }
210
281
  get value() {
211
282
  return super.value;
@@ -214,64 +285,64 @@ class W extends D {
214
285
  super.value = e, this.name !== "_node" && this.setHidden(!1);
215
286
  }
216
287
  }
217
- const Te = new G("boolean"), Nt = new G("dict"), Ee = new G("list"), A = new G("node"), de = new G("number"), ue = new G("string"), Se = new G("tuple"), an = (s) => {
218
- new We(s.editor, { viewPlugin: s }).addTypes(Te, Nt, Ee, A, de, ue, Se);
288
+ const Ve = new R("boolean"), $t = new R("dict"), ze = new R("list"), X = new R("node"), de = new R("number"), ue = new R("string"), Se = new R("tuple"), Nn = (s) => {
289
+ new qe(s.editor, { viewPlugin: s }).addTypes(Ve, $t, ze, X, de, ue, Se);
219
290
  };
220
- class rn extends W {
291
+ class $n extends Y {
221
292
  constructor(e, t) {
222
- super(e, t), this.setComponent(M(Xe)), this.use(E, Te);
293
+ super(e, t), this.setComponent(E(Je)), this.use(z, Ve);
223
294
  }
224
295
  getValue = () => this.value ? "True" : "False";
225
296
  }
226
297
  class Mt extends D {
227
298
  isCodeNodeOutput = !0;
228
299
  constructor(e = "", t = "") {
229
- super(e, t), this.setComponent(M(le));
300
+ super(e, t), this.setComponent(E(le));
230
301
  }
231
302
  get script() {
232
- return this.name.length > 0 ? this.name : this.state.script;
303
+ return this.name ? this.name : this.state.script;
233
304
  }
234
305
  }
235
- class ce extends W {
306
+ class ce extends Y {
236
307
  min;
237
308
  max;
238
309
  constructor(e, t, n, o) {
239
- super(e, t), this.min = n, this.max = o, this.use(E, de);
310
+ super(e, t), this.min = n, this.max = o, this.use(z, de);
240
311
  }
241
312
  validate(e) {
242
313
  return (this.min === void 0 || e >= this.min) && (this.max === void 0 || e <= this.max);
243
314
  }
244
315
  }
245
- class ln extends ce {
246
- component = M(Je);
316
+ class Mn extends ce {
317
+ component = E(Ye);
247
318
  validate(e) {
248
319
  return Number.isInteger(e) && super.validate(e);
249
320
  }
250
321
  }
251
- class dn extends W {
322
+ class On extends Y {
252
323
  constructor(e = "", t = "") {
253
- super(e, t), this.setComponent(M(se)), this.use(E, Ee);
324
+ super(e, t), this.setComponent(E(Me)), this.use(z, ze);
254
325
  }
255
326
  getValue = () => `[${this.value}]`;
256
327
  }
257
- class un extends ce {
258
- component = M(Ye);
328
+ class Tn extends ce {
329
+ component = E(Qe);
259
330
  }
260
- class pe extends W {
331
+ class pe extends Y {
261
332
  constructor(e, t) {
262
- super(e, t), this.use(E, ue);
333
+ super(e, t), this.use(z, ue);
263
334
  }
264
- getValue = () => `'${this.value}'`;
335
+ getValue = () => `"${this.value}"`;
265
336
  }
266
- class cn extends pe {
267
- component = M(qe);
337
+ class En extends pe {
338
+ component = E(Ke);
268
339
  items;
269
340
  constructor(e, t, n) {
270
341
  super(e, t), this.items = n;
271
342
  }
272
343
  }
273
- class pn extends ce {
274
- component = M(Qe);
344
+ class Bn extends ce {
345
+ component = E(Ze);
275
346
  min;
276
347
  max;
277
348
  constructor(e, t, n, o) {
@@ -279,30 +350,71 @@ class pn extends ce {
279
350
  }
280
351
  getValue = () => `${Math.round(this.value * 1e3) / 1e3}`;
281
352
  }
282
- class hn extends pe {
283
- component = M(se);
353
+ const Ot = U({
354
+ props: {
355
+ intf: {
356
+ type: Object,
357
+ required: !0
358
+ },
359
+ modelValue: {
360
+ type: String,
361
+ required: !0
362
+ }
363
+ },
364
+ emits: ["update:modelValue"],
365
+ setup(s, { emit: e }) {
366
+ return { v: b({
367
+ get: () => s.modelValue,
368
+ set: (n) => {
369
+ e("update:modelValue", n);
370
+ }
371
+ }) };
372
+ }
373
+ }), N = (s, e) => {
374
+ const t = s.__vccOpts || s;
375
+ for (const [n, o] of e)
376
+ t[n] = o;
377
+ return t;
378
+ }, Tt = { style: { position: "relative" } }, Et = { style: { "font-size": "12px", padding: "0 6px", position: "absolute", top: "-8px", "background-color": "var(--baklava-node-color-background)" } }, Bt = ["placeholder", "title"];
379
+ function Vt(s, e, t, n, o, a) {
380
+ return i(), l("div", Tt, [
381
+ r("label", Et, j(s.intf.name), 1),
382
+ ee(r("input", {
383
+ "onUpdate:modelValue": e[0] || (e[0] = (d) => s.v = d),
384
+ type: "text",
385
+ class: "baklava-input",
386
+ placeholder: s.intf.name,
387
+ title: s.intf.name
388
+ }, null, 8, Bt), [
389
+ [te, s.v]
390
+ ])
391
+ ]);
392
+ }
393
+ const zt = /* @__PURE__ */ N(Ot, [["render", Vt]]);
394
+ class Vn extends pe {
395
+ component = E(zt);
284
396
  }
285
- class vn extends pe {
286
- component = M(Ke);
397
+ class zn extends pe {
398
+ component = E(et);
287
399
  }
288
- class mn extends W {
400
+ class Sn extends Y {
289
401
  constructor(e = "", t = "") {
290
- super(e, t), this.setComponent(M(se)), this.use(E, Se);
402
+ super(e, t), this.setComponent(E(Me)), this.use(z, Se);
291
403
  }
292
404
  getValue = () => `(${this.value})`;
293
405
  }
294
- function fn(s) {
295
- return class extends $e {
406
+ function jn(s) {
407
+ return class extends Ee {
296
408
  type = s.type;
297
409
  inputs = {};
298
410
  outputs = {};
299
411
  constructor() {
300
412
  super(), this._title = s.title ?? s.type, this.name = s.name ?? s.type, this.updateModules(s.modules), s.variableName && (this.state.variableName = s.variableName), s.codeTemplate && (this.codeTemplate = s.codeTemplate), this.addInput(
301
413
  "_node",
302
- new D("", []).use(E, A).use(Y).setHidden(!0)
414
+ new D("", []).use(z, X).use(K).setHidden(!0)
303
415
  ), this.addOutput(
304
416
  "_node",
305
- new D("", []).use(E, A).use(Y).setHidden(!0)
417
+ new D("", []).use(z, X).use(K).setHidden(!0)
306
418
  ), this.executeFactory("input", s.inputs), this.executeFactory("output", s.outputs), s.onCreate?.call(this);
307
419
  }
308
420
  // public calculate = definition.calculate
@@ -314,11 +426,17 @@ function fn(s) {
314
426
  onPlaced() {
315
427
  s.onPlaced?.call(this);
316
428
  }
429
+ onConnected() {
430
+ s.onConnected?.call(this);
431
+ }
317
432
  onDestroy() {
318
433
  s.onDestroy?.call(this);
319
434
  }
320
- onCodeUpdate() {
321
- s.onCodeUpdate?.call(this);
435
+ onUnconnected() {
436
+ s.onUnconnected?.call(this);
437
+ }
438
+ update() {
439
+ s.update?.call(this);
322
440
  }
323
441
  executeFactory(e, t) {
324
442
  Object.keys(t || {}).forEach((n) => {
@@ -328,7 +446,7 @@ function fn(s) {
328
446
  }
329
447
  };
330
448
  }
331
- class $t extends $e {
449
+ class St extends Ee {
332
450
  /**
333
451
  * The default implementation does nothing.
334
452
  * Overwrite this method to do calculation.
@@ -338,8 +456,8 @@ class $t extends $e {
338
456
  */
339
457
  calculate;
340
458
  }
341
- function gn(s) {
342
- return class extends $t {
459
+ function Ln(s) {
460
+ return class extends St {
343
461
  type = s.type;
344
462
  inputs = {};
345
463
  outputs = {};
@@ -350,10 +468,10 @@ function gn(s) {
350
468
  constructor() {
351
469
  super(), this._title = s.title ?? s.type, this.name = s.name ?? s.type, this.updateModules(s.modules), s.codeTemplate && (this.codeTemplate = s.codeTemplate), s.variableName && (this.state.variableName = s.variableName), this.addInput(
352
470
  "_node",
353
- new D("", []).use(E, A).use(Y).setHidden(!0)
471
+ new D("", []).use(z, X).use(K).setHidden(!0)
354
472
  ), this.addOutput(
355
473
  "_node",
356
- new D("", []).use(E, A).use(Y).setHidden(!0)
474
+ new D("", []).use(z, X).use(K).setHidden(!0)
357
475
  ), this.staticInputKeys.push("_node"), this.staticOutputKeys.push("_node"), this.executeFactory("input", s.inputs), this.executeFactory("output", s.outputs), s.onCreate?.call(this);
358
476
  }
359
477
  onPlaced() {
@@ -361,11 +479,17 @@ function gn(s) {
361
479
  e && (e.type === "input" && this.staticInputKeys.includes(e.name) || e.type === "output" && this.staticOutputKeys.includes(e.name)) && this.onUpdate();
362
480
  }), this.onUpdate(), s.onPlaced?.call(this);
363
481
  }
482
+ onConnected() {
483
+ s.onConnected?.call(this);
484
+ }
364
485
  onDestroy() {
365
486
  s.onDestroy?.call(this);
366
487
  }
367
- onCodeUpdate() {
368
- s.onCodeUpdate?.call(this);
488
+ onUnconnected() {
489
+ s.onUnconnected?.call(this);
490
+ }
491
+ update() {
492
+ s.update?.call(this);
369
493
  }
370
494
  load(e) {
371
495
  this.preventUpdate = !0, this.hooks.beforeLoad.execute(e), this.id = e.id, this.title = e.title;
@@ -379,7 +503,7 @@ function gn(s) {
379
503
  if (!this.inputs[t]) {
380
504
  const n = e.inputs[t].value;
381
505
  let o;
382
- typeof n == "number" ? o = new Ze(t, n).use(E, de) : o = new et(t, JSON.stringify(n)).use(E, ue), o.use(Ie, !0), this.addInput(t, o);
506
+ typeof n == "number" ? o = new tt(t, n).use(z, de) : o = new st(t, JSON.stringify(n)).use(z, ue), o.use($e, !0), this.addInput(t, o);
383
507
  }
384
508
  this.inputs[t] && (this.inputs[t].load(e.inputs[t]), this.inputs[t].nodeId = this.id);
385
509
  }
@@ -391,7 +515,7 @@ function gn(s) {
391
515
  }
392
516
  this.outputs[t] && (this.outputs[t].load(e.outputs[t]), this.outputs[t].nodeId = this.id);
393
517
  }
394
- Oe(this.graph, e), this.preventUpdate = !1, this.events.loaded.emit(this);
518
+ Be(this.graph, e), this.preventUpdate = !1, this.events.loaded.emit(this);
395
519
  }
396
520
  onUpdate() {
397
521
  if (this.preventUpdate) return;
@@ -415,6 +539,9 @@ function gn(s) {
415
539
  e === "input" ? this.addInput(d, u) : this.addOutput(d, u);
416
540
  }
417
541
  }
542
+ updateProps(e) {
543
+ this.state.props = e, this.onUpdate();
544
+ }
418
545
  executeFactory(e, t) {
419
546
  Object.keys(t || {}).forEach((n) => {
420
547
  const o = t[n]();
@@ -423,22 +550,23 @@ function gn(s) {
423
550
  }
424
551
  };
425
552
  }
426
- q.escape = (s) => s;
427
- class Ot {
553
+ Z.escape = (s) => s;
554
+ class jt {
428
555
  _id;
429
556
  _viewModel;
430
557
  _state;
431
558
  constructor(e) {
432
- this._id = _t(), this._viewModel = e, this._state = R({
559
+ this._id = kt(), this._viewModel = e, this._state = H({
433
560
  autosort: !1,
561
+ lockCode: !1,
434
562
  modules: {},
435
563
  script: "",
436
- token: null,
437
- template: ""
564
+ template: "",
565
+ token: null
438
566
  });
439
567
  }
440
568
  get codeNodes() {
441
- return te(this.graph);
569
+ return oe(this.graph);
442
570
  }
443
571
  get connections() {
444
572
  return this.graph.connections;
@@ -452,6 +580,12 @@ class Ot {
452
580
  get id() {
453
581
  return this._id;
454
582
  }
583
+ get lockCode() {
584
+ return this.state.lockCode;
585
+ }
586
+ set lockCode(e) {
587
+ this.state.lockCode = e, this.viewModel.engine.runOnce(null);
588
+ }
455
589
  get modules() {
456
590
  let e = [];
457
591
  return this.codeNodes.filter((t) => t.state.modules?.length > 0).forEach((t) => {
@@ -467,8 +601,14 @@ class Ot {
467
601
  set nodes(e) {
468
602
  this.graph._nodes = e;
469
603
  }
604
+ get script() {
605
+ return this.state.script;
606
+ }
607
+ set script(e) {
608
+ this.state.script = e, this.viewModel.engine.runOnce(null);
609
+ }
470
610
  get scriptedCodeNodes() {
471
- return te(this.graph).filter(
611
+ return oe(this.graph).filter(
472
612
  (e) => !e.state?.integrated
473
613
  );
474
614
  }
@@ -547,9 +687,6 @@ class Ot {
547
687
  this._state.template = t.default ?? "";
548
688
  });
549
689
  }
550
- onCodeUpdate() {
551
- this.codeNodes.forEach((e) => e.onCodeUpdate());
552
- }
553
690
  /**
554
691
  * Remove connection from the graph
555
692
  * @param connection connection between code nodes
@@ -568,14 +705,17 @@ class Ot {
568
705
  * Render node codes.
569
706
  */
570
707
  renderNodeCodes() {
571
- this.codeNodes.length !== 0 && this.codeNodes.forEach((e) => e.renderCode());
708
+ this.state.lockCode || this.codeNodes.length !== 0 && this.codeNodes.forEach((e) => e.renderCode());
572
709
  }
573
710
  /**
574
711
  * Render code.
575
712
  */
576
713
  renderCode() {
577
- this.state.script = q.render(this.state.template || "", this);
714
+ this.state.lockCode || (this.state.script = Z.render(this.state.template || "", this));
578
715
  }
716
+ /**
717
+ * Reset scripts of intput interfaces.
718
+ */
579
719
  resetInputInterfaceScript() {
580
720
  this.codeNodes.forEach((e) => e.resetInputInterfaceScript());
581
721
  }
@@ -613,7 +753,7 @@ class Ot {
613
753
  a.from.nodeId
614
754
  ]);
615
755
  let t = [...this.nodeIds];
616
- t.reverse(), t = yt.array(t, e), t.reverse();
756
+ t.reverse(), t = _t.array(t, e), t.reverse();
617
757
  const n = this.graph.nodes.map((a) => a.id).filter((a) => !t.includes(a));
618
758
  t = t.concat(n);
619
759
  const o = t.map((a) => this.findNodeById(a));
@@ -622,26 +762,32 @@ class Ot {
622
762
  console.warn("Failed to sort nodes.");
623
763
  }
624
764
  }
765
+ /**
766
+ * Update code nodes.
767
+ */
768
+ updateCodeNodes() {
769
+ this.codeNodes.forEach((e) => e.update());
770
+ }
771
+ /**
772
+ * Update code templates.
773
+ */
625
774
  updateCodeTemplates() {
626
775
  this.codeNodes.forEach((e) => e.updateCodeTemplate());
627
776
  }
628
- updateOutputVariableNames() {
629
- this.codeNodes.forEach((e) => e.updateOutputVariableName());
630
- }
631
777
  }
632
- const te = (s) => {
778
+ const oe = (s) => {
633
779
  let e = [];
634
780
  return s.nodes.forEach((t) => {
635
- t.subgraph ? e = e.concat(te(t.subgraph)) : t.isCodeNode && e.push(t);
781
+ t.subgraph ? e = e.concat(oe(t.subgraph)) : t.isCodeNode && e.push(t);
636
782
  }), e;
637
- }, bn = (s = 0, e = 100) => ({
783
+ }, Un = (s = 0, e = 100) => ({
638
784
  x: s * 420,
639
785
  y: e
640
- }), yn = (s) => {
786
+ }), Gn = (s) => {
641
787
  const e = { ...s.position };
642
- return e.x -= 400, e.y += 50, e;
643
- }, _n = (s) => {
644
- const { calculationOrder: e, connectionsFromNode: t } = Ce(s);
788
+ return e.x -= 440, e.y += 50, e;
789
+ }, Rn = (s) => {
790
+ const { calculationOrder: e, connectionsFromNode: t } = Ne(s);
645
791
  e.forEach((n) => {
646
792
  if (!n.isCodeNode) return;
647
793
  const o = n;
@@ -649,45 +795,62 @@ const te = (s) => {
649
795
  a.to.state && a.from.script && (a.to.state.script = a.from.script);
650
796
  });
651
797
  });
652
- }, Tt = ["id"], Et = { class: "align-middle" }, ke = /* @__PURE__ */ L({
798
+ }, Lt = ["id"], Ut = { class: "align-middle" }, Ce = /* @__PURE__ */ U({
653
799
  __name: "CodeGraphNodeInterface",
654
800
  props: {
655
801
  node: {},
656
802
  intf: {}
657
803
  },
658
804
  setup(s) {
659
- const e = s, { viewModel: t } = F(), { hoveredOver: n, temporaryConnection: o } = tt(), a = T(null), d = _(() => e.intf.connectionCount > 0), u = _(() => ({
805
+ const e = s, { viewModel: t } = q(), { hoveredOver: n, temporaryConnection: o } = nt(), a = V(null), d = b(() => e.intf.connectionCount > 0), u = b(() => ({
660
806
  "--connected": d.value
661
- })), m = () => {
807
+ })), v = () => {
662
808
  n(e.intf);
663
- }, w = () => {
664
- n(void 0);
665
809
  }, k = () => {
810
+ n(void 0);
811
+ }, C = () => {
666
812
  a.value && t.value.hooks.renderInterface.execute({ intf: e.intf, el: a.value });
667
813
  };
668
- return oe(k), Ne(k), (O, j) => (i(), r("div", {
814
+ return ie(C), Oe(C), (B, L) => (i(), l("div", {
669
815
  id: s.intf.id,
670
816
  ref_key: "el",
671
817
  ref: a,
672
- class: U(["baklava-node-interface", u.value])
818
+ class: G(["baklava-node-interface", u.value])
673
819
  }, [
674
- s.intf.port ? (i(), r("div", {
820
+ s.intf.port ? (i(), l("div", {
675
821
  key: 0,
676
- class: U(["__port", { "--selected": y(o)?.from === s.intf }]),
677
- onPointerover: m,
678
- onPointerout: w
822
+ class: G(["__port", { "--selected": _(o)?.from === s.intf }]),
823
+ onPointerover: v,
824
+ onPointerout: k
679
825
  }, null, 34)) : I("", !0),
680
- l("span", Et, [
681
- Z(O.$slots, "default")
826
+ r("span", Ut, [
827
+ W(B.$slots, "default")
682
828
  ])
683
- ], 10, Tt));
829
+ ], 10, Lt));
684
830
  }
685
- }), $ = (s, e) => {
686
- const t = s.__vccOpts || s;
687
- for (const [n, o] of e)
688
- t[n] = o;
689
- return t;
690
- }, St = {}, zt = {
831
+ }), Gt = {}, Rt = {
832
+ xmlns: "http://www.w3.org/2000/svg",
833
+ width: "24",
834
+ height: "24",
835
+ viewBox: "0 0 24 24",
836
+ fill: "none",
837
+ stroke: "currentColor",
838
+ "stroke-width": "2",
839
+ "stroke-linecap": "round",
840
+ "stroke-linejoin": "round",
841
+ class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-check"
842
+ };
843
+ function Ht(s, e) {
844
+ return i(), l("svg", Rt, [...e[0] || (e[0] = [
845
+ r("path", {
846
+ stroke: "none",
847
+ d: "M0 0h24v24H0z",
848
+ fill: "none"
849
+ }, null, -1),
850
+ r("path", { d: "M5 12l5 5l10 -10" }, null, -1)
851
+ ])]);
852
+ }
853
+ const Hn = /* @__PURE__ */ N(Gt, [["render", Ht]]), Pt = {}, Dt = {
691
854
  xmlns: "http://www.w3.org/2000/svg",
692
855
  width: "24",
693
856
  height: "24",
@@ -699,17 +862,40 @@ const te = (s) => {
699
862
  "stroke-linejoin": "round",
700
863
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-code-variable"
701
864
  };
702
- function Vt(s, e) {
703
- return i(), r("svg", zt, [...e[0] || (e[0] = [
704
- l("path", {
865
+ function At(s, e) {
866
+ return i(), l("svg", Dt, [...e[0] || (e[0] = [
867
+ r("path", {
868
+ stroke: "none",
869
+ d: "M0 0h24v24H0z",
870
+ fill: "none"
871
+ }, null, -1),
872
+ r("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)
873
+ ])]);
874
+ }
875
+ const Ft = /* @__PURE__ */ N(Pt, [["render", At]]), Wt = {}, Xt = {
876
+ xmlns: "http://www.w3.org/2000/svg",
877
+ width: "24",
878
+ height: "24",
879
+ viewBox: "0 0 24 24",
880
+ fill: "none",
881
+ stroke: "currentColor",
882
+ "stroke-width": "2",
883
+ "stroke-linecap": "round",
884
+ "stroke-linejoin": "round",
885
+ class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-copy"
886
+ };
887
+ function qt(s, e) {
888
+ return i(), l("svg", Xt, [...e[0] || (e[0] = [
889
+ r("path", {
705
890
  stroke: "none",
706
891
  d: "M0 0h24v24H0z",
707
892
  fill: "none"
708
893
  }, null, -1),
709
- l("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)
894
+ r("path", { d: "M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" }, null, -1),
895
+ r("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)
710
896
  ])]);
711
897
  }
712
- const Bt = /* @__PURE__ */ $(St, [["render", Vt]]), jt = {}, Lt = {
898
+ const Pn = /* @__PURE__ */ N(Wt, [["render", qt]]), Jt = {}, Yt = {
713
899
  xmlns: "http://www.w3.org/2000/svg",
714
900
  width: "24",
715
901
  height: "24",
@@ -721,19 +907,19 @@ const Bt = /* @__PURE__ */ $(St, [["render", Vt]]), jt = {}, Lt = {
721
907
  "stroke-linejoin": "round",
722
908
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-dots-vertical"
723
909
  };
724
- function Ut(s, e) {
725
- return i(), r("svg", Lt, [...e[0] || (e[0] = [
726
- l("path", {
910
+ function Qt(s, e) {
911
+ return i(), l("svg", Yt, [...e[0] || (e[0] = [
912
+ r("path", {
727
913
  stroke: "none",
728
914
  d: "M0 0h24v24H0z",
729
915
  fill: "none"
730
916
  }, null, -1),
731
- l("path", { d: "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
732
- l("path", { d: "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
733
- l("path", { d: "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1)
917
+ r("path", { d: "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
918
+ r("path", { d: "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
919
+ r("path", { d: "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1)
734
920
  ])]);
735
921
  }
736
- const Gt = /* @__PURE__ */ $(jt, [["render", Ut]]), Rt = {}, Dt = {
922
+ const Kt = /* @__PURE__ */ N(Jt, [["render", Qt]]), Zt = {}, es = {
737
923
  xmlns: "http://www.w3.org/2000/svg",
738
924
  width: "24",
739
925
  height: "24",
@@ -741,17 +927,17 @@ const Gt = /* @__PURE__ */ $(jt, [["render", Ut]]), Rt = {}, Dt = {
741
927
  fill: "currentColor",
742
928
  class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-collapse"
743
929
  };
744
- function Pt(s, e) {
745
- return i(), r("svg", Dt, [...e[0] || (e[0] = [
746
- l("path", {
930
+ function ts(s, e) {
931
+ return i(), l("svg", es, [...e[0] || (e[0] = [
932
+ r("path", {
747
933
  stroke: "none",
748
934
  d: "M0 0h24v24H0z",
749
935
  fill: "none"
750
936
  }, null, -1),
751
- l("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)
937
+ r("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)
752
938
  ])]);
753
939
  }
754
- const Ht = /* @__PURE__ */ $(Rt, [["render", Pt]]), At = {}, Ft = {
940
+ const ss = /* @__PURE__ */ N(Zt, [["render", ts]]), ns = {}, os = {
755
941
  xmlns: "http://www.w3.org/2000/svg",
756
942
  width: "24",
757
943
  height: "24",
@@ -759,35 +945,35 @@ const Ht = /* @__PURE__ */ $(Rt, [["render", Pt]]), At = {}, Ft = {
759
945
  fill: "currentColor",
760
946
  class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-left-expand"
761
947
  };
762
- function Wt(s, e) {
763
- return i(), r("svg", Ft, [...e[0] || (e[0] = [
764
- l("path", {
948
+ function as(s, e) {
949
+ return i(), l("svg", os, [...e[0] || (e[0] = [
950
+ r("path", {
765
951
  stroke: "none",
766
952
  d: "M0 0h24v24H0z",
767
953
  fill: "none"
768
954
  }, null, -1),
769
- l("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)
955
+ r("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)
770
956
  ])]);
771
957
  }
772
- const Xt = /* @__PURE__ */ $(At, [["render", Wt]]), Jt = {}, Yt = {
958
+ const is = /* @__PURE__ */ N(ns, [["render", as]]), rs = {}, ls = {
773
959
  xmlns: "http://www.w3.org/2000/svg",
774
960
  width: "24",
775
961
  height: "24",
776
962
  viewBox: "0 0 24 24",
777
963
  fill: "currentColor",
778
- class: "balkava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right"
964
+ class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right"
779
965
  };
780
- function qt(s, e) {
781
- return i(), r("svg", Yt, [...e[0] || (e[0] = [
782
- l("path", {
966
+ function ds(s, e) {
967
+ return i(), l("svg", ls, [...e[0] || (e[0] = [
968
+ r("path", {
783
969
  stroke: "none",
784
970
  d: "M0 0h24v24H0z",
785
971
  fill: "none"
786
972
  }, null, -1),
787
- l("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)
973
+ r("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)
788
974
  ])]);
789
975
  }
790
- const Qt = /* @__PURE__ */ $(Jt, [["render", qt]]), Kt = {}, Zt = {
976
+ const us = /* @__PURE__ */ N(rs, [["render", ds]]), cs = {}, ps = {
791
977
  xmlns: "http://www.w3.org/2000/svg",
792
978
  width: "24",
793
979
  height: "24",
@@ -795,17 +981,17 @@ const Qt = /* @__PURE__ */ $(Jt, [["render", qt]]), Kt = {}, Zt = {
795
981
  fill: "currentColor",
796
982
  class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-collapse"
797
983
  };
798
- function es(s, e) {
799
- return i(), r("svg", Zt, [...e[0] || (e[0] = [
800
- l("path", {
984
+ function hs(s, e) {
985
+ return i(), l("svg", ps, [...e[0] || (e[0] = [
986
+ r("path", {
801
987
  stroke: "none",
802
988
  d: "M0 0h24v24H0z",
803
989
  fill: "none"
804
990
  }, null, -1),
805
- l("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)
991
+ r("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)
806
992
  ])]);
807
993
  }
808
- const ts = /* @__PURE__ */ $(Kt, [["render", es]]), ss = {}, ns = {
994
+ const vs = /* @__PURE__ */ N(cs, [["render", hs]]), ms = {}, fs = {
809
995
  xmlns: "http://www.w3.org/2000/svg",
810
996
  width: "24",
811
997
  height: "24",
@@ -813,17 +999,34 @@ const ts = /* @__PURE__ */ $(Kt, [["render", es]]), ss = {}, ns = {
813
999
  fill: "currentColor",
814
1000
  class: "baklava-icon icon icon-tabler icons-tabler-filled icon-tabler-layout-sidebar-right-expand"
815
1001
  };
816
- function os(s, e) {
817
- return i(), r("svg", ns, [...e[0] || (e[0] = [
818
- l("path", {
1002
+ function gs(s, e) {
1003
+ return i(), l("svg", fs, [...e[0] || (e[0] = [
1004
+ r("path", {
819
1005
  stroke: "none",
820
1006
  d: "M0 0h24v24H0z",
821
1007
  fill: "none"
822
1008
  }, null, -1),
823
- l("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)
1009
+ r("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)
1010
+ ])]);
1011
+ }
1012
+ const bs = /* @__PURE__ */ N(ms, [["render", gs]]), ys = {}, _s = {
1013
+ xmlns: "http://www.w3.org/2000/svg",
1014
+ width: "24",
1015
+ height: "24",
1016
+ viewBox: "0 0 24 24",
1017
+ fill: "none",
1018
+ stroke: "currentColor",
1019
+ "stroke-width": "2",
1020
+ "stroke-linecap": "round",
1021
+ "stroke-linejoin": "round",
1022
+ class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-lock-code"
1023
+ };
1024
+ function ks(s, e) {
1025
+ return i(), l("svg", _s, [...e[0] || (e[0] = [
1026
+ J('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-6a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2"></path><path d="M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0"></path><path d="M8 11v-4a4 4 0 1 1 8 0v4"></path><path d="M20 21l2 -2l-2 -2"></path><path d="M17 17l-2 2l2 2"></path>', 6)
824
1027
  ])]);
825
1028
  }
826
- const as = /* @__PURE__ */ $(ss, [["render", os]]), is = {}, rs = {
1029
+ const ws = /* @__PURE__ */ N(ys, [["render", ks]]), Cs = {}, xs = {
827
1030
  xmlns: "http://www.w3.org/2000/svg",
828
1031
  width: "24",
829
1032
  height: "24",
@@ -835,12 +1038,12 @@ const as = /* @__PURE__ */ $(ss, [["render", os]]), is = {}, rs = {
835
1038
  "stroke-linejoin": "round",
836
1039
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-schema"
837
1040
  };
838
- function ls(s, e) {
839
- return i(), r("svg", rs, [...e[0] || (e[0] = [
840
- Q('<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)
1041
+ function Is(s, e) {
1042
+ return i(), l("svg", xs, [...e[0] || (e[0] = [
1043
+ J('<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)
841
1044
  ])]);
842
1045
  }
843
- const ds = /* @__PURE__ */ $(is, [["render", ls]]), us = {}, cs = {
1046
+ const Ns = /* @__PURE__ */ N(Cs, [["render", Is]]), $s = {}, Ms = {
844
1047
  xmlns: "http://www.w3.org/2000/svg",
845
1048
  width: "24",
846
1049
  height: "24",
@@ -852,12 +1055,12 @@ const ds = /* @__PURE__ */ $(is, [["render", ls]]), us = {}, cs = {
852
1055
  "stroke-linejoin": "round",
853
1056
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-schema-off"
854
1057
  };
855
- function ps(s, e) {
856
- return i(), r("svg", cs, [...e[0] || (e[0] = [
857
- Q('<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)
1058
+ function Os(s, e) {
1059
+ return i(), l("svg", Ms, [...e[0] || (e[0] = [
1060
+ J('<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)
858
1061
  ])]);
859
1062
  }
860
- const hs = /* @__PURE__ */ $(us, [["render", ps]]), vs = {}, ms = {
1063
+ const Ts = /* @__PURE__ */ N($s, [["render", Os]]), Es = {}, Bs = {
861
1064
  xmlns: "http://www.w3.org/2000/svg",
862
1065
  width: "24",
863
1066
  height: "24",
@@ -869,12 +1072,12 @@ const hs = /* @__PURE__ */ $(us, [["render", ps]]), vs = {}, ms = {
869
1072
  "stroke-linejoin": "round",
870
1073
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-transition-bottom"
871
1074
  };
872
- function fs(s, e) {
873
- return i(), r("svg", ms, [...e[0] || (e[0] = [
874
- Q('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M21 18a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3"></path><path d="M3 3m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v0a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z"></path><path d="M12 9v8"></path><path d="M9 14l3 3l3 -3"></path>', 5)
1075
+ function Vs(s, e) {
1076
+ return i(), l("svg", Bs, [...e[0] || (e[0] = [
1077
+ J('<path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M21 18a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3"></path><path d="M3 3m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v0a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z"></path><path d="M12 9v8"></path><path d="M9 14l3 3l3 -3"></path>', 5)
875
1078
  ])]);
876
1079
  }
877
- const gs = /* @__PURE__ */ $(vs, [["render", fs]]), bs = {}, ys = {
1080
+ const zs = /* @__PURE__ */ N(Es, [["render", Vs]]), Ss = {}, js = {
878
1081
  xmlns: "http://www.w3.org/2000/svg",
879
1082
  width: "24",
880
1083
  height: "24",
@@ -886,18 +1089,18 @@ const gs = /* @__PURE__ */ $(vs, [["render", fs]]), bs = {}, ys = {
886
1089
  "stroke-linejoin": "round",
887
1090
  class: "baklava-icon icon icon-tabler icons-tabler-outline icon-tabler-trash-off"
888
1091
  };
889
- function _s(s, e) {
890
- return i(), r("svg", ys, [...e[0] || (e[0] = [
891
- Q('<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)
1092
+ function Ls(s, e) {
1093
+ return i(), l("svg", js, [...e[0] || (e[0] = [
1094
+ J('<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)
892
1095
  ])]);
893
1096
  }
894
- const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"], xs = {
1097
+ const Us = /* @__PURE__ */ N(Ss, [["render", Ls]]), Gs = ["id", "data-node-type"], Rs = {
895
1098
  class: "__title-label",
896
1099
  style: { "flex-grow": "1" }
897
- }, Cs = { key: 0 }, Is = {
1100
+ }, Hs = { key: 0 }, Ps = {
898
1101
  class: "__menu",
899
1102
  style: { display: "flex" }
900
- }, Ns = { class: "__outputs" }, Ms = { key: 0 }, $s = ["id", "title"], Os = { class: "__inputs" }, Ts = { key: 0 }, Es = ["id", "title"], Ss = /* @__PURE__ */ L({
1103
+ }, Ds = { class: "__outputs" }, As = { key: 0 }, Fs = ["id", "title"], Ws = { class: "__inputs" }, Xs = { key: 0 }, qs = ["id", "title"], Js = /* @__PURE__ */ U({
901
1104
  __name: "CodeGraphNode",
902
1105
  props: {
903
1106
  node: {},
@@ -906,95 +1109,95 @@ const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"
906
1109
  },
907
1110
  emits: ["select", "start-drag", "update"],
908
1111
  setup(s, { emit: e }) {
909
- const t = we.ContextMenu, n = we.NodeInterface, o = s, a = _(() => o.node), d = e, { viewModel: u } = F(), { graph: m, switchGraph: w } = ne(), k = T(null), O = T(!1), j = T(""), x = T(null), f = T(!1);
910
- let g = 0, v = 0;
911
- const h = T(!1), C = _(() => {
1112
+ const t = ke.ContextMenu, n = ke.NodeInterface, o = s, a = b(() => o.node), d = e, { viewModel: u } = q(), { graph: v, switchGraph: k } = ae(), C = V(null), B = V(!1), L = V(""), $ = V(null), m = V(!1);
1113
+ let y = 0, x = 0;
1114
+ const f = V(!1), w = b(() => {
912
1115
  const c = [
913
1116
  { value: "edit", label: "Edit" },
914
1117
  { value: "rename", label: "Rename" },
915
1118
  { value: "delete", label: "Delete" }
916
1119
  ];
917
- return o.node.type.startsWith(K) && c.push({ value: "editSubgraph", label: "Edit Subgraph" }), c;
918
- }), N = _(() => ({
1120
+ return o.node.type.startsWith(se) && c.push({ value: "editSubgraph", label: "Edit Subgraph" }), c;
1121
+ }), p = b(() => ({
919
1122
  "--selected": o.selected,
920
1123
  "--dragging": o.dragging,
921
1124
  "--two-column": !!o.node.twoColumn,
922
1125
  "--hidden": a.value.state?.hidden
923
- })), ze = _(() => ({
1126
+ })), M = b(() => ({
924
1127
  "--reverse-y": o.node.reverseY ?? u.value.settings.nodes.reverseY
925
- })), Ve = _(() => ({
1128
+ })), je = b(() => ({
926
1129
  top: `${o.node.position?.y ?? 0}px`,
927
1130
  left: `${o.node.position?.x ?? 0}px`,
928
1131
  "--width": `${o.node.width ?? u.value.settings.nodes.defaultWidth}px`
929
- })), Be = _(() => Object.values(o.node.inputs).filter((c) => !c.hidden)), je = _(() => Object.values(o.node.outputs).filter((c) => !c.hidden)), he = () => {
1132
+ })), Le = b(() => Object.values(o.node.inputs).filter((c) => !c.hidden)), Ue = b(() => Object.values(o.node.outputs).filter((c) => !c.hidden)), he = () => {
930
1133
  d("select");
931
- }, Le = (c) => {
1134
+ }, Ge = (c) => {
932
1135
  o.selected || he(), d("start-drag", c);
933
1136
  }, ve = () => {
934
- h.value = !0;
935
- }, Ue = () => {
1137
+ f.value = !0;
1138
+ }, Re = () => {
936
1139
  const c = u.value.displayedGraph.sidebar;
937
1140
  c.nodeId = "", c.visible = !1;
938
1141
  }, me = () => {
939
1142
  const c = u.value.displayedGraph.sidebar;
940
1143
  c.nodeId = o.node.id, c.visible = !0;
941
- }, Ge = () => {
1144
+ }, He = () => {
942
1145
  const c = u.value.displayedGraph.sidebar;
943
1146
  c.nodeId = o.node.id;
944
- }, Re = async (c) => {
1147
+ }, Pe = async (c) => {
945
1148
  switch (c) {
946
1149
  case "edit":
947
1150
  me();
948
1151
  break;
949
1152
  case "delete":
950
- m.value.removeNode(o.node);
1153
+ v.value.removeNode(o.node);
951
1154
  break;
952
1155
  case "rename":
953
- j.value = o.node.title, O.value = !0, await ct(), x.value?.focus();
1156
+ L.value = o.node.title, B.value = !0, await ht(), $.value?.focus();
954
1157
  break;
955
1158
  case "editSubgraph":
956
- w(o.node.template);
1159
+ k(o.node.template);
957
1160
  break;
958
1161
  }
959
1162
  }, fe = () => {
960
- o.node.title = j.value, O.value = !1;
1163
+ a.value.title = L.value, B.value = !1;
961
1164
  }, ge = () => {
962
- k.value && u.value.hooks.renderNode.execute({ node: o.node, el: k.value });
1165
+ C.value && u.value.hooks.renderNode.execute({ node: o.node, el: C.value });
963
1166
  }, De = (c) => {
964
- f.value = !0, g = o.node.width, v = c.clientX, c.preventDefault();
1167
+ m.value = !0, y = o.node.width, x = c.clientX, c.preventDefault();
965
1168
  }, be = (c) => {
966
1169
  a.value.state && (a.value.state.integrated = c, d("update"));
967
1170
  }, ye = (c) => {
968
- if (!f.value) return;
969
- const b = c.clientX - v, p = g + b / m.value.scaling, Pe = u.value.settings.nodes.minWidth, He = u.value.settings.nodes.maxWidth;
970
- o.node.width = Math.max(Pe, Math.min(He, p));
1171
+ if (!m.value) return;
1172
+ const g = c.clientX - x, h = y + g / v.value.scaling, Ae = u.value.settings.nodes.minWidth, Fe = u.value.settings.nodes.maxWidth;
1173
+ a.value.width = Math.max(Ae, Math.min(Fe, h));
971
1174
  }, _e = () => {
972
- f.value = !1;
1175
+ m.value = !1;
973
1176
  };
974
- return oe(() => {
1177
+ return ie(() => {
975
1178
  ge(), window.addEventListener("mousemove", ye), window.addEventListener("mouseup", _e);
976
- }), Ne(ge), dt(() => {
1179
+ }), Oe(ge), ct(() => {
977
1180
  window.removeEventListener("mousemove", ye), window.removeEventListener("mouseup", _e);
978
- }), (c, b) => (i(), r("div", {
1181
+ }), (c, g) => (i(), l("div", {
979
1182
  id: a.value.id,
980
1183
  ref_key: "el",
981
- ref: k,
982
- class: U([N.value, "baklava-node"]),
1184
+ ref: C,
1185
+ class: G([p.value, "baklava-node"]),
983
1186
  "data-node-type": a.value.type,
984
- style: ae(Ve.value),
1187
+ style: re(je.value),
985
1188
  onPointerdown: he
986
1189
  }, [
987
- y(u).settings.nodes.resizable ? (i(), r("div", {
1190
+ _(u).settings.nodes.resizable ? (i(), l("div", {
988
1191
  key: 0,
989
1192
  class: "__resize-handle",
990
1193
  onMousedown: De
991
1194
  }, null, 32)) : I("", !0),
992
- l("div", {
1195
+ r("div", {
993
1196
  class: "__title",
994
- onPointerdown: P(Le, ["self", "stop"]),
995
- onContextmenu: P(ve, ["prevent"])
1197
+ onPointerdown: A(Ge, ["self", "stop"]),
1198
+ onContextmenu: A(ve, ["prevent"])
996
1199
  }, [
997
- a.value.inputs._node ? (i(), S(ke, {
1200
+ a.value.inputs._node ? (i(), O(Ce, {
998
1201
  key: 0,
999
1202
  node: a.value,
1000
1203
  intf: a.value.inputs._node,
@@ -1002,64 +1205,69 @@ const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"
1002
1205
  "data-interface-type": "node",
1003
1206
  style: { "flex-grow": "0" }
1004
1207
  }, null, 8, ["node", "intf"])) : I("", !0),
1005
- O.value ? ie((i(), r("input", {
1208
+ B.value ? ee((i(), l("input", {
1006
1209
  key: 2,
1007
1210
  ref_key: "renameInputEl",
1008
- ref: x,
1009
- "onUpdate:modelValue": b[3] || (b[3] = (p) => j.value = p),
1211
+ ref: $,
1212
+ "onUpdate:modelValue": g[4] || (g[4] = (h) => L.value = h),
1010
1213
  class: "baklava-input",
1011
1214
  placeholder: "Node Name",
1012
1215
  style: { "flex-grow": "1" },
1013
1216
  type: "text",
1014
1217
  onBlur: fe,
1015
- onKeydown: ee(fe, ["enter"])
1218
+ onKeydown: ne(fe, ["enter"])
1016
1219
  }, null, 544)), [
1017
- [re, j.value]
1018
- ]) : (i(), r(z, { key: 1 }, [
1019
- l("div", xs, [
1020
- a.value.idx > -1 ? (i(), r("span", Cs, B(a.value.idx + 1) + " - ", 1)) : I("", !0),
1021
- ut(B(a.value.title) + " (" + B(a.value.shortId) + ") ", 1)
1220
+ [te, L.value]
1221
+ ]) : (i(), l(T, { key: 1 }, [
1222
+ r("div", Rs, [
1223
+ a.value.idx > -1 ? (i(), l("span", Hs, j(a.value.idx + 1) + " - ", 1)) : I("", !0),
1224
+ pt(j(a.value.title), 1)
1022
1225
  ]),
1023
- l("div", Is, [
1024
- a.value.subgraph ? I("", !0) : (i(), r(z, { key: 0 }, [
1025
- a.value.state.integrated ? (i(), S(y(Bt), {
1226
+ r("div", Ps, [
1227
+ a.value.subgraph ? I("", !0) : (i(), l(T, { key: 0 }, [
1228
+ a.value.state.lockCode ? (i(), O(_(ws), {
1026
1229
  key: 0,
1027
1230
  class: "--clickable mx-1",
1028
- onClick: b[0] || (b[0] = (p) => be(!1))
1029
- })) : (i(), S(y(gs), {
1231
+ onClick: g[0] || (g[0] = (h) => a.value.lockCode = !1)
1232
+ })) : I("", !0),
1233
+ a.value.state.integrated ? (i(), O(_(Ft), {
1030
1234
  key: 1,
1031
1235
  class: "--clickable mx-1",
1032
- onClick: b[1] || (b[1] = (p) => be(!0))
1033
- })),
1034
- !y(u).displayedGraph.sidebar.visible && y(u).displayedGraph.sidebar.nodeId !== a.value.id ? (i(), S(y(as), {
1236
+ onClick: g[1] || (g[1] = (h) => be(!1))
1237
+ })) : (i(), O(_(zs), {
1035
1238
  key: 2,
1036
1239
  class: "--clickable mx-1",
1037
- onClick: me
1038
- })) : y(u).displayedGraph.sidebar.visible && y(u).displayedGraph.sidebar.nodeId !== a.value.id ? (i(), S(y(Qt), {
1240
+ onClick: g[2] || (g[2] = (h) => be(!0))
1241
+ })),
1242
+ !_(u).displayedGraph.sidebar.visible && _(u).displayedGraph.sidebar.nodeId !== a.value.id ? (i(), O(_(bs), {
1039
1243
  key: 3,
1040
1244
  class: "--clickable mx-1",
1041
- onClick: Ge
1042
- })) : (i(), S(y(ts), {
1245
+ onClick: me
1246
+ })) : _(u).displayedGraph.sidebar.visible && _(u).displayedGraph.sidebar.nodeId !== a.value.id ? (i(), O(_(us), {
1043
1247
  key: 4,
1044
1248
  class: "--clickable mx-1",
1045
- onClick: Ue
1249
+ onClick: He
1250
+ })) : (i(), O(_(vs), {
1251
+ key: 5,
1252
+ class: "--clickable mx-1",
1253
+ onClick: Re
1046
1254
  }))
1047
1255
  ], 64)),
1048
- V(y(Gt), {
1256
+ S(_(Kt), {
1049
1257
  class: "--clickable mx-1",
1050
1258
  onClick: ve
1051
1259
  }),
1052
- V(y(t), {
1053
- modelValue: h.value,
1054
- "onUpdate:modelValue": b[2] || (b[2] = (p) => h.value = p),
1260
+ S(_(t), {
1261
+ modelValue: f.value,
1262
+ "onUpdate:modelValue": g[3] || (g[3] = (h) => f.value = h),
1055
1263
  x: 0,
1056
1264
  y: 0,
1057
- items: C.value,
1058
- onClick: Re
1265
+ items: w.value,
1266
+ onClick: Pe
1059
1267
  }, null, 8, ["modelValue", "items"])
1060
1268
  ])
1061
1269
  ], 64)),
1062
- a.value.outputs._node ? (i(), S(ke, {
1270
+ a.value.outputs._node ? (i(), O(Ce, {
1063
1271
  key: 3,
1064
1272
  node: a.value,
1065
1273
  intf: a.value.outputs._node,
@@ -1067,74 +1275,74 @@ const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"
1067
1275
  "data-interface-type": "node"
1068
1276
  }, null, 8, ["node", "intf"])) : I("", !0)
1069
1277
  ], 32),
1070
- l("div", {
1071
- class: U(["__content", ze.value]),
1072
- onKeydown: b[4] || (b[4] = ee(P(() => {
1278
+ r("div", {
1279
+ class: G(["__content", M.value]),
1280
+ onKeydown: g[5] || (g[5] = ne(A(() => {
1073
1281
  }, ["stop"]), ["delete"])),
1074
- onContextmenu: b[5] || (b[5] = P(() => {
1282
+ onContextmenu: g[6] || (g[6] = A(() => {
1075
1283
  }, ["prevent"]))
1076
1284
  }, [
1077
- l("div", Ns, [
1078
- (i(!0), r(z, null, H(je.value, (p) => (i(), r(z, {
1079
- key: p.id
1285
+ r("div", Ds, [
1286
+ (i(!0), l(T, null, P(Ue.value, (h) => (i(), l(T, {
1287
+ key: h.id
1080
1288
  }, [
1081
- a.value.state?.hidden ? (i(), r("div", Ms, [
1082
- p.port ? (i(), r("div", {
1289
+ a.value.state?.hidden ? (i(), l("div", As, [
1290
+ h.port ? (i(), l("div", {
1083
1291
  key: 0,
1084
- id: p.id,
1085
- title: p.name,
1292
+ id: h.id,
1293
+ title: h.name,
1086
1294
  class: "baklava-node-interface --output --connected"
1087
- }, [...b[6] || (b[6] = [
1088
- l("div", { class: "__port" }, null, -1)
1089
- ])], 8, $s)) : I("", !0)
1090
- ])) : Z(c.$slots, "nodeInterface", {
1295
+ }, [...g[7] || (g[7] = [
1296
+ r("div", { class: "__port" }, null, -1)
1297
+ ])], 8, Fs)) : I("", !0)
1298
+ ])) : W(c.$slots, "nodeInterface", {
1091
1299
  key: 1,
1092
1300
  type: "output",
1093
1301
  node: a.value,
1094
- intf: p
1302
+ intf: h
1095
1303
  }, () => [
1096
- V(y(n), {
1304
+ S(_(n), {
1097
1305
  node: a.value,
1098
- intf: p,
1099
- title: p.type
1306
+ intf: h,
1307
+ title: h.type
1100
1308
  }, null, 8, ["node", "intf", "title"])
1101
1309
  ])
1102
1310
  ], 64))), 128))
1103
1311
  ]),
1104
- l("div", Os, [
1105
- (i(!0), r(z, null, H(Be.value, (p) => (i(), r(z, {
1106
- key: p.id
1312
+ r("div", Ws, [
1313
+ (i(!0), l(T, null, P(Le.value, (h) => (i(), l(T, {
1314
+ key: h.id
1107
1315
  }, [
1108
- a.value.state?.hidden ? (i(), r("div", Ts, [
1109
- p.port ? (i(), r("div", {
1316
+ a.value.state?.hidden ? (i(), l("div", Xs, [
1317
+ h.port ? (i(), l("div", {
1110
1318
  key: 0,
1111
- id: p.id,
1112
- title: p.name,
1319
+ id: h.id,
1320
+ title: h.name,
1113
1321
  class: "baklava-node-interface --input --connected"
1114
- }, [...b[7] || (b[7] = [
1115
- l("div", { class: "__port" }, null, -1)
1116
- ])], 8, Es)) : I("", !0)
1117
- ])) : Z(c.$slots, "nodeInterface", {
1322
+ }, [...g[8] || (g[8] = [
1323
+ r("div", { class: "__port" }, null, -1)
1324
+ ])], 8, qs)) : I("", !0)
1325
+ ])) : W(c.$slots, "nodeInterface", {
1118
1326
  key: 1,
1119
1327
  node: a.value,
1120
- intf: p,
1328
+ intf: h,
1121
1329
  type: "input"
1122
1330
  }, () => [
1123
- V(y(n), {
1331
+ S(_(n), {
1124
1332
  node: a.value,
1125
- intf: p,
1126
- title: p.type
1333
+ intf: h,
1334
+ title: h.type
1127
1335
  }, null, 8, ["node", "intf", "title"])
1128
1336
  ])
1129
1337
  ], 64))), 128))
1130
1338
  ])
1131
1339
  ], 34)
1132
- ], 46, ks));
1340
+ ], 46, Gs));
1133
1341
  }
1134
- }), zs = ["title"], Vs = {
1342
+ }), Ys = ["title"], Qs = {
1135
1343
  key: 0,
1136
1344
  class: "__label"
1137
- }, Bs = /* @__PURE__ */ L({
1345
+ }, xe = /* @__PURE__ */ U({
1138
1346
  __name: "Checkbox",
1139
1347
  props: {
1140
1348
  disabled: { type: Boolean },
@@ -1145,119 +1353,152 @@ const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"
1145
1353
  emits: ["update:modelValue"],
1146
1354
  setup(s, { emit: e }) {
1147
1355
  const t = e;
1148
- return (n, o) => (i(), r("div", {
1149
- class: U(["baklava-checkbox", { "--checked": s.inversed ? !s.modelValue : s.modelValue, "--disabled": s.disabled }]),
1356
+ return (n, o) => (i(), l("div", {
1357
+ class: G(["baklava-checkbox", { "--checked": s.inversed ? !s.modelValue : s.modelValue, "--disabled": s.disabled }]),
1150
1358
  title: s.name,
1151
1359
  onClick: o[0] || (o[0] = (a) => t("update:modelValue", !s.modelValue))
1152
1360
  }, [
1153
- o[1] || (o[1] = l("div", { class: "__checkmark-container" }, [
1154
- l("svg", {
1361
+ o[1] || (o[1] = r("div", { class: "__checkmark-container" }, [
1362
+ r("svg", {
1155
1363
  xmlns: "http://www.w3.org/2000/svg",
1156
1364
  width: "18",
1157
1365
  height: "18",
1158
1366
  viewBox: "0 0 18 18"
1159
1367
  }, [
1160
- l("path", {
1368
+ r("path", {
1161
1369
  class: "__checkmark",
1162
1370
  d: "M 6 5 L 6 10 L 16 10",
1163
1371
  transform: "rotate(-45 10 10)"
1164
1372
  })
1165
1373
  ])
1166
1374
  ], -1)),
1167
- s.name ? (i(), r("div", Vs, B(s.name), 1)) : I("", !0)
1168
- ], 10, zs));
1375
+ s.name ? (i(), l("div", Qs, j(s.name), 1)) : I("", !0)
1376
+ ], 10, Ys));
1169
1377
  }
1170
- }), js = { class: "__header" }, Ls = { class: "__node-name" }, Us = { style: { display: "flex" } }, Gs = {
1171
- key: 1,
1378
+ }), Ks = { class: "__header" }, Zs = { class: "__node-name" }, en = { class: "__interfaces" }, tn = { class: "__inputs" }, sn = { style: { display: "flex" } }, nn = { class: "__outputs" }, on = {
1379
+ key: 0,
1172
1380
  class: "__interface"
1173
- }, Rs = /* @__PURE__ */ L({
1381
+ }, an = { style: { display: "flex" } }, rn = /* @__PURE__ */ U({
1174
1382
  __name: "CodeGraphSidebar",
1175
1383
  setup(s) {
1176
- const { viewModel: e } = F(), { graph: t } = ne(), n = T(null), o = Me(e.value.settings.sidebar, "width"), a = _(() => e.value.settings.sidebar.resizable);
1384
+ const { viewModel: e } = q(), { graph: t } = ae(), n = V(null), o = Te(e.value.settings.sidebar, "width"), a = b(() => e.value.settings.sidebar.resizable);
1177
1385
  let d = 0, u = 0;
1178
- const m = _(() => {
1179
- const v = t.value.sidebar.nodeId;
1180
- return t.value.nodes.find((h) => h.id === v);
1181
- }), w = _(() => m.value), k = _(() => ({
1386
+ const v = b(() => {
1387
+ const f = t.value.sidebar.nodeId;
1388
+ return t.value.nodes.find((w) => w.id === f);
1389
+ }), k = b(() => v.value), C = b(() => ({
1182
1390
  width: `${o.value}px`
1183
- })), O = _(() => w.value ? [...Object.values(w.value.inputs), ...Object.values(w.value.outputs)].filter((h) => h.displayInSidebar && h.component) : []), j = () => {
1391
+ })), B = b(() => k.value ? Object.values(k.value.inputs).filter((f) => f.displayInSidebar && f.component) : []), L = b(() => k.value ? Object.values(k.value.outputs).filter((f) => f.displayInSidebar && f.component) : []), $ = () => {
1184
1392
  t.value.sidebar.visible = !1;
1185
- }, x = () => {
1186
- m.value?.events.update.emit(null);
1187
- }, f = (v) => {
1188
- d = o.value, u = v.clientX, window.addEventListener("mousemove", g), window.addEventListener(
1393
+ }, m = () => {
1394
+ v.value?.events.update.emit(null);
1395
+ }, y = (f) => {
1396
+ d = o.value, u = f.clientX, window.addEventListener("mousemove", x), window.addEventListener(
1189
1397
  "mouseup",
1190
1398
  () => {
1191
- window.removeEventListener("mousemove", g);
1399
+ window.removeEventListener("mousemove", x);
1192
1400
  },
1193
1401
  { once: !0 }
1194
1402
  );
1195
- }, g = (v) => {
1196
- const h = n.value?.parentElement?.getBoundingClientRect().width ?? 500, C = v.clientX - u;
1197
- let N = d - C;
1198
- N < 300 ? N = 300 : N > 0.9 * h && (N = 0.9 * h), o.value = N;
1403
+ }, x = (f) => {
1404
+ const w = n.value?.parentElement?.getBoundingClientRect().width ?? 500, p = f.clientX - u;
1405
+ let M = d - p;
1406
+ M < 300 ? M = 300 : M > 0.9 * w && (M = 0.9 * w), o.value = M;
1199
1407
  };
1200
- return (v, h) => (i(), r("div", {
1408
+ return (f, w) => (i(), l("div", {
1409
+ class: G([{ "--open": _(t).sidebar.visible }, "baklava-sidebar"]),
1410
+ style: re(C.value),
1201
1411
  ref_key: "el",
1202
- ref: n,
1203
- class: U(["baklava-sidebar", { "--open": y(t).sidebar.visible }]),
1204
- style: ae(k.value)
1412
+ ref: n
1205
1413
  }, [
1206
- a.value ? (i(), r("div", {
1414
+ a.value ? (i(), l("div", {
1207
1415
  key: 0,
1208
1416
  class: "__resizer",
1209
- onMousedown: f
1417
+ onMousedown: y
1210
1418
  }, null, 32)) : I("", !0),
1211
- l("div", js, [
1212
- l("button", {
1213
- tabindex: "-1",
1214
- class: "__close",
1215
- onClick: j
1216
- }, "×"),
1217
- l("div", Ls, [
1218
- l("b", null, B(m.value ? m.value.title : ""), 1)
1219
- ])
1220
- ]),
1221
- (i(!0), r(z, null, H(O.value, (C) => (i(), r("div", {
1222
- key: C.id,
1223
- class: "__interface"
1224
- }, [
1225
- l("div", Us, [
1226
- V(Bs, {
1227
- modelValue: C.hidden,
1228
- "onUpdate:modelValue": [
1229
- (N) => C.hidden = N,
1230
- h[0] || (h[0] = () => m.value?.events.update.emit(null))
1231
- ],
1232
- disabled: !C.optional,
1233
- inversed: "",
1234
- style: { "padding-right": "8px" }
1235
- }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
1236
- (i(), S(pt(C.component), {
1237
- modelValue: C.value,
1238
- "onUpdate:modelValue": (N) => C.value = N,
1239
- node: m.value,
1240
- intf: C,
1241
- style: { width: "100%" }
1242
- }, null, 8, ["modelValue", "onUpdate:modelValue", "node", "intf"]))
1243
- ])
1244
- ]))), 128)),
1245
- w.value && w.value.state ? (i(), r("div", Gs, [
1246
- h[2] || (h[2] = l("label", null, "Variable name", -1)),
1247
- ie(l("input", {
1248
- "onUpdate:modelValue": h[1] || (h[1] = (C) => w.value.state.variableName = C),
1249
- type: "text",
1250
- class: "baklava-input",
1251
- title: "Variable name",
1252
- onBlur: x,
1253
- onKeydown: ee(x, ["enter"])
1254
- }, null, 544), [
1255
- [re, w.value.state.variableName]
1256
- ])
1257
- ])) : I("", !0)
1419
+ v.value ? (i(), l(T, { key: 1 }, [
1420
+ r("div", Ks, [
1421
+ r("button", {
1422
+ tabindex: "-1",
1423
+ class: "__close",
1424
+ onClick: $
1425
+ }, "×"),
1426
+ r("div", Zs, [
1427
+ r("b", null, j(v.value.title), 1)
1428
+ ])
1429
+ ]),
1430
+ r("div", en, [
1431
+ r("div", tn, [
1432
+ (i(!0), l(T, null, P(B.value, (p) => (i(), l("div", {
1433
+ key: p.id,
1434
+ class: "__interface"
1435
+ }, [
1436
+ r("div", sn, [
1437
+ S(xe, {
1438
+ modelValue: p.hidden,
1439
+ "onUpdate:modelValue": [
1440
+ (M) => p.hidden = M,
1441
+ w[0] || (w[0] = () => v.value?.events.update.emit(null))
1442
+ ],
1443
+ disabled: !p.optional,
1444
+ inversed: "",
1445
+ style: { "padding-right": "8px" }
1446
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
1447
+ (i(), O(we(p.component), {
1448
+ modelValue: p.value,
1449
+ "onUpdate:modelValue": (M) => p.value = M,
1450
+ node: v.value,
1451
+ intf: p,
1452
+ style: { width: "100%" }
1453
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "node", "intf"]))
1454
+ ])
1455
+ ]))), 128))
1456
+ ]),
1457
+ r("div", nn, [
1458
+ k.value && k.value.state ? (i(), l("div", on, [
1459
+ w[3] || (w[3] = r("label", null, "Variable name", -1)),
1460
+ ee(r("input", {
1461
+ "onUpdate:modelValue": w[1] || (w[1] = (p) => k.value.state.variableName = p),
1462
+ type: "text",
1463
+ class: "baklava-input",
1464
+ title: "Variable name",
1465
+ onBlur: m,
1466
+ onKeydown: ne(m, ["enter"])
1467
+ }, null, 544), [
1468
+ [te, k.value.state.variableName]
1469
+ ])
1470
+ ])) : I("", !0),
1471
+ (i(!0), l(T, null, P(L.value, (p) => (i(), l("div", {
1472
+ key: p.id,
1473
+ class: "__interface"
1474
+ }, [
1475
+ r("div", an, [
1476
+ S(xe, {
1477
+ modelValue: p.hidden,
1478
+ "onUpdate:modelValue": [
1479
+ (M) => p.hidden = M,
1480
+ w[2] || (w[2] = () => v.value?.events.update.emit(null))
1481
+ ],
1482
+ disabled: !p.optional,
1483
+ inversed: "",
1484
+ style: { "padding-right": "8px" }
1485
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
1486
+ (i(), O(we(p.component), {
1487
+ modelValue: p.value,
1488
+ "onUpdate:modelValue": (M) => p.value = M,
1489
+ node: v.value,
1490
+ intf: p,
1491
+ style: { width: "100%" }
1492
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "node", "intf"]))
1493
+ ])
1494
+ ]))), 128))
1495
+ ])
1496
+ ]),
1497
+ W(f.$slots, "codeEditor", { node: v.value })
1498
+ ], 64)) : I("", !0)
1258
1499
  ], 6));
1259
1500
  }
1260
- }), Ds = L({
1501
+ }), ln = U({
1261
1502
  props: {
1262
1503
  type: {
1263
1504
  type: String,
@@ -1269,119 +1510,119 @@ const ws = /* @__PURE__ */ $(bs, [["render", _s]]), ks = ["id", "data-node-type"
1269
1510
  }
1270
1511
  },
1271
1512
  setup(s) {
1272
- const { viewModel: e } = F(), { switchGraph: t } = ne(), n = T(!1), o = _(() => s.type.startsWith(K));
1513
+ const { viewModel: e } = q(), { switchGraph: t } = ae(), n = V(!1), o = b(() => s.type.startsWith(se));
1273
1514
  return { showContextMenu: n, hasContextMenu: o, contextMenuItems: [
1274
1515
  { label: "Edit Subgraph", value: "editSubgraph" },
1275
1516
  { label: "Delete Subgraph", value: "deleteSubgraph" }
1276
1517
  ], openContextMenu: () => {
1277
1518
  n.value = !0;
1278
- }, onContextMenuClick: (m) => {
1279
- const w = s.type.substring(K.length), k = e.value.editor.graphTemplates.find((O) => O.id === w);
1280
- if (k)
1281
- switch (m) {
1519
+ }, onContextMenuClick: (v) => {
1520
+ const k = s.type.substring(se.length), C = e.value.editor.graphTemplates.find((B) => B.id === k);
1521
+ if (C)
1522
+ switch (v) {
1282
1523
  case "editSubgraph":
1283
- t(k);
1524
+ t(C);
1284
1525
  break;
1285
1526
  case "deleteSubgraph":
1286
- e.value.editor.removeGraphTemplate(k);
1527
+ e.value.editor.removeGraphTemplate(C);
1287
1528
  break;
1288
1529
  }
1289
1530
  } };
1290
1531
  }
1291
- }), Ps = ["data-node-type"], Hs = { class: "__title" }, As = { class: "__title-label" };
1292
- function Fs(s, e, t, n, o, a) {
1293
- return i(), r("div", {
1532
+ }), dn = ["data-node-type"], un = { class: "__title" }, cn = { class: "__title-label" };
1533
+ function pn(s, e, t, n, o, a) {
1534
+ return i(), l("div", {
1294
1535
  class: "baklava-node --palette",
1295
1536
  "data-node-type": s.type
1296
1537
  }, [
1297
- l("div", Hs, [
1298
- l("div", As, B(s.title), 1)
1538
+ r("div", un, [
1539
+ r("div", cn, j(s.title), 1)
1299
1540
  ])
1300
- ], 8, Ps);
1541
+ ], 8, dn);
1301
1542
  }
1302
- const xe = /* @__PURE__ */ $(Ds, [["render", Fs]]), Ws = {
1543
+ const Ie = /* @__PURE__ */ N(ln, [["render", pn]]), hn = {
1303
1544
  class: "baklava-node --palette",
1304
1545
  style: { "margin-top": "-20px", "margin-bottom": "20px" }
1305
- }, Xs = {
1546
+ }, vn = {
1306
1547
  key: 0,
1307
1548
  style: { display: "flex", "justify-content": "space-between" }
1308
- }, Js = ["onClick"], Ys = {
1549
+ }, mn = ["onClick"], fn = {
1309
1550
  key: 0,
1310
1551
  style: { margin: "auto 0", "font-size": "12px" }
1311
- }, qs = /* @__PURE__ */ L({
1552
+ }, gn = /* @__PURE__ */ U({
1312
1553
  __name: "CodeNodePalette",
1313
1554
  setup(s) {
1314
- const { viewModel: e } = F(), { x: t, y: n } = wt(), { transform: o } = st(), a = nt(e), d = ht("editorEl"), u = T(""), m = T(null), w = () => u.value ? a.value.filter(
1315
- (x) => x.name.toLowerCase().includes(u.value.toLowerCase()) || Object.values(x.nodeTypes).some(
1316
- (f) => f.title.toLowerCase().includes(u.value.toLowerCase())
1555
+ const { viewModel: e } = q(), { x: t, y: n } = wt(), { transform: o } = ot(), a = at(e), d = vt("editorEl"), u = V(""), v = V(null), k = () => u.value ? a.value.filter(
1556
+ ($) => $.name.toLowerCase().includes(u.value.toLowerCase()) || Object.values($.nodeTypes).some(
1557
+ (m) => m.title.toLowerCase().includes(u.value.toLowerCase())
1317
1558
  )
1318
- ) : a.value, k = (x) => u.value ? Object.values(x).filter(
1319
- (f) => f.category.toLowerCase().includes(u.value.toLowerCase()) || f.title.toLowerCase().includes(u.value.toLowerCase())
1320
- ) : Object.values(x), O = _(() => {
1321
- if (!m.value || !d?.value) return {};
1322
- const { left: x, top: f } = d.value.getBoundingClientRect();
1559
+ ) : a.value, C = ($) => u.value ? Object.values($).filter(
1560
+ (m) => m.category.toLowerCase().includes(u.value.toLowerCase()) || m.title.toLowerCase().includes(u.value.toLowerCase())
1561
+ ) : Object.values($), B = b(() => {
1562
+ if (!v.value || !d?.value) return {};
1563
+ const { left: $, top: m } = d.value.getBoundingClientRect();
1323
1564
  return {
1324
- top: `${n.value - f}px`,
1325
- left: `${t.value - x}px`
1565
+ top: `${n.value - m}px`,
1566
+ left: `${t.value - $}px`
1326
1567
  };
1327
- }), j = (x, f) => {
1328
- m.value = {
1329
- type: x,
1330
- nodeInformation: f
1568
+ }), L = ($, m) => {
1569
+ v.value = {
1570
+ type: $,
1571
+ nodeInformation: m
1331
1572
  };
1332
- const g = () => {
1333
- const v = R(new f.type());
1334
- e.value.displayedGraph.addNode(v);
1335
- const h = d.value.getBoundingClientRect(), [C, N] = o(t.value - h.left, n.value - h.top);
1336
- v.position.x = C, v.position.y = N, m.value = null, document.removeEventListener("pointerup", g);
1573
+ const y = () => {
1574
+ const x = H(new m.type());
1575
+ e.value.displayedGraph.addNode(x);
1576
+ const f = d.value.getBoundingClientRect(), [w, p] = o(t.value - f.left, n.value - f.top);
1577
+ x.position.x = w, x.position.y = p, v.value = null, document.removeEventListener("pointerup", y);
1337
1578
  };
1338
- document.addEventListener("pointerup", g);
1579
+ document.addEventListener("pointerup", y);
1339
1580
  };
1340
- return (x, f) => (i(), r(z, null, [
1341
- l("div", {
1342
- class: U(["baklava-node-palette", { "--open": y(e).settings.palette.enabled }]),
1343
- onContextmenu: f[1] || (f[1] = P(() => {
1581
+ return ($, m) => (i(), l(T, null, [
1582
+ r("div", {
1583
+ class: G([{ "--open": _(e).settings.palette.enabled }, "baklava-node-palette"]),
1584
+ onContextmenu: m[1] || (m[1] = A(() => {
1344
1585
  }, ["stop", "prevent"]))
1345
1586
  }, [
1346
- l("div", Ws, [
1347
- ie(l("input", {
1348
- "onUpdate:modelValue": f[0] || (f[0] = (g) => u.value = g),
1587
+ r("div", hn, [
1588
+ ee(r("input", {
1589
+ "onUpdate:modelValue": m[0] || (m[0] = (y) => u.value = y),
1349
1590
  type: "text",
1350
1591
  class: "baklava-input",
1351
1592
  title: "Filter nodes",
1352
- onKeyup: w
1593
+ onKeyup: k
1353
1594
  }, null, 544), [
1354
- [re, u.value]
1595
+ [te, u.value]
1355
1596
  ])
1356
1597
  ]),
1357
- (i(!0), r(z, null, H(w(), (g) => (i(), r("section", {
1358
- key: g.name
1598
+ (i(!0), l(T, null, P(k(), (y) => (i(), l("section", {
1599
+ key: y.name
1359
1600
  }, [
1360
- g.name !== "default" ? (i(), r("h3", Xs, [
1361
- l("div", {
1362
- onClick: (v) => u.value = g.name,
1601
+ y.name !== "default" ? (i(), l("h3", vn, [
1602
+ r("div", {
1603
+ onClick: (x) => u.value = y.name,
1363
1604
  style: { cursor: "pointer" }
1364
- }, B(g.name), 9, Js),
1365
- k(g.nodeTypes).length < Object.values(g.nodeTypes).length ? (i(), r("div", Ys, " ( " + B(k(g.nodeTypes).length) + " / " + B(Object.values(g.nodeTypes).length) + " ) ", 1)) : I("", !0)
1605
+ }, j(y.name), 9, mn),
1606
+ C(y.nodeTypes).length < Object.values(y.nodeTypes).length ? (i(), l("div", fn, " ( " + j(C(y.nodeTypes).length) + " / " + j(Object.values(y.nodeTypes).length) + " ) ", 1)) : I("", !0)
1366
1607
  ])) : I("", !0),
1367
- (i(!0), r(z, null, H(k(g.nodeTypes), (v) => (i(), S(xe, {
1368
- key: v.type,
1369
- type: v.type,
1370
- title: v.title,
1371
- onPointerdown: (h) => j(v.type, v)
1608
+ (i(!0), l(T, null, P(C(y.nodeTypes), (x) => (i(), O(Ie, {
1609
+ key: x.type,
1610
+ type: x.type,
1611
+ title: x.title,
1612
+ onPointerdown: (f) => L(x.type, x)
1372
1613
  }, null, 8, ["type", "title", "onPointerdown"]))), 128))
1373
1614
  ]))), 128))
1374
1615
  ], 34),
1375
- V(vt, { name: "fade" }, {
1376
- default: J(() => [
1377
- m.value ? (i(), r("div", {
1616
+ S(mt, { name: "fade" }, {
1617
+ default: F(() => [
1618
+ v.value ? (i(), l("div", {
1378
1619
  key: 0,
1379
1620
  class: "baklava-dragged-node",
1380
- style: ae(O.value)
1621
+ style: re(B.value)
1381
1622
  }, [
1382
- V(xe, {
1383
- type: m.value.type,
1384
- title: m.value.nodeInformation.title
1623
+ S(Ie, {
1624
+ type: v.value.type,
1625
+ title: v.value.nodeInformation.title
1385
1626
  }, null, 8, ["type", "title"])
1386
1627
  ], 4)) : I("", !0)
1387
1628
  ]),
@@ -1389,33 +1630,38 @@ const xe = /* @__PURE__ */ $(Ds, [["render", Fs]]), Ws = {
1389
1630
  })
1390
1631
  ], 64));
1391
1632
  }
1392
- }), wn = /* @__PURE__ */ L({
1633
+ }), Dn = /* @__PURE__ */ U({
1393
1634
  __name: "CodeGraphEditor",
1394
1635
  props: {
1395
1636
  viewModel: {}
1396
1637
  },
1397
1638
  setup(s) {
1398
- const t = Me(s, "viewModel"), n = (o) => o.events.update.emit(null);
1399
- return oe(() => {
1639
+ const t = Te(s, "viewModel"), n = (o) => o.events.update.emit(null);
1640
+ return ie(() => {
1400
1641
  t.value.subscribe(), t.value.engine.start();
1401
- }), mt(() => {
1642
+ }), ft(() => {
1402
1643
  t.value.unsubscribe(), t.value.engine.stop();
1403
- }), (o, a) => (i(), S(y(ot), { "view-model": t.value }, {
1404
- palette: J(() => [
1405
- V(qs)
1644
+ }), (o, a) => (i(), O(_(it), { "view-model": t.value }, {
1645
+ palette: F(() => [
1646
+ S(gn)
1406
1647
  ]),
1407
- node: J((d) => [
1408
- V(Ss, bt(d, {
1648
+ node: F((d) => [
1649
+ S(Js, yt(d, {
1409
1650
  onUpdate: (u) => n(d.node)
1410
1651
  }), null, 16, ["onUpdate"])
1411
1652
  ]),
1412
- sidebar: J((d) => [
1413
- V(Rs, ft(gt(d)), null, 16)
1653
+ sidebar: F((d) => [
1654
+ S(rn, gt(bt(d)), {
1655
+ codeEditor: F(({ node: u }) => [
1656
+ W(o.$slots, "sidebarCodeEditor", { node: u })
1657
+ ]),
1658
+ _: 3
1659
+ }, 16)
1414
1660
  ]),
1415
- _: 1
1661
+ _: 3
1416
1662
  }, 8, ["view-model"]));
1417
1663
  }
1418
- }), Qs = (s) => {
1664
+ }), bn = (s) => {
1419
1665
  const e = "TOGGLE_PALETTE";
1420
1666
  s.commandHandler.registerCommand(e, {
1421
1667
  execute: () => s.settings.palette.enabled = !s.settings.palette.enabled,
@@ -1435,23 +1681,23 @@ const xe = /* @__PURE__ */ $(Ds, [["render", Fs]]), Ws = {
1435
1681
  command: e,
1436
1682
  title: "Toggle palette",
1437
1683
  // Tooltip text
1438
- icon: _(() => s.settings.palette.enabled ? Ht : Xt)
1684
+ icon: b(() => s.settings.palette.enabled ? ss : is)
1439
1685
  },
1440
- ...at,
1686
+ ...rt,
1441
1687
  {
1442
1688
  command: t,
1443
1689
  title: "Clear all",
1444
1690
  // Tooltip text
1445
- icon: ws
1691
+ icon: Us
1446
1692
  },
1447
1693
  {
1448
1694
  command: n,
1449
1695
  title: "Toggle minimap",
1450
1696
  // Tooltip text
1451
- icon: _(() => s.settings.enableMinimap ? hs : ds)
1697
+ icon: b(() => s.settings.enableMinimap ? Ts : Ns)
1452
1698
  }
1453
1699
  ];
1454
- }, X = {
1700
+ }, Q = {
1455
1701
  enableMinimap: !1,
1456
1702
  toolbar: {
1457
1703
  enabled: !0
@@ -1466,72 +1712,92 @@ const xe = /* @__PURE__ */ $(Ds, [["render", Fs]]), Ws = {
1466
1712
  },
1467
1713
  displayValueOnHover: !1
1468
1714
  };
1469
- function kn(s) {
1470
- const e = it(s?.existingEditor);
1471
- e.code = s?.code ? new s.code(e) : new Ot(e), Qs(e);
1715
+ function An(s) {
1716
+ const e = lt(s?.existingEditor);
1717
+ e.code = s?.code ? new s.code(e) : new jt(e), bn(e);
1472
1718
  const t = {};
1473
- return Object.keys(X).forEach((n) => {
1474
- t[n] = typeof X[n] == "object" ? { ...e.settings[n], ...X[n] } : X[n];
1475
- }), e.settings = R({ ...e.settings, ...t }), e.settings.nodes.defaultWidth = 350, e.state = R({
1719
+ return Object.keys(Q).forEach((n) => {
1720
+ t[n] = typeof Q[n] == "object" ? { ...e.settings[n], ...Q[n] } : Q[n];
1721
+ }), e.settings = H({ ...e.settings, ...t }), e.settings.nodes.defaultWidth = 350, e.state = H({
1476
1722
  modules: {},
1477
1723
  token: null
1478
- }), e.engine = new rt(e.editor), e.subscribe = () => {
1724
+ }), e.engine = new dt(e.editor), e.subscribe = () => {
1479
1725
  e.state.token && e.unsubscribe();
1480
- const n = Symbol();
1481
- e.displayedGraph.events.addNode.subscribe(n, (o) => o.code = e.code), e.engine.events.beforeRun.subscribe(n, () => {
1482
- e.engine.pause(), e.code && (e.code.onCodeUpdate(), e.code.sortNodes(), e.code.updateCodeTemplates(), e.code.resetInputInterfaceScript()), e.engine.resume();
1483
- }), e.engine.events.beforeNodeCalculation.subscribe(n, (o) => {
1726
+ const n = Symbol(), o = e.displayedGraph;
1727
+ o.events.addNode.subscribe(n, (a) => {
1728
+ a.code = e.code;
1729
+ }), o.events.addConnection.subscribe(n, (a) => {
1730
+ e.code.findNodeById(a.to.nodeId)?.onConnected(), e.code.findNodeById(a.from.nodeId)?.onConnected();
1731
+ }), o.events.removeConnection.subscribe(n, (a) => {
1732
+ e.code.findNodeById(a.to.nodeId)?.onUnconnected(), e.code.findNodeById(a.from.nodeId)?.onUnconnected();
1733
+ }), e.engine.events.beforeRun.subscribe(n, () => {
1734
+ e.engine.pause(), e.code && (e.code.updateCodeNodes(), e.code.sortNodes(), e.code.updateCodeTemplates(), e.code.resetInputInterfaceScript()), e.engine.resume();
1735
+ }), e.engine.events.beforeNodeCalculation.subscribe(n, (a) => {
1484
1736
  e.engine.pause();
1485
- const a = o.node;
1486
- a.isCodeNode && (a.updateOutputVariableName(), a.updateConnectedInputInterfaces()), e.engine.resume();
1487
- }), e.engine.events.afterRun.subscribe(n, (o) => {
1488
- e.engine.pause(), lt(o, e.editor), e.code && (e.code.renderNodeCodes(), e.code.renderCode()), e.engine.resume();
1737
+ const d = a.node;
1738
+ d.isCodeNode && (d.updateOutputNames(), d.updateConnectedInputInterfaces()), e.engine.resume();
1739
+ }), e.engine.events.afterRun.subscribe(n, (a) => {
1740
+ e.engine.pause(), ut(a, e.editor), e.code && (e.code.renderNodeCodes(), e.code.renderCode()), e.engine.resume();
1489
1741
  }), e.state.token = n;
1490
1742
  }, e.unsubscribe = () => {
1491
1743
  if (!e.state.token) return;
1492
1744
  const n = e.state.token;
1493
- e.displayedGraph.events.addNode.unsubscribe(n), e.engine.events.beforeRun.unsubscribe(n), e.engine.events.afterRun.unsubscribe(n), e.state.token = null;
1745
+ e.displayedGraph.events.addNode.unsubscribe(n), e.displayedGraph.events.addConnection.unsubscribe(n), e.engine.events.beforeRun.unsubscribe(n), e.engine.events.afterRun.unsubscribe(n), e.state.token = null;
1494
1746
  }, e;
1495
1747
  }
1496
1748
  export {
1497
- kt as AbstractCodeNode,
1498
- rn as CheckboxInterface,
1499
- In as CheckboxInterfaceComponent,
1500
- Ot as Code,
1501
- wn as CodeGraphEditor,
1502
- $e as CodeNode,
1503
- W as CodeNodeInputInterface,
1749
+ Ct as AbstractCodeNode,
1750
+ Hn as Check,
1751
+ $n as CheckboxInterface,
1752
+ jt as Code,
1753
+ Dn as CodeGraphEditor,
1754
+ Ee as CodeNode,
1755
+ Y as CodeNodeInputInterface,
1504
1756
  D as CodeNodeInterface,
1757
+ le as CodeNodeInterfaceComponent,
1505
1758
  Mt as CodeNodeOutputInterface,
1506
- X as DEFAULT_SETTINGS,
1507
- $t as DynamicCodeNode,
1508
- ln as IntegerInterface,
1509
- dn as ListInputInterface,
1510
- un as NumberInterface,
1511
- Nn as NumberInterfaceComponent,
1512
- cn as SelectInterface,
1513
- pn as SliderInterface,
1514
- hn as TextInputInterface,
1515
- vn as TextareaInputInterface,
1516
- mn as TupleInputInterface,
1517
- an as addDefaultInterfaceTypes,
1518
- Qs as addToolbarCommands,
1519
- Te as booleanType,
1520
- fn as defineCodeNode,
1521
- gn as defineDynamicCodeNode,
1522
- Nt as dictType,
1759
+ Ft as CodeVariable,
1760
+ Pn as Copy,
1761
+ Q as DEFAULT_SETTINGS,
1762
+ Kt as DotsVertical,
1763
+ St as DynamicCodeNode,
1764
+ Mn as IntegerInterface,
1765
+ ss as LayoutSidebarLeftCollapse,
1766
+ is as LayoutSidebarLeftExpand,
1767
+ us as LayoutSidebarRight,
1768
+ vs as LayoutSidebarRightCollapse,
1769
+ bs as LayoutSidebarRightExpand,
1770
+ On as ListInputInterface,
1771
+ ws as LockCode,
1772
+ Tn as NumberInterface,
1773
+ Ns as Schema,
1774
+ Ts as SchemaOff,
1775
+ En as SelectInterface,
1776
+ Bn as SliderInterface,
1777
+ Vn as TextInputInterface,
1778
+ zt as TextInputInterfaceComponent,
1779
+ zn as TextareaInputInterface,
1780
+ zs as TransitionBottom,
1781
+ Us as TrashOff,
1782
+ Sn as TupleInputInterface,
1783
+ Nn as addDefaultInterfaceTypes,
1784
+ bn as addToolbarCommands,
1785
+ Ve as booleanType,
1786
+ jn as defineCodeNode,
1787
+ Ln as defineDynamicCodeNode,
1788
+ $t as dictType,
1523
1789
  xt as formatInputs,
1524
- te as getCodeNodes,
1525
- bn as getPositionAtColumn,
1526
- yn as getPositionBeforeNode,
1527
- Ee as listType,
1528
- Oe as loadNodeState,
1529
- A as nodeType,
1790
+ oe as getCodeNodes,
1791
+ Un as getPositionAtColumn,
1792
+ Gn as getPositionBeforeNode,
1793
+ ze as listType,
1794
+ Be as loadNodeState,
1795
+ X as nodeType,
1530
1796
  de as numberType,
1531
- Ct as saveNodeState,
1532
- on as setOptional,
1797
+ It as saveNodeState,
1798
+ In as setOptional,
1533
1799
  ue as stringType,
1534
- _n as transferCodeScript,
1800
+ Rn as transferCodeScript,
1535
1801
  Se as tupleType,
1536
- kn as useCodeGraph
1802
+ An as useCodeGraph
1537
1803
  };