react-flow-workflow/dist/types/index.d.ts

A powerful React hook for building interactive workflow diagrams with React Flow

import { Node, Edge, NodeTypes, EdgeTypes, NodeChange, EdgeChange, Connection, ReactFlowInstance } from 'reactflow';
export interface LayoutConfig {
    rankdir?: 'TB' | 'LR';
    nodeWidth?: number;
    nodeHeight?: number;
    spacing?: {
        horizontal?: number;
        vertical?: number;
    };
}
export type { Node, Edge, NodeTypes, EdgeTypes, } from 'reactflow';
export type WorkflowNode<TData = any> = Node<TData> & {
    id: string;
    position: {
        x: number;
        y: number;
    };
    data?: TData;
};
export type WorkflowEdge<TData = any> = Edge<TData> & {
    id: string;
    source: string;
    target: string;
    data?: TData;
};
export interface UseWorkflowBuilderProps<TNodeData = any, TEdgeData = any> {
    nodeWidth?: number;
    nodeHeight?: number;
    direction?: 'TB' | 'LR';
    initialNodes?: WorkflowNode<TNodeData>[];
    initialEdges?: WorkflowEdge<TEdgeData>[];
    useReactFlowInstance?: boolean;
    spacing?: {
        horizontal?: number;
        vertical?: number;
    };
    nodeTypes?: NodeTypes;
    edgeTypes?: EdgeTypes;
    autoCenter?: boolean;
    animate?: boolean;
    animationDuration?: number;
}
export interface WorkflowBuilderReturn<TNodeData = any, TEdgeData = any> {
    nodes: WorkflowNode<TNodeData>[];
    edges: WorkflowEdge<TEdgeData>[];
    onNodesChange: (changes: NodeChange[]) => void;
    onEdgesChange: (changes: EdgeChange[]) => void;
    onConnect: (connection: Connection) => void;
    createNode: (nodeData: Partial<WorkflowNode<TNodeData>>) => WorkflowNode<TNodeData>;
    createNodeAtPosition: (nodeData: Partial<WorkflowNode<TNodeData>>, relativeTo?: string, offset?: {
        x: number;
        y: number;
    }) => WorkflowNode<TNodeData>;
    createNodeInWorkflow: (nodeData: Partial<WorkflowNode<TNodeData>>, afterNodeId?: string) => WorkflowNode<TNodeData>;
    createNodeWithVerticalHandlers: (nodeData: Partial<WorkflowNode<TNodeData>>, handlerPosition?: 'top' | 'bottom') => WorkflowNode<TNodeData>;
    updateNodeById: (nodeId: string, updates: Partial<WorkflowNode<TNodeData>>) => void;
    deleteNode: (nodeId: string) => void;
    getNodeById: (nodeId: string) => WorkflowNode<TNodeData> | undefined;
    createEdge: (edgeData: Partial<WorkflowEdge<TEdgeData>>) => WorkflowEdge<TEdgeData> | null;
    getDefaultEdgeOptions: () => Record<string, any>;
    selectedNodeId: string | null;
    setSelectedNodeId: (id: string | null) => void;
    getOutgoingNodes: (nodeId: string) => WorkflowNode<TNodeData>[];
    getIncomingNodes: (nodeId: string) => WorkflowNode<TNodeData>[];
    getRootNodes: () => WorkflowNode<TNodeData>[];
    getLeafNodes: () => WorkflowNode<TNodeData>[];
    reactFlowInstance: ReactFlowInstance | null;
    fitView: () => boolean;
    resetCounters: () => void;
}
export interface BasicNodeData {
    label: string;
    description?: string;
    status?: 'pending' | 'running' | 'completed' | 'error';
    metadata?: Record<string, any>;
}
export interface BasicEdgeData {
    label?: string;
    condition?: string;
    weight?: number;
    metadata?: Record<string, any>;
}
export type BasicWorkflowNode = WorkflowNode<BasicNodeData>;
export type BasicWorkflowEdge = WorkflowEdge<BasicEdgeData>;
export type UseWorkflowBuilder = <TNodeData = any, TEdgeData = any>(props?: UseWorkflowBuilderProps<TNodeData, TEdgeData>) => WorkflowBuilderReturn<TNodeData, TEdgeData>;