@genfeedai/workflow-ui 0.1.2 → 0.1.4

package/dist/contextMenuStore-DMg0hJQ1.d.mts

@@ -0,0 +1,22 @@
+import * as zustand from 'zustand';
+
+type ContextMenuType = 'node' | 'edge' | 'pane' | 'selection' | null;
+interface ContextMenuPosition {
+    x: number;
+    y: number;
+}
+interface ContextMenuState {
+    isOpen: boolean;
+    position: ContextMenuPosition;
+    menuType: ContextMenuType;
+    targetId: string | null;
+    targetIds: string[] | null;
+    openNodeMenu: (nodeId: string, x: number, y: number) => void;
+    openEdgeMenu: (edgeId: string, x: number, y: number) => void;
+    openPaneMenu: (x: number, y: number) => void;
+    openSelectionMenu: (nodeIds: string[], x: number, y: number) => void;
+    close: () => void;
+}
+declare const useContextMenuStore: zustand.UseBoundStore<zustand.StoreApi<ContextMenuState>>;
+
+export { type ContextMenuType as C, type ContextMenuPosition as a, useContextMenuStore as u };

package/dist/hooks.d.mts

@@ -1,255 +1,64 @@
-import { NodeGroup, WorkflowNode, NodeType, WorkflowNodeData, ProviderModel, SelectedModel, AvailableVariable } from '@genfeedai/types';
-import { FitViewOptions } from '@xyflow/react';
-import * as react from 'react';
-import { ReactNode, RefObject } from 'react';
+export { C as CommentNavigation, e as useAIGenNode, f as useAIGenNodeHeader, i as useAutoLoadModelSchema, b as useCanGenerate, u as useCanvasKeyboardShortcuts, j as useCommentNavigation, h as useMediaUpload, d as useModelSelection, c as useNodeExecution, g as usePromptAutocomplete, a as useRequiredInputs } from './useCommentNavigation-NzJjkaj2.mjs';
+import { WorkflowNode, WorkflowEdge } from '@genfeedai/types';
+import { a as ContextMenuPosition, C as ContextMenuType } from './contextMenuStore-DMg0hJQ1.mjs';
+import '@xyflow/react';
+import 'react';
+import 'zustand';
 
