@genfeedai/workflow-ui 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.
- package/dist/canvas.d.mts +27 -0
- package/dist/canvas.d.ts +27 -0
- package/dist/canvas.js +45 -0
- package/dist/canvas.mjs +16 -0
- package/dist/chunk-22PDGHNQ.mjs +737 -0
- package/dist/chunk-3SPPKCWR.js +458 -0
- package/dist/chunk-3YFFDHC5.js +300 -0
- package/dist/chunk-5HJFQVUR.js +61 -0
- package/dist/chunk-5LQ4QBR5.js +2 -0
- package/dist/chunk-6DOEUDD5.js +254 -0
- package/dist/chunk-7SKSRSS7.mjs +57 -0
- package/dist/chunk-AC6TWLRT.mjs +27 -0
- package/dist/chunk-ADWNF7V3.js +120 -0
- package/dist/chunk-BJ3R5R32.mjs +2163 -0
- package/dist/chunk-CETJJ73S.js +1555 -0
- package/dist/chunk-CSUBLSKZ.mjs +1002 -0
- package/dist/chunk-CV4M7CNU.mjs +251 -0
- package/dist/chunk-E323WAZG.mjs +272 -0
- package/dist/chunk-E544XUBL.js +378 -0
- package/dist/chunk-EC2ZIWOK.js +1007 -0
- package/dist/chunk-EFXQT23N.mjs +99 -0
- package/dist/chunk-EMUMKW5C.js +107 -0
- package/dist/chunk-FOMOOERN.js +2 -0
- package/dist/chunk-FT33LFII.mjs +21 -0
- package/dist/chunk-FT64PCUP.mjs +533 -0
- package/dist/chunk-H6LZKSLY.js +5678 -0
- package/dist/chunk-HPQT36RR.js +543 -0
- package/dist/chunk-JLWKW3G5.js +2 -0
- package/dist/chunk-L5TF4EHW.mjs +1 -0
- package/dist/chunk-LAJ34AH2.mjs +374 -0
- package/dist/chunk-LDN7IX4Y.mjs +1 -0
- package/dist/chunk-MLJJBBTB.mjs +1 -0
- package/dist/chunk-NSDLGLAQ.js +2166 -0
- package/dist/chunk-RJ262NXS.js +24 -0
- package/dist/chunk-RXNEDWK2.js +141 -0
- package/dist/chunk-SW7QNEZU.js +744 -0
- package/dist/chunk-UQQUWGHW.mjs +118 -0
- package/dist/chunk-VOGL2WCE.mjs +1542 -0
- package/dist/chunk-VRN3UWE5.mjs +138 -0
- package/dist/chunk-XV5Z5XYR.mjs +5640 -0
- package/dist/chunk-Z7PWFZG5.js +30 -0
- package/dist/chunk-ZJD5WMR3.mjs +418 -0
- package/dist/hooks.d.mts +255 -0
- package/dist/hooks.d.ts +255 -0
- package/dist/hooks.js +56 -0
- package/dist/hooks.mjs +11 -0
- package/dist/index.d.mts +29 -0
- package/dist/index.d.ts +29 -0
- package/dist/index.js +180 -0
- package/dist/index.mjs +19 -0
- package/dist/lib.d.mts +164 -0
- package/dist/lib.d.ts +164 -0
- package/dist/lib.js +144 -0
- package/dist/lib.mjs +3 -0
- package/dist/nodes.d.mts +128 -0
- package/dist/nodes.d.ts +128 -0
- package/dist/nodes.js +151 -0
- package/dist/nodes.mjs +14 -0
- package/dist/panels.d.mts +22 -0
- package/dist/panels.d.ts +22 -0
- package/dist/panels.js +21 -0
- package/dist/panels.mjs +4 -0
- package/dist/promptLibraryStore-BZnfmEkc.d.ts +464 -0
- package/dist/promptLibraryStore-zqb59nsu.d.mts +464 -0
- package/dist/provider.d.mts +29 -0
- package/dist/provider.d.ts +29 -0
- package/dist/provider.js +17 -0
- package/dist/provider.mjs +4 -0
- package/dist/stores.d.mts +96 -0
- package/dist/stores.d.ts +96 -0
- package/dist/stores.js +113 -0
- package/dist/stores.mjs +43 -0
- package/dist/toolbar.d.mts +73 -0
- package/dist/toolbar.d.ts +73 -0
- package/dist/toolbar.js +34 -0
- package/dist/toolbar.mjs +5 -0
- package/dist/types-ipAnBzAJ.d.mts +46 -0
- package/dist/types-ipAnBzAJ.d.ts +46 -0
- package/dist/ui.d.mts +67 -0
- package/dist/ui.d.ts +67 -0
- package/dist/ui.js +84 -0
- package/dist/ui.mjs +3 -0
- package/dist/workflowStore-4EGKJLYK.mjs +3 -0
- package/dist/workflowStore-KM32FDL7.js +12 -0
- package/package.json +117 -0
- package/src/styles/workflow-ui.css +186 -0
package/dist/hooks.d.mts
ADDED
|
@@ -0,0 +1,255 @@
|
|
|
1
|
+
import { NodeGroup, WorkflowNode, NodeType, WorkflowNodeData, ProviderModel, SelectedModel, AvailableVariable } from '@genfeedai/types';
|
|
2
|
+
import { FitViewOptions } from '@xyflow/react';
|
|
3
|
+
import * as react from 'react';
|
|
4
|
+
import { ReactNode, RefObject } from 'react';
|
|
5
|
+
|
|
6
|
+
interface UseCanvasKeyboardShortcutsParams {
|
|
7
|
+
selectedNodeIds: string[];
|
|
8
|
+
groups: NodeGroup[];
|
|
9
|
+
nodes: WorkflowNode[];
|
|
10
|
+
toggleNodeLock: (nodeId: string) => void;
|
|
11
|
+
createGroup: (nodeIds: string[]) => string;
|
|
12
|
+
deleteGroup: (groupId: string) => void;
|
|
13
|
+
unlockAllNodes: () => void;
|
|
14
|
+
addNode: (type: NodeType, position: {
|
|
15
|
+
x: number;
|
|
16
|
+
y: number;
|
|
17
|
+
}) => string;
|
|
18
|
+
togglePalette: () => void;
|
|
19
|
+
fitView: (options?: FitViewOptions) => void;
|
|
20
|
+
openShortcutHelp: () => void;
|
|
21
|
+
openNodeSearch: () => void;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Hook that handles keyboard shortcuts for the workflow canvas
|
|
25
|
+
*
|
|
26
|
+
* Shortcuts:
|
|
27
|
+
* - M: Toggle sidebar/palette
|
|
28
|
+
* - L: Toggle lock on selected nodes
|
|
29
|
+
* - F: Fit view to selection (or all if none selected)
|
|
30
|
+
* - ?: Show shortcut help modal
|
|
31
|
+
* - Ctrl/Cmd+F: Open node search
|
|
32
|
+
* - Ctrl/Cmd+G: Create group from selection
|
|
33
|
+
* - Ctrl/Cmd+Shift+G: Ungroup selected nodes
|
|
34
|
+
* - Ctrl/Cmd+Shift+L: Unlock all nodes
|
|
35
|
+
* - Shift+I: Add image generator node
|
|
36
|
+
* - Shift+V: Add video generator node
|
|
37
|
+
* - Shift+P: Add prompt node
|
|
38
|
+
* - Shift+L: Add LLM node
|
|
39
|
+
* - Ctrl/Cmd+Z: Undo
|
|
40
|
+
* - Ctrl/Cmd+Shift+Z: Redo
|
|
41
|
+
*/
|
|
42
|
+
declare function useCanvasKeyboardShortcuts({ selectedNodeIds, groups, nodes, toggleNodeLock, createGroup, deleteGroup, unlockAllNodes, addNode, togglePalette, fitView, openShortcutHelp, openNodeSearch, }: UseCanvasKeyboardShortcutsParams): void;
|
|
43
|
+
|
|
44
|
+
interface RequiredInputsResult {
|
|
45
|
+
/** Whether all required inputs have connections */
|
|
46
|
+
hasRequiredInputs: boolean;
|
|
47
|
+
/** List of missing required input handle IDs */
|
|
48
|
+
missingInputs: string[];
|
|
49
|
+
/** Map of handle ID to whether it's connected */
|
|
50
|
+
connectionStatus: Map<string, boolean>;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Hook that checks if all required inputs for a node are connected.
|
|
54
|
+
* Uses edge connections, not actual data values.
|
|
55
|
+
*
|
|
56
|
+
* @param nodeId - The node ID to check
|
|
57
|
+
* @param nodeType - The node type (to look up required inputs from NODE_DEFINITIONS)
|
|
58
|
+
* @returns Object with hasRequiredInputs boolean and details about missing inputs
|
|
59
|
+
*/
|
|
60
|
+
declare function useRequiredInputs(nodeId: string, nodeType: NodeType): RequiredInputsResult;
|
|
61
|
+
|
|
62
|
+
interface MissingItem {
|
|
63
|
+
type: 'connection' | 'data' | 'schema';
|
|
64
|
+
field: string;
|
|
65
|
+
message: string;
|
|
66
|
+
}
|
|
67
|
+
interface CanGenerateResult {
|
|
68
|
+
/** Whether all validation passes and generation can proceed */
|
|
69
|
+
canGenerate: boolean;
|
|
70
|
+
/** List of missing items with details */
|
|
71
|
+
missingItems: MissingItem[];
|
|
72
|
+
/** Whether all required connections exist */
|
|
73
|
+
hasRequiredConnections: boolean;
|
|
74
|
+
/** Whether all connected nodes have actual data */
|
|
75
|
+
hasConnectedData: boolean;
|
|
76
|
+
/** Whether all required schema fields are filled */
|
|
77
|
+
hasRequiredSchemaFields: boolean;
|
|
78
|
+
}
|
|
79
|
+
interface UseCanGenerateOptions {
|
|
80
|
+
/** The node ID to validate */
|
|
81
|
+
nodeId: string;
|
|
82
|
+
/** The node type (to look up required inputs from NODE_DEFINITIONS) */
|
|
83
|
+
nodeType: NodeType;
|
|
84
|
+
/** The model's input schema with required array */
|
|
85
|
+
inputSchema?: Record<string, unknown>;
|
|
86
|
+
/** Current schema parameter values */
|
|
87
|
+
schemaParams?: Record<string, unknown>;
|
|
88
|
+
}
|
|
89
|
+
/**
|
|
90
|
+
* Hook that performs comprehensive validation for the Generate button.
|
|
91
|
+
*
|
|
92
|
+
* Validates:
|
|
93
|
+
* 1. Required connections exist (from NODE_DEFINITIONS)
|
|
94
|
+
* 2. Connected nodes have actual data values (not just edges)
|
|
95
|
+
* 3. Required schema fields from model inputSchema are filled
|
|
96
|
+
*
|
|
97
|
+
* @returns Object with canGenerate boolean and detailed breakdown
|
|
98
|
+
*/
|
|
99
|
+
declare function useCanGenerate({ nodeId, nodeType, inputSchema, schemaParams, }: UseCanGenerateOptions): CanGenerateResult;
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* Hook for triggering and stopping node execution
|
|
103
|
+
*
|
|
104
|
+
* Encapsulates the common pattern of:
|
|
105
|
+
* 1. Setting node status to processing
|
|
106
|
+
* 2. Triggering execution
|
|
107
|
+
* 3. Stopping execution and resetting status
|
|
108
|
+
*
|
|
109
|
+
* @param nodeId - The ID of the node to execute
|
|
110
|
+
* @returns handleGenerate - Callback to trigger node execution
|
|
111
|
+
* @returns handleStop - Callback to stop node execution
|
|
112
|
+
*/
|
|
113
|
+
declare function useNodeExecution(nodeId: string): {
|
|
114
|
+
handleGenerate: () => void;
|
|
115
|
+
handleStop: () => void;
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
type ModelMap = Record<string, string>;
|
|
119
|
+
interface UseModelSelectionOptions<TModel extends string> {
|
|
120
|
+
/** Node ID to update */
|
|
121
|
+
nodeId: string;
|
|
122
|
+
/** Map of provider model IDs to internal model types */
|
|
123
|
+
modelMap: ModelMap;
|
|
124
|
+
/** Fallback internal model if not found in map */
|
|
125
|
+
fallbackModel: TModel;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Hook for handling model selection in AI generator nodes.
|
|
129
|
+
* Consolidates the common pattern from ImageGenNode and VideoGenNode.
|
|
130
|
+
*
|
|
131
|
+
* @returns handleModelSelect callback to pass to ModelBrowserModal
|
|
132
|
+
*/
|
|
133
|
+
declare function useModelSelection<TModel extends string, TNodeData extends WorkflowNodeData & {
|
|
134
|
+
model?: TModel;
|
|
135
|
+
}>({ nodeId, modelMap, fallbackModel }: UseModelSelectionOptions<TModel>): {
|
|
136
|
+
handleModelSelect: (model: ProviderModel) => void;
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* JSON Schema property definition
|
|
141
|
+
* These come from Replicate model schemas
|
|
142
|
+
*/
|
|
143
|
+
interface SchemaProperty {
|
|
144
|
+
type?: string;
|
|
145
|
+
title?: string;
|
|
146
|
+
description?: string;
|
|
147
|
+
default?: unknown;
|
|
148
|
+
minimum?: number;
|
|
149
|
+
maximum?: number;
|
|
150
|
+
'x-order'?: number;
|
|
151
|
+
allOf?: Array<{
|
|
152
|
+
$ref: string;
|
|
153
|
+
}>;
|
|
154
|
+
enum?: string[];
|
|
155
|
+
nullable?: boolean;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
interface UseAIGenNodeOptions {
|
|
159
|
+
nodeId: string;
|
|
160
|
+
selectedModel: SelectedModel | undefined;
|
|
161
|
+
schemaParams: Record<string, unknown> | undefined;
|
|
162
|
+
}
|
|
163
|
+
declare function useAIGenNode<TNodeData extends WorkflowNodeData>({ nodeId, selectedModel, schemaParams, }: UseAIGenNodeOptions): {
|
|
164
|
+
schemaProperties: Record<string, SchemaProperty> | undefined;
|
|
165
|
+
enumValues: Record<string, string[]> | undefined;
|
|
166
|
+
modelSupportsImageInput: boolean;
|
|
167
|
+
handleSchemaParamChange: (key: string, value: unknown) => void;
|
|
168
|
+
componentSchemas: Record<string, {
|
|
169
|
+
enum?: unknown[];
|
|
170
|
+
type?: string;
|
|
171
|
+
}> | undefined;
|
|
172
|
+
};
|
|
173
|
+
|
|
174
|
+
interface UseAIGenNodeHeaderOptions {
|
|
175
|
+
modelDisplayName: string;
|
|
176
|
+
isProcessing: boolean;
|
|
177
|
+
canGenerate: boolean;
|
|
178
|
+
hasOutput: boolean;
|
|
179
|
+
onModelBrowse: () => void;
|
|
180
|
+
onGenerate: () => void;
|
|
181
|
+
onStop: () => void;
|
|
182
|
+
onExpand: () => void;
|
|
183
|
+
}
|
|
184
|
+
declare function useAIGenNodeHeader({ modelDisplayName, isProcessing, canGenerate, hasOutput, onModelBrowse, onGenerate, onStop, onExpand, }: UseAIGenNodeHeaderOptions): {
|
|
185
|
+
titleElement: ReactNode;
|
|
186
|
+
headerActions: ReactNode;
|
|
187
|
+
};
|
|
188
|
+
|
|
189
|
+
interface UsePromptAutocompleteOptions {
|
|
190
|
+
availableVariables: AvailableVariable[];
|
|
191
|
+
textareaRef: RefObject<HTMLTextAreaElement | null>;
|
|
192
|
+
localTemplate: string;
|
|
193
|
+
setLocalTemplate: (value: string) => void;
|
|
194
|
+
onTemplateCommit?: (newTemplate: string) => void;
|
|
195
|
+
}
|
|
196
|
+
interface UsePromptAutocompleteReturn {
|
|
197
|
+
showAutocomplete: boolean;
|
|
198
|
+
autocompletePosition: {
|
|
199
|
+
top: number;
|
|
200
|
+
left: number;
|
|
201
|
+
};
|
|
202
|
+
filteredAutocompleteVars: AvailableVariable[];
|
|
203
|
+
selectedAutocompleteIndex: number;
|
|
204
|
+
handleChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
|
|
205
|
+
handleKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
|
|
206
|
+
handleAutocompleteSelect: (varName: string) => void;
|
|
207
|
+
closeAutocomplete: () => void;
|
|
208
|
+
}
|
|
209
|
+
declare function usePromptAutocomplete({ availableVariables, textareaRef, localTemplate, setLocalTemplate, onTemplateCommit, }: UsePromptAutocompleteOptions): UsePromptAutocompleteReturn;
|
|
210
|
+
|
|
211
|
+
interface UseMediaUploadOptions<T extends WorkflowNodeData> {
|
|
212
|
+
nodeId: string;
|
|
213
|
+
mediaType: 'image' | 'video';
|
|
214
|
+
initialUrl?: string;
|
|
215
|
+
getMetadata: (src: string) => Promise<Record<string, unknown>>;
|
|
216
|
+
buildUploadUpdate: (url: string, filename: string, metadata: Record<string, unknown>) => Partial<T>;
|
|
217
|
+
buildUrlUpdate: (url: string, metadata: Record<string, unknown> | null) => Partial<T>;
|
|
218
|
+
buildRemoveUpdate: () => Partial<T>;
|
|
219
|
+
}
|
|
220
|
+
declare function useMediaUpload<T extends WorkflowNodeData>({ nodeId, mediaType, initialUrl, getMetadata, buildUploadUpdate, buildUrlUpdate, buildRemoveUpdate, }: UseMediaUploadOptions<T>): {
|
|
221
|
+
fileInputRef: react.RefObject<HTMLInputElement | null>;
|
|
222
|
+
showUrlInput: boolean;
|
|
223
|
+
setShowUrlInput: react.Dispatch<react.SetStateAction<boolean>>;
|
|
224
|
+
urlValue: string;
|
|
225
|
+
setUrlValue: react.Dispatch<react.SetStateAction<string>>;
|
|
226
|
+
isUploading: boolean;
|
|
227
|
+
handleFileSelect: (e: React.ChangeEvent<HTMLInputElement>) => Promise<void>;
|
|
228
|
+
handleRemove: () => void;
|
|
229
|
+
handleUrlSubmit: () => Promise<void>;
|
|
230
|
+
handleUrlKeyDown: (e: React.KeyboardEvent) => void;
|
|
231
|
+
};
|
|
232
|
+
|
|
233
|
+
interface UseAutoLoadModelSchemaOptions<TModel extends string> {
|
|
234
|
+
/** Current model type from node data */
|
|
235
|
+
currentModel: TModel | undefined;
|
|
236
|
+
/** Selected model with full schema (if already loaded) */
|
|
237
|
+
selectedModel: SelectedModel | undefined;
|
|
238
|
+
/** Map from internal model type to API model ID */
|
|
239
|
+
modelIdMap: Record<TModel, string>;
|
|
240
|
+
/** Callback when model is loaded from API */
|
|
241
|
+
onModelSelect: (model: ProviderModel) => void;
|
|
242
|
+
}
|
|
243
|
+
/**
|
|
244
|
+
* Hook that auto-loads model schema for a node when the selectedModel is not set
|
|
245
|
+
* but a model type is already selected.
|
|
246
|
+
*
|
|
247
|
+
* This handles the case where a node has a default model but hasn't loaded
|
|
248
|
+
* the full schema yet.
|
|
249
|
+
*
|
|
250
|
+
* Uses the WorkflowUIProvider's modelSchema service to fetch the schema.
|
|
251
|
+
* Falls back to no-op if the service is not configured.
|
|
252
|
+
*/
|
|
253
|
+
declare function useAutoLoadModelSchema<TModel extends string>({ currentModel, selectedModel, modelIdMap, onModelSelect, }: UseAutoLoadModelSchemaOptions<TModel>): void;
|
|
254
|
+
|
|
255
|
+
export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs };
|
package/dist/hooks.d.ts
ADDED
|
@@ -0,0 +1,255 @@
|
|
|
1
|
+
import { NodeGroup, WorkflowNode, NodeType, WorkflowNodeData, ProviderModel, SelectedModel, AvailableVariable } from '@genfeedai/types';
|
|
2
|
+
import { FitViewOptions } from '@xyflow/react';
|
|
3
|
+
import * as react from 'react';
|
|
4
|
+
import { ReactNode, RefObject } from 'react';
|
|
5
|
+
|
|
6
|
+
interface UseCanvasKeyboardShortcutsParams {
|
|
7
|
+
selectedNodeIds: string[];
|
|
8
|
+
groups: NodeGroup[];
|
|
9
|
+
nodes: WorkflowNode[];
|
|
10
|
+
toggleNodeLock: (nodeId: string) => void;
|
|
11
|
+
createGroup: (nodeIds: string[]) => string;
|
|
12
|
+
deleteGroup: (groupId: string) => void;
|
|
13
|
+
unlockAllNodes: () => void;
|
|
14
|
+
addNode: (type: NodeType, position: {
|
|
15
|
+
x: number;
|
|
16
|
+
y: number;
|
|
17
|
+
}) => string;
|
|
18
|
+
togglePalette: () => void;
|
|
19
|
+
fitView: (options?: FitViewOptions) => void;
|
|
20
|
+
openShortcutHelp: () => void;
|
|
21
|
+
openNodeSearch: () => void;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Hook that handles keyboard shortcuts for the workflow canvas
|
|
25
|
+
*
|
|
26
|
+
* Shortcuts:
|
|
27
|
+
* - M: Toggle sidebar/palette
|
|
28
|
+
* - L: Toggle lock on selected nodes
|
|
29
|
+
* - F: Fit view to selection (or all if none selected)
|
|
30
|
+
* - ?: Show shortcut help modal
|
|
31
|
+
* - Ctrl/Cmd+F: Open node search
|
|
32
|
+
* - Ctrl/Cmd+G: Create group from selection
|
|
33
|
+
* - Ctrl/Cmd+Shift+G: Ungroup selected nodes
|
|
34
|
+
* - Ctrl/Cmd+Shift+L: Unlock all nodes
|
|
35
|
+
* - Shift+I: Add image generator node
|
|
36
|
+
* - Shift+V: Add video generator node
|
|
37
|
+
* - Shift+P: Add prompt node
|
|
38
|
+
* - Shift+L: Add LLM node
|
|
39
|
+
* - Ctrl/Cmd+Z: Undo
|
|
40
|
+
* - Ctrl/Cmd+Shift+Z: Redo
|
|
41
|
+
*/
|
|
42
|
+
declare function useCanvasKeyboardShortcuts({ selectedNodeIds, groups, nodes, toggleNodeLock, createGroup, deleteGroup, unlockAllNodes, addNode, togglePalette, fitView, openShortcutHelp, openNodeSearch, }: UseCanvasKeyboardShortcutsParams): void;
|
|
43
|
+
|
|
44
|
+
interface RequiredInputsResult {
|
|
45
|
+
/** Whether all required inputs have connections */
|
|
46
|
+
hasRequiredInputs: boolean;
|
|
47
|
+
/** List of missing required input handle IDs */
|
|
48
|
+
missingInputs: string[];
|
|
49
|
+
/** Map of handle ID to whether it's connected */
|
|
50
|
+
connectionStatus: Map<string, boolean>;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Hook that checks if all required inputs for a node are connected.
|
|
54
|
+
* Uses edge connections, not actual data values.
|
|
55
|
+
*
|
|
56
|
+
* @param nodeId - The node ID to check
|
|
57
|
+
* @param nodeType - The node type (to look up required inputs from NODE_DEFINITIONS)
|
|
58
|
+
* @returns Object with hasRequiredInputs boolean and details about missing inputs
|
|
59
|
+
*/
|
|
60
|
+
declare function useRequiredInputs(nodeId: string, nodeType: NodeType): RequiredInputsResult;
|
|
61
|
+
|
|
62
|
+
interface MissingItem {
|
|
63
|
+
type: 'connection' | 'data' | 'schema';
|
|
64
|
+
field: string;
|
|
65
|
+
message: string;
|
|
66
|
+
}
|
|
67
|
+
interface CanGenerateResult {
|
|
68
|
+
/** Whether all validation passes and generation can proceed */
|
|
69
|
+
canGenerate: boolean;
|
|
70
|
+
/** List of missing items with details */
|
|
71
|
+
missingItems: MissingItem[];
|
|
72
|
+
/** Whether all required connections exist */
|
|
73
|
+
hasRequiredConnections: boolean;
|
|
74
|
+
/** Whether all connected nodes have actual data */
|
|
75
|
+
hasConnectedData: boolean;
|
|
76
|
+
/** Whether all required schema fields are filled */
|
|
77
|
+
hasRequiredSchemaFields: boolean;
|
|
78
|
+
}
|
|
79
|
+
interface UseCanGenerateOptions {
|
|
80
|
+
/** The node ID to validate */
|
|
81
|
+
nodeId: string;
|
|
82
|
+
/** The node type (to look up required inputs from NODE_DEFINITIONS) */
|
|
83
|
+
nodeType: NodeType;
|
|
84
|
+
/** The model's input schema with required array */
|
|
85
|
+
inputSchema?: Record<string, unknown>;
|
|
86
|
+
/** Current schema parameter values */
|
|
87
|
+
schemaParams?: Record<string, unknown>;
|
|
88
|
+
}
|
|
89
|
+
/**
|
|
90
|
+
* Hook that performs comprehensive validation for the Generate button.
|
|
91
|
+
*
|
|
92
|
+
* Validates:
|
|
93
|
+
* 1. Required connections exist (from NODE_DEFINITIONS)
|
|
94
|
+
* 2. Connected nodes have actual data values (not just edges)
|
|
95
|
+
* 3. Required schema fields from model inputSchema are filled
|
|
96
|
+
*
|
|
97
|
+
* @returns Object with canGenerate boolean and detailed breakdown
|
|
98
|
+
*/
|
|
99
|
+
declare function useCanGenerate({ nodeId, nodeType, inputSchema, schemaParams, }: UseCanGenerateOptions): CanGenerateResult;
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* Hook for triggering and stopping node execution
|
|
103
|
+
*
|
|
104
|
+
* Encapsulates the common pattern of:
|
|
105
|
+
* 1. Setting node status to processing
|
|
106
|
+
* 2. Triggering execution
|
|
107
|
+
* 3. Stopping execution and resetting status
|
|
108
|
+
*
|
|
109
|
+
* @param nodeId - The ID of the node to execute
|
|
110
|
+
* @returns handleGenerate - Callback to trigger node execution
|
|
111
|
+
* @returns handleStop - Callback to stop node execution
|
|
112
|
+
*/
|
|
113
|
+
declare function useNodeExecution(nodeId: string): {
|
|
114
|
+
handleGenerate: () => void;
|
|
115
|
+
handleStop: () => void;
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
type ModelMap = Record<string, string>;
|
|
119
|
+
interface UseModelSelectionOptions<TModel extends string> {
|
|
120
|
+
/** Node ID to update */
|
|
121
|
+
nodeId: string;
|
|
122
|
+
/** Map of provider model IDs to internal model types */
|
|
123
|
+
modelMap: ModelMap;
|
|
124
|
+
/** Fallback internal model if not found in map */
|
|
125
|
+
fallbackModel: TModel;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Hook for handling model selection in AI generator nodes.
|
|
129
|
+
* Consolidates the common pattern from ImageGenNode and VideoGenNode.
|
|
130
|
+
*
|
|
131
|
+
* @returns handleModelSelect callback to pass to ModelBrowserModal
|
|
132
|
+
*/
|
|
133
|
+
declare function useModelSelection<TModel extends string, TNodeData extends WorkflowNodeData & {
|
|
134
|
+
model?: TModel;
|
|
135
|
+
}>({ nodeId, modelMap, fallbackModel }: UseModelSelectionOptions<TModel>): {
|
|
136
|
+
handleModelSelect: (model: ProviderModel) => void;
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* JSON Schema property definition
|
|
141
|
+
* These come from Replicate model schemas
|
|
142
|
+
*/
|
|
143
|
+
interface SchemaProperty {
|
|
144
|
+
type?: string;
|
|
145
|
+
title?: string;
|
|
146
|
+
description?: string;
|
|
147
|
+
default?: unknown;
|
|
148
|
+
minimum?: number;
|
|
149
|
+
maximum?: number;
|
|
150
|
+
'x-order'?: number;
|
|
151
|
+
allOf?: Array<{
|
|
152
|
+
$ref: string;
|
|
153
|
+
}>;
|
|
154
|
+
enum?: string[];
|
|
155
|
+
nullable?: boolean;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
interface UseAIGenNodeOptions {
|
|
159
|
+
nodeId: string;
|
|
160
|
+
selectedModel: SelectedModel | undefined;
|
|
161
|
+
schemaParams: Record<string, unknown> | undefined;
|
|
162
|
+
}
|
|
163
|
+
declare function useAIGenNode<TNodeData extends WorkflowNodeData>({ nodeId, selectedModel, schemaParams, }: UseAIGenNodeOptions): {
|
|
164
|
+
schemaProperties: Record<string, SchemaProperty> | undefined;
|
|
165
|
+
enumValues: Record<string, string[]> | undefined;
|
|
166
|
+
modelSupportsImageInput: boolean;
|
|
167
|
+
handleSchemaParamChange: (key: string, value: unknown) => void;
|
|
168
|
+
componentSchemas: Record<string, {
|
|
169
|
+
enum?: unknown[];
|
|
170
|
+
type?: string;
|
|
171
|
+
}> | undefined;
|
|
172
|
+
};
|
|
173
|
+
|
|
174
|
+
interface UseAIGenNodeHeaderOptions {
|
|
175
|
+
modelDisplayName: string;
|
|
176
|
+
isProcessing: boolean;
|
|
177
|
+
canGenerate: boolean;
|
|
178
|
+
hasOutput: boolean;
|
|
179
|
+
onModelBrowse: () => void;
|
|
180
|
+
onGenerate: () => void;
|
|
181
|
+
onStop: () => void;
|
|
182
|
+
onExpand: () => void;
|
|
183
|
+
}
|
|
184
|
+
declare function useAIGenNodeHeader({ modelDisplayName, isProcessing, canGenerate, hasOutput, onModelBrowse, onGenerate, onStop, onExpand, }: UseAIGenNodeHeaderOptions): {
|
|
185
|
+
titleElement: ReactNode;
|
|
186
|
+
headerActions: ReactNode;
|
|
187
|
+
};
|
|
188
|
+
|
|
189
|
+
interface UsePromptAutocompleteOptions {
|
|
190
|
+
availableVariables: AvailableVariable[];
|
|
191
|
+
textareaRef: RefObject<HTMLTextAreaElement | null>;
|
|
192
|
+
localTemplate: string;
|
|
193
|
+
setLocalTemplate: (value: string) => void;
|
|
194
|
+
onTemplateCommit?: (newTemplate: string) => void;
|
|
195
|
+
}
|
|
196
|
+
interface UsePromptAutocompleteReturn {
|
|
197
|
+
showAutocomplete: boolean;
|
|
198
|
+
autocompletePosition: {
|
|
199
|
+
top: number;
|
|
200
|
+
left: number;
|
|
201
|
+
};
|
|
202
|
+
filteredAutocompleteVars: AvailableVariable[];
|
|
203
|
+
selectedAutocompleteIndex: number;
|
|
204
|
+
handleChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
|
|
205
|
+
handleKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
|
|
206
|
+
handleAutocompleteSelect: (varName: string) => void;
|
|
207
|
+
closeAutocomplete: () => void;
|
|
208
|
+
}
|
|
209
|
+
declare function usePromptAutocomplete({ availableVariables, textareaRef, localTemplate, setLocalTemplate, onTemplateCommit, }: UsePromptAutocompleteOptions): UsePromptAutocompleteReturn;
|
|
210
|
+
|
|
211
|
+
interface UseMediaUploadOptions<T extends WorkflowNodeData> {
|
|
212
|
+
nodeId: string;
|
|
213
|
+
mediaType: 'image' | 'video';
|
|
214
|
+
initialUrl?: string;
|
|
215
|
+
getMetadata: (src: string) => Promise<Record<string, unknown>>;
|
|
216
|
+
buildUploadUpdate: (url: string, filename: string, metadata: Record<string, unknown>) => Partial<T>;
|
|
217
|
+
buildUrlUpdate: (url: string, metadata: Record<string, unknown> | null) => Partial<T>;
|
|
218
|
+
buildRemoveUpdate: () => Partial<T>;
|
|
219
|
+
}
|
|
220
|
+
declare function useMediaUpload<T extends WorkflowNodeData>({ nodeId, mediaType, initialUrl, getMetadata, buildUploadUpdate, buildUrlUpdate, buildRemoveUpdate, }: UseMediaUploadOptions<T>): {
|
|
221
|
+
fileInputRef: react.RefObject<HTMLInputElement | null>;
|
|
222
|
+
showUrlInput: boolean;
|
|
223
|
+
setShowUrlInput: react.Dispatch<react.SetStateAction<boolean>>;
|
|
224
|
+
urlValue: string;
|
|
225
|
+
setUrlValue: react.Dispatch<react.SetStateAction<string>>;
|
|
226
|
+
isUploading: boolean;
|
|
227
|
+
handleFileSelect: (e: React.ChangeEvent<HTMLInputElement>) => Promise<void>;
|
|
228
|
+
handleRemove: () => void;
|
|
229
|
+
handleUrlSubmit: () => Promise<void>;
|
|
230
|
+
handleUrlKeyDown: (e: React.KeyboardEvent) => void;
|
|
231
|
+
};
|
|
232
|
+
|
|
233
|
+
interface UseAutoLoadModelSchemaOptions<TModel extends string> {
|
|
234
|
+
/** Current model type from node data */
|
|
235
|
+
currentModel: TModel | undefined;
|
|
236
|
+
/** Selected model with full schema (if already loaded) */
|
|
237
|
+
selectedModel: SelectedModel | undefined;
|
|
238
|
+
/** Map from internal model type to API model ID */
|
|
239
|
+
modelIdMap: Record<TModel, string>;
|
|
240
|
+
/** Callback when model is loaded from API */
|
|
241
|
+
onModelSelect: (model: ProviderModel) => void;
|
|
242
|
+
}
|
|
243
|
+
/**
|
|
244
|
+
* Hook that auto-loads model schema for a node when the selectedModel is not set
|
|
245
|
+
* but a model type is already selected.
|
|
246
|
+
*
|
|
247
|
+
* This handles the case where a node has a default model but hasn't loaded
|
|
248
|
+
* the full schema yet.
|
|
249
|
+
*
|
|
250
|
+
* Uses the WorkflowUIProvider's modelSchema service to fetch the schema.
|
|
251
|
+
* Falls back to no-op if the service is not configured.
|
|
252
|
+
*/
|
|
253
|
+
declare function useAutoLoadModelSchema<TModel extends string>({ currentModel, selectedModel, modelIdMap, onModelSelect, }: UseAutoLoadModelSchemaOptions<TModel>): void;
|
|
254
|
+
|
|
255
|
+
export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs };
|
package/dist/hooks.js
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
require('./chunk-FOMOOERN.js');
|
|
4
|
+
var chunkADWNF7V3_js = require('./chunk-ADWNF7V3.js');
|
|
5
|
+
var chunkHPQT36RR_js = require('./chunk-HPQT36RR.js');
|
|
6
|
+
require('./chunk-5HJFQVUR.js');
|
|
7
|
+
require('./chunk-EMUMKW5C.js');
|
|
8
|
+
require('./chunk-JLWKW3G5.js');
|
|
9
|
+
require('./chunk-EC2ZIWOK.js');
|
|
10
|
+
require('./chunk-NSDLGLAQ.js');
|
|
11
|
+
require('./chunk-RJ262NXS.js');
|
|
12
|
+
require('./chunk-RXNEDWK2.js');
|
|
13
|
+
require('./chunk-Z7PWFZG5.js');
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
Object.defineProperty(exports, "useCanvasKeyboardShortcuts", {
|
|
18
|
+
enumerable: true,
|
|
19
|
+
get: function () { return chunkADWNF7V3_js.useCanvasKeyboardShortcuts; }
|
|
20
|
+
});
|
|
21
|
+
Object.defineProperty(exports, "useAIGenNode", {
|
|
22
|
+
enumerable: true,
|
|
23
|
+
get: function () { return chunkHPQT36RR_js.useAIGenNode; }
|
|
24
|
+
});
|
|
25
|
+
Object.defineProperty(exports, "useAIGenNodeHeader", {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function () { return chunkHPQT36RR_js.useAIGenNodeHeader; }
|
|
28
|
+
});
|
|
29
|
+
Object.defineProperty(exports, "useAutoLoadModelSchema", {
|
|
30
|
+
enumerable: true,
|
|
31
|
+
get: function () { return chunkHPQT36RR_js.useAutoLoadModelSchema; }
|
|
32
|
+
});
|
|
33
|
+
Object.defineProperty(exports, "useCanGenerate", {
|
|
34
|
+
enumerable: true,
|
|
35
|
+
get: function () { return chunkHPQT36RR_js.useCanGenerate; }
|
|
36
|
+
});
|
|
37
|
+
Object.defineProperty(exports, "useMediaUpload", {
|
|
38
|
+
enumerable: true,
|
|
39
|
+
get: function () { return chunkHPQT36RR_js.useMediaUpload; }
|
|
40
|
+
});
|
|
41
|
+
Object.defineProperty(exports, "useModelSelection", {
|
|
42
|
+
enumerable: true,
|
|
43
|
+
get: function () { return chunkHPQT36RR_js.useModelSelection; }
|
|
44
|
+
});
|
|
45
|
+
Object.defineProperty(exports, "useNodeExecution", {
|
|
46
|
+
enumerable: true,
|
|
47
|
+
get: function () { return chunkHPQT36RR_js.useNodeExecution; }
|
|
48
|
+
});
|
|
49
|
+
Object.defineProperty(exports, "usePromptAutocomplete", {
|
|
50
|
+
enumerable: true,
|
|
51
|
+
get: function () { return chunkHPQT36RR_js.usePromptAutocomplete; }
|
|
52
|
+
});
|
|
53
|
+
Object.defineProperty(exports, "useRequiredInputs", {
|
|
54
|
+
enumerable: true,
|
|
55
|
+
get: function () { return chunkHPQT36RR_js.useRequiredInputs; }
|
|
56
|
+
});
|
package/dist/hooks.mjs
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import './chunk-L5TF4EHW.mjs';
|
|
2
|
+
export { useCanvasKeyboardShortcuts } from './chunk-UQQUWGHW.mjs';
|
|
3
|
+
export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './chunk-FT64PCUP.mjs';
|
|
4
|
+
import './chunk-7SKSRSS7.mjs';
|
|
5
|
+
import './chunk-EFXQT23N.mjs';
|
|
6
|
+
import './chunk-LDN7IX4Y.mjs';
|
|
7
|
+
import './chunk-CSUBLSKZ.mjs';
|
|
8
|
+
import './chunk-BJ3R5R32.mjs';
|
|
9
|
+
import './chunk-FT33LFII.mjs';
|
|
10
|
+
import './chunk-VRN3UWE5.mjs';
|
|
11
|
+
import './chunk-AC6TWLRT.mjs';
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export { GroupOverlay, HelperLines, NodeSearch, PauseEdge, ShortcutHelpModal, WorkflowCanvas } from './canvas.mjs';
|
|
2
|
+
export { BaseNode, nodeTypes } from './nodes.mjs';
|
|
3
|
+
export { DebugPanel, NodePalette, PanelContainer } from './panels.mjs';
|
|
4
|
+
export { BottomBar, DropdownItem, OverflowMenu, OverflowMenuProps, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown, ToolbarDropdownProps } from './toolbar.mjs';
|
|
5
|
+
export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './hooks.mjs';
|
|
6
|
+
export { g as configurePromptLibrary, e as useAnnotationStore, b as useExecutionStore, d as usePromptEditorStore, f as usePromptLibraryStore, c as useSettingsStore, u as useUIStore, a as useWorkflowStore } from './promptLibraryStore-zqb59nsu.mjs';
|
|
7
|
+
import { GroupColor } from '@genfeedai/types';
|
|
8
|
+
export { GroupColor, NodeGroup } from '@genfeedai/types';
|
|
9
|
+
export { WorkflowUIProvider, useWorkflowUIConfig } from './provider.mjs';
|
|
10
|
+
export { M as ModelBrowserModalProps, P as PromptLibraryService, a as PromptPickerProps, W as WorkflowUIConfig } from './types-ipAnBzAJ.mjs';
|
|
11
|
+
import 'react/jsx-runtime';
|
|
12
|
+
import '@xyflow/react';
|
|
13
|
+
import 'react';
|
|
14
|
+
import 'zustand';
|
|
15
|
+
import 'zundo';
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Node Group UI Constants
|
|
19
|
+
* Re-exports types from shared package, defines Tailwind-specific styling
|
|
20
|
+
*/
|
|
21
|
+
|
|
22
|
+
declare const GROUP_COLORS: Record<GroupColor, {
|
|
23
|
+
bg: string;
|
|
24
|
+
border: string;
|
|
25
|
+
text: string;
|
|
26
|
+
}>;
|
|
27
|
+
declare const DEFAULT_GROUP_COLORS: GroupColor[];
|
|
28
|
+
|
|
29
|
+
export { DEFAULT_GROUP_COLORS, GROUP_COLORS };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export { GroupOverlay, HelperLines, NodeSearch, PauseEdge, ShortcutHelpModal, WorkflowCanvas } from './canvas.js';
|
|
2
|
+
export { BaseNode, nodeTypes } from './nodes.js';
|
|
3
|
+
export { DebugPanel, NodePalette, PanelContainer } from './panels.js';
|
|
4
|
+
export { BottomBar, DropdownItem, OverflowMenu, OverflowMenuProps, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown, ToolbarDropdownProps } from './toolbar.js';
|
|
5
|
+
export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './hooks.js';
|
|
6
|
+
export { g as configurePromptLibrary, e as useAnnotationStore, b as useExecutionStore, d as usePromptEditorStore, f as usePromptLibraryStore, c as useSettingsStore, u as useUIStore, a as useWorkflowStore } from './promptLibraryStore-BZnfmEkc.js';
|
|
7
|
+
import { GroupColor } from '@genfeedai/types';
|
|
8
|
+
export { GroupColor, NodeGroup } from '@genfeedai/types';
|
|
9
|
+
export { WorkflowUIProvider, useWorkflowUIConfig } from './provider.js';
|
|
10
|
+
export { M as ModelBrowserModalProps, P as PromptLibraryService, a as PromptPickerProps, W as WorkflowUIConfig } from './types-ipAnBzAJ.js';
|
|
11
|
+
import 'react/jsx-runtime';
|
|
12
|
+
import '@xyflow/react';
|
|
13
|
+
import 'react';
|
|
14
|
+
import 'zustand';
|
|
15
|
+
import 'zundo';
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Node Group UI Constants
|
|
19
|
+
* Re-exports types from shared package, defines Tailwind-specific styling
|
|
20
|
+
*/
|
|
21
|
+
|
|
22
|
+
declare const GROUP_COLORS: Record<GroupColor, {
|
|
23
|
+
bg: string;
|
|
24
|
+
border: string;
|
|
25
|
+
text: string;
|
|
26
|
+
}>;
|
|
27
|
+
declare const DEFAULT_GROUP_COLORS: GroupColor[];
|
|
28
|
+
|
|
29
|
+
export { DEFAULT_GROUP_COLORS, GROUP_COLORS };
|