@foresthubai/workflow-builder 0.3.0 → 0.4.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 (124) hide show
  1. package/LICENSE +661 -661
  2. package/NOTICE +16 -16
  3. package/README.md +110 -93
  4. package/dist/components/ui/command.d.ts +2 -2
  5. package/dist/components/ui/input.d.ts +1 -1
  6. package/dist/components/ui/resizable.d.ts +1 -1
  7. package/dist/components/ui/textarea.d.ts +1 -1
  8. package/dist/graph/BaseNode.js +10 -10
  9. package/dist/graph/reactFlowRegistry.d.ts.map +1 -1
  10. package/dist/lib/utils.d.ts +3 -0
  11. package/dist/lib/utils.d.ts.map +1 -0
  12. package/dist/lib/utils.js +6 -0
  13. package/dist/lib/utils.js.map +1 -0
  14. package/dist/stores/editorStore.d.ts +0 -1
  15. package/dist/stores/editorStore.d.ts.map +1 -1
  16. package/dist/stores/editorStore.js +1 -11
  17. package/dist/stores/editorStore.js.map +1 -1
  18. package/dist/toolbars/CanvasTabsToolbar.d.ts +11 -0
  19. package/dist/toolbars/CanvasTabsToolbar.d.ts.map +1 -0
  20. package/dist/toolbars/CanvasTabsToolbar.js +101 -0
  21. package/dist/toolbars/CanvasTabsToolbar.js.map +1 -0
  22. package/package.json +2 -2
  23. package/src/BuilderLayout.tsx +345 -345
  24. package/src/Canvas.tsx +261 -261
  25. package/src/CanvasEditor.tsx +142 -142
  26. package/src/CanvasTabsToolbar.tsx +176 -176
  27. package/src/RightConfigPanel.tsx +266 -266
  28. package/src/WorkflowBuilder.tsx +412 -412
  29. package/src/cn.ts +6 -6
  30. package/src/components/ui/add-button.tsx +39 -39
  31. package/src/components/ui/alert-dialog.tsx +141 -141
  32. package/src/components/ui/alert.tsx +59 -59
  33. package/src/components/ui/badge.tsx +36 -36
  34. package/src/components/ui/button.tsx +85 -85
  35. package/src/components/ui/card.tsx +79 -79
  36. package/src/components/ui/checkbox.tsx +28 -28
  37. package/src/components/ui/collapsible.tsx +9 -9
  38. package/src/components/ui/command.tsx +153 -153
  39. package/src/components/ui/delete-button.tsx +23 -23
  40. package/src/components/ui/dialog.tsx +125 -125
  41. package/src/components/ui/dropdown-menu.tsx +198 -198
  42. package/src/components/ui/input.tsx +55 -55
  43. package/src/components/ui/label.tsx +24 -24
  44. package/src/components/ui/readonly-banner.tsx +15 -15
  45. package/src/components/ui/resizable.tsx +43 -43
  46. package/src/components/ui/scroll-area.tsx +102 -102
  47. package/src/components/ui/select.tsx +160 -160
  48. package/src/components/ui/separator.tsx +29 -29
  49. package/src/components/ui/switch.tsx +27 -27
  50. package/src/components/ui/textarea.tsx +51 -51
  51. package/src/components/ui/toast.tsx +127 -127
  52. package/src/components/ui/toaster.tsx +33 -33
  53. package/src/components/ui/toggle-group.tsx +59 -59
  54. package/src/components/ui/toggle.tsx +43 -43
  55. package/src/components/ui/tooltip.tsx +32 -32
  56. package/src/dialogs/NodePickerDialog.tsx +84 -84
  57. package/src/dialogs/ValidationDialog.tsx +184 -184
  58. package/src/graph/BaseNode.tsx +557 -557
  59. package/src/graph/CustomEdge.tsx +185 -185
  60. package/src/graph/CustomNode.tsx +16 -16
  61. package/src/graph/FunctionCallNode.tsx +30 -30
  62. package/src/graph/PortHandle.tsx +189 -189
  63. package/src/graph/reactFlowRegistry.ts +26 -26
  64. package/src/hooks/use-toast.ts +125 -125
  65. package/src/hooks/useAvailableVariables.ts +20 -20
  66. package/src/hooks/useCanvasHistory.ts +22 -22
  67. package/src/hooks/useCanvasTabs.ts +168 -168
  68. package/src/hooks/useFunctionDiagnosticsSync.ts +40 -40
  69. package/src/hooks/useFunctionRegistry.ts +26 -26
  70. package/src/hooks/useFunctions.ts +44 -44
  71. package/src/hooks/useGraph.ts +161 -161
  72. package/src/hooks/useNodeDefinitions.ts +82 -82
  73. package/src/hooks/useParamErrors.ts +26 -26
  74. package/src/hooks/useResolvedTheme.ts +30 -30
  75. package/src/hooks/useResourceDiagnosticsSync.ts +58 -58
  76. package/src/hooks/useSuppressThemeTransition.ts +79 -79
  77. package/src/hooks/useWorkflowSerialization.ts +127 -127
  78. package/src/i18n/index.ts +53 -53
  79. package/src/i18n/locales/de.json +501 -501
  80. package/src/i18n/locales/en.json +557 -557
  81. package/src/index.ts +27 -27
  82. package/src/inputs/ExpressionInput.tsx +297 -297
  83. package/src/inputs/ParameterEditor.tsx +515 -515
  84. package/src/inputs/PortSection.tsx +144 -144
  85. package/src/panels/BuilderSidebar.tsx +301 -301
  86. package/src/panels/ChannelConfigPanel.tsx +49 -49
  87. package/src/panels/ChannelsPanel.tsx +28 -28
  88. package/src/panels/DebugConsolePanel.tsx +73 -73
  89. package/src/panels/DebugContextPanel.tsx +77 -77
  90. package/src/panels/DebugExternalIOPanel.tsx +180 -180
  91. package/src/panels/DiagnosticsPanel.tsx +170 -170
  92. package/src/panels/EdgeConfigPanel.tsx +104 -104
  93. package/src/panels/FunctionConfigPanel.tsx +179 -179
  94. package/src/panels/FunctionListPanel.tsx +45 -45
  95. package/src/panels/MemoryConfigPanel.tsx +55 -55
  96. package/src/panels/MemoryPanel.tsx +40 -40
  97. package/src/panels/ModelConfigPanel.tsx +41 -41
  98. package/src/panels/ModelsPanel.tsx +36 -36
  99. package/src/panels/NodeConfigPanel.tsx +630 -630
  100. package/src/panels/NodeLibrary.tsx +288 -288
  101. package/src/panels/ResourceConfigPanel.tsx +132 -132
  102. package/src/panels/ResourceListPanel.tsx +113 -113
  103. package/src/panels/VariableConfigPanel.tsx +161 -161
  104. package/src/panels/VariablesPanel.tsx +145 -145
  105. package/src/stores/canvasStore.test.ts +44 -44
  106. package/src/stores/canvasStore.ts +245 -245
  107. package/src/stores/debugStore.ts +74 -74
  108. package/src/stores/diagnosticsStore.ts +130 -130
  109. package/src/stores/editorStore.ts +190 -202
  110. package/src/styles/index.css +526 -526
  111. package/src/utils/categoryConstants.ts +26 -26
  112. package/src/utils/channelOperations.ts +86 -86
  113. package/src/utils/connectionRules.ts +137 -137
  114. package/src/utils/functionOperations.ts +179 -179
  115. package/src/utils/graphOperations.ts +550 -550
  116. package/src/utils/history.ts +207 -207
  117. package/src/utils/memoryOperations.ts +57 -57
  118. package/src/utils/migrateFunctionNodes.ts +107 -107
  119. package/src/utils/modelOperations.ts +55 -55
  120. package/src/utils/paramDisplay.ts +71 -71
  121. package/src/utils/resourceHelpers.ts +32 -32
  122. package/src/utils/translation.ts +28 -28
  123. package/src/utils/variableOperations.ts +75 -75
  124. package/tailwind-preset.ts +166 -166