-interface UseCanvasKeyboardShortcutsParams {
-    selectedNodeIds: string[];
-    groups: NodeGroup[];
+interface ClipboardData {
     nodes: WorkflowNode[];
-    toggleNodeLock: (nodeId: string) => void;
-    createGroup: (nodeIds: string[]) => string;
-    deleteGroup: (groupId: string) => void;
-    unlockAllNodes: () => void;
-    addNode: (type: NodeType, position: {
-        x: number;
-        y: number;
-    }) => string;
-    togglePalette: () => void;
-    fitView: (options?: FitViewOptions) => void;
-    openShortcutHelp: () => void;
-    openNodeSearch: () => void;
+    edges: WorkflowEdge[];
+    isCut: boolean;
 }
-/**
- * Hook that handles keyboard shortcuts for the workflow canvas
- *
- * Shortcuts:
- * - M: Toggle sidebar/palette
- * - L: Toggle lock on selected nodes
- * - F: Fit view to selection (or all if none selected)
- * - ?: Show shortcut help modal
- * - Ctrl/Cmd+F: Open node search
- * - Ctrl/Cmd+G: Create group from selection
- * - Ctrl/Cmd+Shift+G: Ungroup selected nodes
- * - Ctrl/Cmd+Shift+L: Unlock all nodes
- * - Shift+I: Add image generator node
- * - Shift+V: Add video generator node
- * - Shift+P: Add prompt node
- * - Shift+L: Add LLM node
- * - Ctrl/Cmd+Z: Undo
- * - Ctrl/Cmd+Shift+Z: Redo
- */
-declare function useCanvasKeyboardShortcuts({ selectedNodeIds, groups, nodes, toggleNodeLock, createGroup, deleteGroup, unlockAllNodes, addNode, togglePalette, fitView, openShortcutHelp, openNodeSearch, }: UseCanvasKeyboardShortcutsParams): void;
-
-interface RequiredInputsResult {
-    /** Whether all required inputs have connections */
-    hasRequiredInputs: boolean;
-    /** List of missing required input handle IDs */
-    missingInputs: string[];
-    /** Map of handle ID to whether it's connected */
-    connectionStatus: Map<string, boolean>;
-}
-/**
- * Hook that checks if all required inputs for a node are connected.
- * Uses edge connections, not actual data values.
- *
- * @param nodeId - The node ID to check
- * @param nodeType - The node type (to look up required inputs from NODE_DEFINITIONS)
- * @returns Object with hasRequiredInputs boolean and details about missing inputs
- */
-declare function useRequiredInputs(nodeId: string, nodeType: NodeType): RequiredInputsResult;
-
-interface MissingItem {
-    type: 'connection' | 'data' | 'schema';
-    field: string;
-    message: string;
-}
-interface CanGenerateResult {
-    /** Whether all validation passes and generation can proceed */
-    canGenerate: boolean;
-    /** List of missing items with details */
-    missingItems: MissingItem[];
-    /** Whether all required connections exist */
-    hasRequiredConnections: boolean;
-    /** Whether all connected nodes have actual data */
-    hasConnectedData: boolean;
-    /** Whether all required schema fields are filled */
-    hasRequiredSchemaFields: boolean;
-}
-interface UseCanGenerateOptions {
-    /** The node ID to validate */
-    nodeId: string;
-    /** The node type (to look up required inputs from NODE_DEFINITIONS) */
-    nodeType: NodeType;
-    /** The model's input schema with required array */
-    inputSchema?: Record<string, unknown>;
-    /** Current schema parameter values */
-    schemaParams?: Record<string, unknown>;
-}
-/**
- * Hook that performs comprehensive validation for the Generate button.
- *
- * Validates:
- * 1. Required connections exist (from NODE_DEFINITIONS)
- * 2. Connected nodes have actual data values (not just edges)
- * 3. Required schema fields from model inputSchema are filled
- *
- * @returns Object with canGenerate boolean and detailed breakdown
- */
-declare function useCanGenerate({ nodeId, nodeType, inputSchema, schemaParams, }: UseCanGenerateOptions): CanGenerateResult;
-
-/**
- * Hook for triggering and stopping node execution
- *
- * Encapsulates the common pattern of:
- * 1. Setting node status to processing
- * 2. Triggering execution
- * 3. Stopping execution and resetting status
- *
- * @param nodeId - The ID of the node to execute
- * @returns handleGenerate - Callback to trigger node execution
- * @returns handleStop - Callback to stop node execution
- */
-declare function useNodeExecution(nodeId: string): {
-    handleGenerate: () => void;
-    handleStop: () => void;
-};
-
-type ModelMap = Record<string, string>;
-interface UseModelSelectionOptions<TModel extends string> {
-    /** Node ID to update */
-    nodeId: string;
-    /** Map of provider model IDs to internal model types */
-    modelMap: ModelMap;
-    /** Fallback internal model if not found in map */
-    fallbackModel: TModel;
-}
-/**
- * Hook for handling model selection in AI generator nodes.
- * Consolidates the common pattern from ImageGenNode and VideoGenNode.
- *
- * @returns handleModelSelect callback to pass to ModelBrowserModal
- */
-declare function useModelSelection<TModel extends string, TNodeData extends WorkflowNodeData & {
-    model?: TModel;
-}>({ nodeId, modelMap, fallbackModel }: UseModelSelectionOptions<TModel>): {
-    handleModelSelect: (model: ProviderModel) => void;
+declare function useNodeActions(): {
+    clipboard: ClipboardData | null;
+    deleteNode: (nodeId: string) => void;
+    duplicate: (nodeId: string) => string | null;
+    copyNode: (nodeId: string) => void;
+    copyMultipleNodes: (nodeIds: string[]) => void;
+    cutNode: (nodeId: string) => void;
+    cutMultipleNodes: (nodeIds: string[]) => void;
+    deleteMultipleNodes: (nodeIds: string[]) => void;
+    duplicateMultipleNodes: (nodeIds: string[]) => string[];
+    pasteNodes: (offsetX: number, offsetY: number) => {
+        nodeIds: string[];
+        edgeIds: string[];
+    } | null;
+    getPasteData: (offsetX: number, offsetY: number) => {
+        nodes: WorkflowNode[];
+        edges: WorkflowEdge[];
+    } | null;
 };
 
-/**
- * JSON Schema property definition
- * These come from Replicate model schemas
- */
-interface SchemaProperty {
-    type?: string;
-    title?: string;
-    description?: string;
-    default?: unknown;
-    minimum?: number;
-    maximum?: number;
-    'x-order'?: number;
-    allOf?: Array<{
-        $ref: string;
-    }>;
-    enum?: string[];
-    nullable?: boolean;
-}
-
-interface UseAIGenNodeOptions {
-    nodeId: string;
-    selectedModel: SelectedModel | undefined;
-    schemaParams: Record<string, unknown> | undefined;
-}
-declare function useAIGenNode<TNodeData extends WorkflowNodeData>({ nodeId, selectedModel, schemaParams, }: UseAIGenNodeOptions): {
-    schemaProperties: Record<string, SchemaProperty> | undefined;
-    enumValues: Record<string, string[]> | undefined;
-    modelSupportsImageInput: boolean;
-    handleSchemaParamChange: (key: string, value: unknown) => void;
-    componentSchemas: Record<string, {
-        enum?: unknown[];
-        type?: string;
-    }> | undefined;
-};
-
-interface UseAIGenNodeHeaderOptions {
-    modelDisplayName: string;
-    isProcessing: boolean;
-    canGenerate: boolean;
-    hasOutput: boolean;
-    onModelBrowse: () => void;
-    onGenerate: () => void;
-    onStop: () => void;
-    onExpand: () => void;
-}
-declare function useAIGenNodeHeader({ modelDisplayName, isProcessing, canGenerate, hasOutput, onModelBrowse, onGenerate, onStop, onExpand, }: UseAIGenNodeHeaderOptions): {
-    titleElement: ReactNode;
-    headerActions: ReactNode;
+declare function usePaneActions(): {
+    addNodeAtPosition: (type: string, screenX: number, screenY: number) => void;
+    selectAll: () => void;
+    fitView: () => void;
+    autoLayout: (direction?: "TB" | "LR") => void;
 };
 
-interface UsePromptAutocompleteOptions {
-    availableVariables: AvailableVariable[];
-    textareaRef: RefObject<HTMLTextAreaElement | null>;
-    localTemplate: string;
-    setLocalTemplate: (value: string) => void;
-    onTemplateCommit?: (newTemplate: string) => void;
-}
-interface UsePromptAutocompleteReturn {
-    showAutocomplete: boolean;
-    autocompletePosition: {
-        top: number;
-        left: number;
-    };
-    filteredAutocompleteVars: AvailableVariable[];
-    selectedAutocompleteIndex: number;
-    handleChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
-    handleKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
-    handleAutocompleteSelect: (varName: string) => void;
-    closeAutocomplete: () => void;
+interface ContextMenuItemConfig {
+    id: string;
+    label?: string;
+    icon?: React.ReactNode;
+    shortcut?: string;
+    disabled?: boolean;
+    danger?: boolean;
+    separator?: boolean;
+    submenu?: ContextMenuItemConfig[];
+    onClick?: () => void;
 }
-declare function usePromptAutocomplete({ availableVariables, textareaRef, localTemplate, setLocalTemplate, onTemplateCommit, }: UsePromptAutocompleteOptions): UsePromptAutocompleteReturn;
 
-interface UseMediaUploadOptions<T extends WorkflowNodeData> {
-    nodeId: string;
-    mediaType: 'image' | 'video';
-    initialUrl?: string;
-    getMetadata: (src: string) => Promise<Record<string, unknown>>;
-    buildUploadUpdate: (url: string, filename: string, metadata: Record<string, unknown>) => Partial<T>;
-    buildUrlUpdate: (url: string, metadata: Record<string, unknown> | null) => Partial<T>;
-    buildRemoveUpdate: () => Partial<T>;
-}
-declare function useMediaUpload<T extends WorkflowNodeData>({ nodeId, mediaType, initialUrl, getMetadata, buildUploadUpdate, buildUrlUpdate, buildRemoveUpdate, }: UseMediaUploadOptions<T>): {
-    fileInputRef: react.RefObject<HTMLInputElement | null>;
-    showUrlInput: boolean;
-    setShowUrlInput: react.Dispatch<react.SetStateAction<boolean>>;
-    urlValue: string;
-    setUrlValue: react.Dispatch<react.SetStateAction<string>>;
-    isUploading: boolean;
-    handleFileSelect: (e: React.ChangeEvent<HTMLInputElement>) => Promise<void>;
-    handleRemove: () => void;
-    handleUrlSubmit: () => Promise<void>;
-    handleUrlKeyDown: (e: React.KeyboardEvent) => void;
+declare function useContextMenu(): {
+    isOpen: boolean;
+    position: ContextMenuPosition;
+    menuType: ContextMenuType;
+    menuItems: ContextMenuItemConfig[];
+    openNodeMenu: (nodeId: string, x: number, y: number) => void;
+    openEdgeMenu: (edgeId: string, x: number, y: number) => void;
+    openPaneMenu: (x: number, y: number) => void;
+    openSelectionMenu: (nodeIds: string[], x: number, y: number) => void;
+    close: () => void;
 };
 
-interface UseAutoLoadModelSchemaOptions<TModel extends string> {
-    /** Current model type from node data */
-    currentModel: TModel | undefined;
-    /** Selected model with full schema (if already loaded) */
-    selectedModel: SelectedModel | undefined;
-    /** Map from internal model type to API model ID */
-    modelIdMap: Record<TModel, string>;
-    /** Callback when model is loaded from API */
-    onModelSelect: (model: ProviderModel) => void;
-}
-/**
- * Hook that auto-loads model schema for a node when the selectedModel is not set
- * but a model type is already selected.
- *
- * This handles the case where a node has a default model but hasn't loaded
- * the full schema yet.
- *
- * Uses the WorkflowUIProvider's modelSchema service to fetch the schema.
- * Falls back to no-op if the service is not configured.
- */
-declare function useAutoLoadModelSchema<TModel extends string>({ currentModel, selectedModel, modelIdMap, onModelSelect, }: UseAutoLoadModelSchemaOptions<TModel>): void;
-
-export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs };
+export { useContextMenu, useNodeActions, usePaneActions };

package/dist/hooks.mjs

@@ -1,11 +1,11 @@
-import './chunk-L5TF4EHW.mjs';
-export { useCanvasKeyboardShortcuts } from './chunk-IASLG6IA.mjs';
-export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './chunk-AOTUCJMA.mjs';
+export { useCommentNavigation } from './chunk-7H3WJJYS.mjs';
+export { useCanvasKeyboardShortcuts, useContextMenu, useNodeActions, usePaneActions } from './chunk-ZD2BADZO.mjs';
+export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './chunk-GWBGK3KL.mjs';
 import './chunk-7SKSRSS7.mjs';
 import './chunk-EFXQT23N.mjs';
+import './chunk-PCIWWD37.mjs';
 import './chunk-LDN7IX4Y.mjs';
-import './chunk-SQK4JDYY.mjs';
-import './chunk-RIGVIEYB.mjs';
+import './chunk-LT3ZJJL6.mjs';
+import './chunk-R727OFBR.mjs';
 import './chunk-FT33LFII.mjs';
 import './chunk-VRN3UWE5.mjs';
-import './chunk-ZJWP5KGZ.mjs';

package/dist/index.d.mts

@@ -1,14 +1,14 @@
-export { GroupOverlay, HelperLines, NodeSearch, PauseEdge, ShortcutHelpModal, WorkflowCanvas } from './canvas.mjs';
+export { ConnectionDropMenu, EdgeToolbar, EditableEdge, GroupOverlay, HelperLines, NodeSearch, PauseEdge, ReferenceEdge, ShortcutHelpModal, WorkflowCanvas } from './canvas.mjs';
 export { BaseNode, nodeTypes } from './nodes.mjs';
 export { DebugPanel, NodePalette, PanelContainer } from './panels.mjs';
-export { BottomBar, DropdownItem, OverflowMenu, OverflowMenuProps, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown, ToolbarDropdownProps } from './toolbar.mjs';
-export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useCanvasKeyboardShortcuts, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './hooks.mjs';
-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';
+export { BottomBar, CostIndicator, DropdownItem, OverflowMenu, OverflowMenuProps, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown, ToolbarDropdownProps } from './toolbar.mjs';
+export { C as CommentNavigation, e as useAIGenNode, f as useAIGenNodeHeader, i as useAutoLoadModelSchema, b as useCanGenerate, u as useCanvasKeyboardShortcuts, j as useCommentNavigation, h as useMediaUpload, d as useModelSelection, c as useNodeExecution, g as usePromptAutocomplete, a as useRequiredInputs } from './useCommentNavigation-NzJjkaj2.mjs';
 import { GroupColor } from '@genfeedai/types';
 export { GroupColor, NodeGroup } from '@genfeedai/types';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+export { I as ImageHistoryItem, p as configurePromptLibrary, j as useAnnotationStore, b as useExecutionStore, i as usePromptEditorStore, o as usePromptLibraryStore, c as useSettingsStore, a as useUIStore, u as useWorkflowStore } from './promptLibraryStore-Bgw5LzvD.mjs';
 export { WorkflowUIProvider, useWorkflowUIConfig } from './provider.mjs';
-export { M as ModelBrowserModalProps, P as PromptLibraryService, a as PromptPickerProps, W as WorkflowUIConfig } from './types-ipAnBzAJ.mjs';
-import 'react/jsx-runtime';
+export { M as ModelBrowserModalProps, P as PromptLibraryService, a as PromptPickerProps, W as WorkflowUIConfig } from './types-CF6DPx0P.mjs';
 import '@xyflow/react';
 import 'react';
 import 'zustand';
@@ -26,4 +26,8 @@ declare const GROUP_COLORS: Record<GroupColor, {
 }>;
 declare const DEFAULT_GROUP_COLORS: GroupColor[];
 
-export { DEFAULT_GROUP_COLORS, GROUP_COLORS };
+declare function NotificationToast(): react_jsx_runtime.JSX.Element | null;
+
+declare function GlobalImageHistory(): react_jsx_runtime.JSX.Element | null;
+
+export { DEFAULT_GROUP_COLORS, GROUP_COLORS, GlobalImageHistory, NotificationToast };

package/dist/index.mjs

@@ -1,19 +1,21 @@
-export { DEFAULT_GROUP_COLORS, GROUP_COLORS, GroupOverlay, HelperLines, NodeSearch, PauseEdge, ShortcutHelpModal, WorkflowCanvas } from './chunk-7P2JWDC7.mjs';
-export { BaseNode, nodeTypes } from './chunk-E3YBVMYZ.mjs';
+export { ConnectionDropMenu, DEFAULT_GROUP_COLORS, EdgeToolbar, EditableEdge, GROUP_COLORS, GlobalImageHistory, GroupOverlay, HelperLines, NodeSearch, NotificationToast, PauseEdge, ReferenceEdge, ShortcutHelpModal, WorkflowCanvas } from './chunk-O5II6BOJ.mjs';
+export { BaseNode, nodeTypes } from './chunk-PANZDSP6.mjs';
 import './chunk-ZJD5WMR3.mjs';
-import './chunk-E323WAZG.mjs';
-export { DebugPanel, NodePalette, PanelContainer } from './chunk-AUZR6REQ.mjs';
-export { BottomBar, OverflowMenu, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown } from './chunk-HCXI63ME.mjs';
-import './chunk-L5TF4EHW.mjs';
-export { useCanvasKeyboardShortcuts } from './chunk-IASLG6IA.mjs';
-export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './chunk-AOTUCJMA.mjs';
+import './chunk-6PSJTBNV.mjs';
+export { DebugPanel, NodePalette, PanelContainer } from './chunk-OQREHJXK.mjs';
+export { BottomBar, CostIndicator, OverflowMenu, SaveAsDialog, SaveIndicator, Toolbar, ToolbarDropdown } from './chunk-AUQGOJOQ.mjs';
+import './chunk-JTPADIUO.mjs';
+import './chunk-OY7BRSGG.mjs';
+export { useCommentNavigation } from './chunk-7H3WJJYS.mjs';
+export { useCanvasKeyboardShortcuts } from './chunk-ZD2BADZO.mjs';
+export { useAIGenNode, useAIGenNodeHeader, useAutoLoadModelSchema, useCanGenerate, useMediaUpload, useModelSelection, useNodeExecution, usePromptAutocomplete, useRequiredInputs } from './chunk-GWBGK3KL.mjs';
 import './chunk-7SKSRSS7.mjs';
 import './chunk-EFXQT23N.mjs';
 export { useAnnotationStore, usePromptEditorStore } from './chunk-CV4M7CNU.mjs';
+import './chunk-PCIWWD37.mjs';
 import './chunk-LDN7IX4Y.mjs';
-export { useExecutionStore, useSettingsStore, useUIStore } from './chunk-SQK4JDYY.mjs';
-export { useWorkflowStore } from './chunk-RIGVIEYB.mjs';
+export { useExecutionStore, useSettingsStore, useUIStore } from './chunk-LT3ZJJL6.mjs';
+export { useWorkflowStore } from './chunk-R727OFBR.mjs';
 import './chunk-MLJJBBTB.mjs';
 export { WorkflowUIProvider, useWorkflowUIConfig } from './chunk-FT33LFII.mjs';
 export { configurePromptLibrary, usePromptLibraryStore } from './chunk-VRN3UWE5.mjs';
-import './chunk-ZJWP5KGZ.mjs';