@babsey/code-graph 0.0.16 → 0.1.0

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