@@ -1,179 +1,179 @@
1
- import type { Expression } from "@foresthubai/workflow-core";
2
- import type { DataType } from "@foresthubai/workflow-core/parameter";
3
- import type { FunctionDeclaration } from "@foresthubai/workflow-core/function";
4
- import { generateId } from "@foresthubai/workflow-core/id";
5
- import { ensureUid, type ApiVariable } from "@foresthubai/workflow-core/variable";
6
- import { useEditorStore } from "../stores/editorStore";
7
- import {
8
- getCanvasStore,
9
- getOrCreateCanvasStore,
10
- deleteCanvasStore,
11
- syncFunctionArgVariables,
12
- notifyCanvasRegistryChange,
13
- } from "../stores/canvasStore";
14
- import { uniqueName } from "./resourceHelpers";
15
-
16
- /**
17
- * Functions are a project-scoped resource: the declaration ({@link FunctionDeclaration}
18
- * — signature + bundled output assignments) lives in editorStore, the body lives in
19
- * the matching canvas store (id === fn.id). These operations keep the two in sync.
20
- * Like channel/memory/model operations they write straight to the store (no undo
21
- * history). A declaration change (name/arguments/outputs) forward-reconciles call
22
- * sites via the migration subscription; an output *expression* edit does not (call
23
- * sites never see the callee's expressions), so it doesn't bump the version.
24
- */
25
-
26
- const emptyExpression = (dataType: DataType): Expression => ({ expression: "", references: [], dataType });
27
-
28
- /** Re-derive the body's fnarg variables from the declaration's current arguments. */
29
- function syncBody(fn: FunctionDeclaration): void {
30
- const store = getCanvasStore(fn.id);
31
- if (store) syncFunctionArgVariables(store, fn.arguments);
32
- }
33
-
34
- /**
35
- * Apply an update to one function. `bumpVersion` is true for signature changes
36
- * (name/arguments/outputs declaration) so call sites detect staleness, and false for
37
- * pure output-expression edits. Version-bumping changes re-sync the body's fnargs.
38
- */
39
- function mutate(id: string, updater: (fn: FunctionDeclaration) => FunctionDeclaration, bumpVersion: boolean): void {
40
- let next: FunctionDeclaration | undefined;
41
- useEditorStore.getState().setFunctions((fns) => {
42
- const fn = fns[id];
43
- if (!fn) return fns;
44
- const updated = updater(fn);
45
- next = bumpVersion ? { ...updated, version: fn.version + 1 } : updated;
46
- return { ...fns, [id]: next };
47
- });
48
- if (next && bumpVersion) syncBody(next);
49
- }
50
-
51
- /** Create a new (empty) function + its body canvas. Returns the new definition. */
52
- export function addFunction(): FunctionDeclaration {
53
- const id = generateId();
54
- const existing = Object.values(useEditorStore.getState().functions).map((f) => f.name);
55
- const fn: FunctionDeclaration = {
56
- id,
57
- version: 1,
58
- name: uniqueName("function", existing),
59
- arguments: [],
60
- outputs: [],
61
- };
62
- useEditorStore.getState().setFunctions((fns) => ({ ...fns, [id]: fn }));
63
- // Create the body canvas (seeds an OnFunctionCall node) and watch it.
64
- getOrCreateCanvasStore(id);
65
- notifyCanvasRegistryChange();
66
- return fn;
67
- }
68
-
69
- /** Delete a function: its declaration, its body canvas, and any selection of it. */
70
- export function deleteFunction(id: string): void {
71
- useEditorStore.getState().setFunctions((fns) => {
72
- const { [id]: _drop, ...rest } = fns;
73
- return rest;
74
- });
75
- deleteCanvasStore(id);
76
- const sel = useEditorStore.getState().selection;
77
- if (sel.kind === "function" && sel.id === id) {
78
- useEditorStore.getState().clearSelection();
79
- }
80
- }
81
-
82
- /** Rename a function. Call-site migration detects this via the name comparison, so
83
- * it needs no version bump. */
84
- export function renameFunction(id: string, name: string): void {
85
- mutate(id, (fn) => ({ ...fn, name }), false);
86
- }
87
-
88
- // ── Input arguments (declarations) ─────────────────────────────────────────────
89
-
90
- export function addArgument(id: string): void {
91
- mutate(
92
- id,
93
- (fn) => ({
94
- ...fn,
95
- arguments: [...fn.arguments, ensureUid({ name: `input${fn.arguments.length + 1}`, dataType: "string" })],
96
- }),
97
- true,
98
- );
99
- }
100
-
101
- export function updateArgument(id: string, index: number, patch: Partial<ApiVariable>): void {
102
- mutate(
103
- id,
104
- (fn) => {
105
- const existing = fn.arguments[index];
106
- if (!existing) return fn;
107
- const next = [...fn.arguments];
108
- next[index] = { ...existing, ...patch };
109
- return { ...fn, arguments: next };
110
- },
111
- true,
112
- );
113
- }
114
-
115
- export function removeArgument(id: string, index: number): void {
116
- mutate(id, (fn) => ({ ...fn, arguments: fn.arguments.filter((_, i) => i !== index) }), true);
117
- }
118
-
119
- // ── Outputs (declaration + assignment bundled) ─────────────────────────────────
120
-
121
- export function addOutput(id: string): void {
122
- mutate(
123
- id,
124
- (fn) => {
125
- const dataType: DataType = "string";
126
- return {
127
- ...fn,
128
- outputs: [...fn.outputs, { uid: generateId(), name: `output${fn.outputs.length + 1}`, dataType, expression: emptyExpression(dataType) }],
129
- };
130
- },
131
- true,
132
- );
133
- }
134
-
135
- /** Update an output's declaration (name/dataType). A dataType change retags the
136
- * bundled expression's dataType but keeps the entered text. */
137
- export function updateOutput(id: string, index: number, patch: { name?: string; dataType?: DataType }): void {
138
- mutate(
139
- id,
140
- (fn) => {
141
- const existing = fn.outputs[index];
142
- if (!existing) return fn;
143
- const dataType = patch.dataType ?? existing.dataType;
144
- const next = [...fn.outputs];
145
- next[index] = {
146
- ...existing,
147
- ...patch,
148
- dataType,
149
- expression: patch.dataType ? { ...existing.expression, dataType } : existing.expression,
150
- };
151
- return { ...fn, outputs: next };
152
- },
153
- true,
154
- );
155
- }
156
-
157
- export function removeOutput(id: string, index: number): void {
158
- mutate(id, (fn) => ({ ...fn, outputs: fn.outputs.filter((_, i) => i !== index) }), true);
159
- }
160
-
161
- /** Set one output's return-value expression. Not a signature change → no version bump. */
162
- export function setOutputExpression(id: string, index: number, expression: Expression): void {
163
- mutate(
164
- id,
165
- (fn) => {
166
- const existing = fn.outputs[index];
167
- if (!existing) return fn;
168
- const next = [...fn.outputs];
169
- next[index] = { ...existing, expression };
170
- return { ...fn, outputs: next };
171
- },
172
- false,
173
- );
174
- }
175
-
176
- /** Read a function declaration without subscribing (for non-component callers). */
177
- export function getFunction(id: string): FunctionDeclaration | undefined {
178
- return useEditorStore.getState().functions[id];
179
- }
1
+ import type { Expression } from "@foresthubai/workflow-core";
2
+ import type { DataType } from "@foresthubai/workflow-core/parameter";
3
+ import type { FunctionDeclaration } from "@foresthubai/workflow-core/function";
4
+ import { generateId } from "@foresthubai/workflow-core/id";
5
+ import { ensureUid, type ApiVariable } from "@foresthubai/workflow-core/variable";
6
+ import { useEditorStore } from "../stores/editorStore";
7
+ import {
8
+ getCanvasStore,
9
+ getOrCreateCanvasStore,
10
+ deleteCanvasStore,
11
+ syncFunctionArgVariables,
12
+ notifyCanvasRegistryChange,
13
+ } from "../stores/canvasStore";
14
+ import { uniqueName } from "./resourceHelpers";
15
+
16
+ /**
17
+ * Functions are a project-scoped resource: the declaration ({@link FunctionDeclaration}
18
+ * — signature + bundled output assignments) lives in editorStore, the body lives in
19
+ * the matching canvas store (id === fn.id). These operations keep the two in sync.
20
+ * Like channel/memory/model operations they write straight to the store (no undo
21
+ * history). A declaration change (name/arguments/outputs) forward-reconciles call
22
+ * sites via the migration subscription; an output *expression* edit does not (call
23
+ * sites never see the callee's expressions), so it doesn't bump the version.
24
+ */
25
+
26
+ const emptyExpression = (dataType: DataType): Expression => ({ expression: "", references: [], dataType });
27
+
28
+ /** Re-derive the body's fnarg variables from the declaration's current arguments. */
29
+ function syncBody(fn: FunctionDeclaration): void {
30
+ const store = getCanvasStore(fn.id);
31
+ if (store) syncFunctionArgVariables(store, fn.arguments);
32
+ }
33
+
34
+ /**
35
+ * Apply an update to one function. `bumpVersion` is true for signature changes
36
+ * (name/arguments/outputs declaration) so call sites detect staleness, and false for
37
+ * pure output-expression edits. Version-bumping changes re-sync the body's fnargs.
38
+ */
39
+ function mutate(id: string, updater: (fn: FunctionDeclaration) => FunctionDeclaration, bumpVersion: boolean): void {
40
+ let next: FunctionDeclaration | undefined;
41
+ useEditorStore.getState().setFunctions((fns) => {
42
+ const fn = fns[id];
43
+ if (!fn) return fns;
44
+ const updated = updater(fn);
45
+ next = bumpVersion ? { ...updated, version: fn.version + 1 } : updated;
46
+ return { ...fns, [id]: next };
47
+ });
48
+ if (next && bumpVersion) syncBody(next);
49
+ }
50
+
51
+ /** Create a new (empty) function + its body canvas. Returns the new definition. */
52
+ export function addFunction(): FunctionDeclaration {
53
+ const id = generateId();
54
+ const existing = Object.values(useEditorStore.getState().functions).map((f) => f.name);
55
+ const fn: FunctionDeclaration = {
56
+ id,
57
+ version: 1,
58
+ name: uniqueName("function", existing),
59
+ arguments: [],
60
+ outputs: [],
61
+ };
62
+ useEditorStore.getState().setFunctions((fns) => ({ ...fns, [id]: fn }));
63
+ // Create the body canvas (seeds an OnFunctionCall node) and watch it.
64
+ getOrCreateCanvasStore(id);
65
+ notifyCanvasRegistryChange();
66
+ return fn;
67
+ }
68
+
69
+ /** Delete a function: its declaration, its body canvas, and any selection of it. */
70
+ export function deleteFunction(id: string): void {
71
+ useEditorStore.getState().setFunctions((fns) => {
72
+ const { [id]: _drop, ...rest } = fns;
73
+ return rest;
74
+ });
75
+ deleteCanvasStore(id);
76
+ const sel = useEditorStore.getState().selection;
77
+ if (sel.kind === "function" && sel.id === id) {
78
+ useEditorStore.getState().clearSelection();
79
+ }
80
+ }
81
+
82
+ /** Rename a function. Call-site migration detects this via the name comparison, so
83
+ * it needs no version bump. */
84
+ export function renameFunction(id: string, name: string): void {
85
+ mutate(id, (fn) => ({ ...fn, name }), false);
86
+ }
87
+
88
+ // ── Input arguments (declarations) ─────────────────────────────────────────────
89
+
90
+ export function addArgument(id: string): void {
91
+ mutate(
92
+ id,
93
+ (fn) => ({
94
+ ...fn,
95
+ arguments: [...fn.arguments, ensureUid({ name: `input${fn.arguments.length + 1}`, dataType: "string" })],
96
+ }),
97
+ true,
98
+ );
99
+ }
100
+
101
+ export function updateArgument(id: string, index: number, patch: Partial<ApiVariable>): void {
102
+ mutate(
103
+ id,
104
+ (fn) => {
105
+ const existing = fn.arguments[index];
106
+ if (!existing) return fn;
107
+ const next = [...fn.arguments];
108
+ next[index] = { ...existing, ...patch };
109
+ return { ...fn, arguments: next };
110
+ },
111
+ true,
112
+ );
113
+ }
114
+
115
+ export function removeArgument(id: string, index: number): void {
116
+ mutate(id, (fn) => ({ ...fn, arguments: fn.arguments.filter((_, i) => i !== index) }), true);
117
+ }
118
+
119
+ // ── Outputs (declaration + assignment bundled) ─────────────────────────────────
120
+
121
+ export function addOutput(id: string): void {
122
+ mutate(
123
+ id,
124
+ (fn) => {
125
+ const dataType: DataType = "string";
126
+ return {
127
+ ...fn,
128
+ outputs: [...fn.outputs, { uid: generateId(), name: `output${fn.outputs.length + 1}`, dataType, expression: emptyExpression(dataType) }],
129
+ };
130
+ },
131
+ true,
132
+ );
133
+ }
134
+
135
+ /** Update an output's declaration (name/dataType). A dataType change retags the
136
+ * bundled expression's dataType but keeps the entered text. */
137
+ export function updateOutput(id: string, index: number, patch: { name?: string; dataType?: DataType }): void {
138
+ mutate(
139
+ id,
140
+ (fn) => {
141
+ const existing = fn.outputs[index];
142
+ if (!existing) return fn;
143
+ const dataType = patch.dataType ?? existing.dataType;
144
+ const next = [...fn.outputs];
145
+ next[index] = {
146
+ ...existing,
147
+ ...patch,
148
+ dataType,
149
+ expression: patch.dataType ? { ...existing.expression, dataType } : existing.expression,
150
+ };
151
+ return { ...fn, outputs: next };
152
+ },
153
+ true,
154
+ );
155
+ }
156
+
157
+ export function removeOutput(id: string, index: number): void {
158
+ mutate(id, (fn) => ({ ...fn, outputs: fn.outputs.filter((_, i) => i !== index) }), true);
159
+ }
160
+
161
+ /** Set one output's return-value expression. Not a signature change → no version bump. */
162
+ export function setOutputExpression(id: string, index: number, expression: Expression): void {
163
+ mutate(
164
+ id,
165
+ (fn) => {
166
+ const existing = fn.outputs[index];
167
+ if (!existing) return fn;
168
+ const next = [...fn.outputs];
169
+ next[index] = { ...existing, expression };
170
+ return { ...fn, outputs: next };
171
+ },
172
+ false,
173
+ );
174
+ }
175
+
176
+ /** Read a function declaration without subscribing (for non-component callers). */
177
+ export function getFunction(id: string): FunctionDeclaration | undefined {
178
+ return useEditorStore.getState().functions[id];
179
+ }