@particle-academy/fancy-flow 0.18.0 → 0.20.0

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import * as react from 'react';
 import { ReactNode, CSSProperties, ComponentType } from 'react';
-import { ReactFlowProps, Edge, BackgroundVariant, NodeProps, NodeTypes } from '@xyflow/react';
+import { ReactFlowProps, Edge, BackgroundVariant, Connection, NodeProps, NodeTypes } from '@xyflow/react';
 import { ConnectionValidatorOptions } from './registry/index.cjs';
 export { ANY_PORT_TYPE, BUILTIN_KINDS, PortCompatibility, RegistryNode, RichInputAdapter, RichInputPreview, buildNodeTypes, categoryAccent, createConnectionValidator, defaultConfigFor, defaultPortCompatibility, getNodeKind, getRichInputAdapter, isRichInputEnabled, listNodeKinds, onNodeKindsChanged, onRichInputAdapterChanged, registerBuiltinKinds, registerNodeKind, registerRichInputAdapter, resolveNodePorts, resolvePortSpec, validateConfig } from './registry/index.cjs';
 import { b as FlowNode, F as FlowGraph, e as NodeRunStatus, E as ExecutorRegistry } from './types-sOmpCitB.cjs';
@@ -10,7 +10,7 @@ export { ImportIssue, ImportOptions, ImportResult, WORKFLOW_SCHEMA_URL, WORKFLOW
 import { N as NodeCategory, a as NodeKindDefinition, C as ConfigField } from './types-D_jOR3Z2.cjs';
 export { D as DocumentConfigField, K as KeyValueConfigField, P as PortSpec, R as RenderBodyContext, d as RepeaterConfigField, e as RepeaterRowField } from './types-D_jOR3Z2.cjs';
 import { FlowRunFeedEntry } from './runtime/index.cjs';
-export { UseFlowRunOptions, UseFlowRunReturn, UseFlowStateReturn, applyStatusesToNodes, useFlowRun, useFlowState } from './runtime/index.cjs';
+export { HistoryController, UseFlowHistoryReturn, UseFlowRunOptions, UseFlowRunReturn, UseFlowStateReturn, applyStatusesToNodes, createHistory, useFlowHistory, useFlowRun, useFlowState } from './runtime/index.cjs';
 export { R as RunOptions, a as RunResult, r as runFlow } from './run-flow-VKm57Hcj.cjs';
 export { L as LEGACY_PAUSE_PREFIXES, a as PAUSE_PREFIX, P as PauseAwaiting, b as PauseSignal, d as decodePause, e as encodePause, i as isPause, p as pauseForHuman } from './pause-9iT4tCEV.cjs';
 import './capabilities-ChE3Xi8R.cjs';
@@ -50,6 +50,33 @@ type FlowCanvasProps = Omit<ReactFlowProps<FlowNode, Edge>, "nodes" | "edges" |
  */
 declare function FlowCanvas({ nodes, edges, background, showControls, showMinimap, height, validateConnections, isValidConnection, toolbar, nodeTypes, edgeTypes, className, style, ...rest }: FlowCanvasProps): react.JSX.Element;
 
+/**
+ * Clone a set of nodes AND the edges internal to that set, remapping every id.
+ * This is the piece `duplicateNode` lacks: a copy/paste (or duplicate-selection)
+ * that preserves the wiring *between* the copied nodes. Edges with an endpoint
+ * outside the set are dropped (they'd dangle). A `parentId` pointing inside the
+ * set is remapped; one pointing outside is detached.
+ */
+declare function cloneSubgraph(nodes: FlowNode[], edges: Edge[], opts: {
+    makeId: () => string;
+    offset?: number;
+}): {
+    nodes: FlowNode[];
+    edges: Edge[];
+    idMap: Map<string, string>;
+};
+/**
+ * Rewire one edge's endpoint(s) — wraps xyflow's `reconnectEdge`. Keeps the
+ * edge's id (`shouldReplaceId: false`) so its label and identity survive the
+ * rewire instead of being regenerated from the new endpoints.
+ */
+declare function reconnectEdge(edges: Edge[], oldEdge: Edge, newConnection: Connection): Edge[];
+type AlignEdge = "left" | "hcenter" | "right" | "top" | "vcenter" | "bottom";
+/** Align a selection to a shared edge/center of its bounding box. */
+declare function alignNodes(nodes: FlowNode[], edge: AlignEdge): FlowNode[];
+/** Evenly distribute a selection's gaps along an axis (needs 3+ nodes). */
+declare function distributeNodes(nodes: FlowNode[], axis: "h" | "v"): FlowNode[];
+
 /**
  * Everything the editor knows and can do, handed to every extension point.
  *
@@ -71,6 +98,10 @@ type FlowEditorApi = {
     selectedEdgeId: string | null;
     /** Currently selected edge, or null. */
     selectedEdge: Edge | null;
+    /** All multi-selected node ids (xyflow box / shift selection). */
+    selectedIds: string[];
+    /** All multi-selected nodes. */
+    selectedNodes: FlowNode[];
     /** True while a run is in flight. */
     running: boolean;
     /** Per-node run status, keyed by node id. */
@@ -99,6 +130,21 @@ type FlowEditorApi = {
     duplicateNode: (id: string) => string | null;
     /** Replace the whole graph. */
     setGraph: (graph: FlowGraph) => void;
+    /** Duplicate the current multi-selection, preserving edges between them. */
+    duplicateSelected: () => void;
+    /** Align the multi-selection to a shared edge/center of its bounding box. */
+    alignSelected: (edge: AlignEdge) => void;
+    /** Evenly distribute the multi-selection's gaps along an axis (needs 3+). */
+    distributeSelected: (axis: "h" | "v") => void;
+    /** Copy the current selection to the editor clipboard. */
+    copy: () => void;
+    /** Copy then delete the current selection. */
+    cut: () => void;
+    /** Paste the clipboard (optionally at a flow position) and select the result. */
+    paste: (at?: {
+        x: number;
+        y: number;
+    }) => void;
     run: () => void;
     cancel: () => void;
     reset: () => void;
@@ -109,6 +155,16 @@ type FlowEditorApi = {
     /** Open a file picker and load a workflow. */
     importWorkflow: () => void;
     fitView: () => void;
+    /** Undo the last committing edit (add / delete / connect / config / drag /
+     *  import). Transient interactions (a drag in progress, selection) are not
+     *  their own steps. */
+    undo: () => void;
+    /** Redo the last undone edit. */
+    redo: () => void;
+    /** True when there is an edit to undo. */
+    canUndo: boolean;
+    /** True when there is an undone edit to redo. */
+    canRedo: boolean;
 };
 /**
  * A declarative toolbar button. JSON-friendly on purpose — a host (or an
@@ -134,6 +190,8 @@ type FlowEditorAction = {
 type FlowEditorBuiltins = {
     run?: boolean;
     delete?: boolean;
+    /** Undo/redo toolbar buttons. Default true. */
+    history?: boolean;
     /** Right-click a node for Delete / Duplicate. Default true. */
     contextMenu?: boolean;
     /** Right-click a connection for Label / Delete. Default true. */
@@ -208,6 +266,17 @@ type FlowEditorProps = {
     onDelete?: (ids: string[]) => void;
     /** Called after connections are broken, with the deleted edge ids. */
     onEdgeDelete?: (ids: string[]) => void;
+    /**
+     * Stage destructive edits for human confirmation. When set, every delete path
+     * — keyboard, panel, context menu, and `api.deleteNodes`/`deleteEdges` —
+     * calls this first; return false to veto. Default: delete immediately. This
+     * realizes the component contract's "agents propose, humans confirm" on the
+     * canvas.
+     */
+    confirmDelete?: (targets: {
+        nodes: FlowNode[];
+        edges: Edge[];
+    }) => boolean | Promise<boolean>;
     className?: string;
     style?: CSSProperties;
 };
@@ -453,4 +522,4 @@ type FlowRunFeedProps = {
 /** FlowRunFeed — scrolling log panel. Auto-scrolls to bottom on new entries. */
 declare function FlowRunFeed({ entries, className, style }: FlowRunFeedProps): react.JSX.Element;
 
-export { ActionNode, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, defaultNodeTypes, defineNode, paletteDropHandlers, useFlowEditor, useFlowEditorOptional };
+export { ActionNode, type AlignEdge, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, alignNodes, cloneSubgraph, defaultNodeTypes, defineNode, distributeNodes, paletteDropHandlers, reconnectEdge, useFlowEditor, useFlowEditorOptional };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react from 'react';
 import { ReactNode, CSSProperties, ComponentType } from 'react';
-import { ReactFlowProps, Edge, BackgroundVariant, NodeProps, NodeTypes } from '@xyflow/react';
+import { ReactFlowProps, Edge, BackgroundVariant, Connection, NodeProps, NodeTypes } from '@xyflow/react';
 import { ConnectionValidatorOptions } from './registry/index.js';
 export { ANY_PORT_TYPE, BUILTIN_KINDS, PortCompatibility, RegistryNode, RichInputAdapter, RichInputPreview, buildNodeTypes, categoryAccent, createConnectionValidator, defaultConfigFor, defaultPortCompatibility, getNodeKind, getRichInputAdapter, isRichInputEnabled, listNodeKinds, onNodeKindsChanged, onRichInputAdapterChanged, registerBuiltinKinds, registerNodeKind, registerRichInputAdapter, resolveNodePorts, resolvePortSpec, validateConfig } from './registry/index.js';
 import { b as FlowNode, F as FlowGraph, e as NodeRunStatus, E as ExecutorRegistry } from './types-sOmpCitB.js';
@@ -10,7 +10,7 @@ export { ImportIssue, ImportOptions, ImportResult, WORKFLOW_SCHEMA_URL, WORKFLOW
 import { N as NodeCategory, a as NodeKindDefinition, C as ConfigField } from './types-NerkPtHS.js';
 export { D as DocumentConfigField, K as KeyValueConfigField, P as PortSpec, R as RenderBodyContext, d as RepeaterConfigField, e as RepeaterRowField } from './types-NerkPtHS.js';
 import { FlowRunFeedEntry } from './runtime/index.js';
-export { UseFlowRunOptions, UseFlowRunReturn, UseFlowStateReturn, applyStatusesToNodes, useFlowRun, useFlowState } from './runtime/index.js';
+export { HistoryController, UseFlowHistoryReturn, UseFlowRunOptions, UseFlowRunReturn, UseFlowStateReturn, applyStatusesToNodes, createHistory, useFlowHistory, useFlowRun, useFlowState } from './runtime/index.js';
 export { R as RunOptions, a as RunResult, r as runFlow } from './run-flow-ChBi6q-W.js';
 export { L as LEGACY_PAUSE_PREFIXES, a as PAUSE_PREFIX, P as PauseAwaiting, b as PauseSignal, d as decodePause, e as encodePause, i as isPause, p as pauseForHuman } from './pause-9iT4tCEV.js';
 import './capabilities-DUhAc-EJ.js';
@@ -50,6 +50,33 @@ type FlowCanvasProps = Omit<ReactFlowProps<FlowNode, Edge>, "nodes" | "edges" |
  */
 declare function FlowCanvas({ nodes, edges, background, showControls, showMinimap, height, validateConnections, isValidConnection, toolbar, nodeTypes, edgeTypes, className, style, ...rest }: FlowCanvasProps): react.JSX.Element;
 
+/**
+ * Clone a set of nodes AND the edges internal to that set, remapping every id.
+ * This is the piece `duplicateNode` lacks: a copy/paste (or duplicate-selection)
+ * that preserves the wiring *between* the copied nodes. Edges with an endpoint
+ * outside the set are dropped (they'd dangle). A `parentId` pointing inside the
+ * set is remapped; one pointing outside is detached.
+ */
+declare function cloneSubgraph(nodes: FlowNode[], edges: Edge[], opts: {
+    makeId: () => string;
+    offset?: number;
+}): {
+    nodes: FlowNode[];
+    edges: Edge[];
+    idMap: Map<string, string>;
+};
+/**
+ * Rewire one edge's endpoint(s) — wraps xyflow's `reconnectEdge`. Keeps the
+ * edge's id (`shouldReplaceId: false`) so its label and identity survive the
+ * rewire instead of being regenerated from the new endpoints.
+ */
+declare function reconnectEdge(edges: Edge[], oldEdge: Edge, newConnection: Connection): Edge[];
+type AlignEdge = "left" | "hcenter" | "right" | "top" | "vcenter" | "bottom";
+/** Align a selection to a shared edge/center of its bounding box. */
+declare function alignNodes(nodes: FlowNode[], edge: AlignEdge): FlowNode[];
+/** Evenly distribute a selection's gaps along an axis (needs 3+ nodes). */
+declare function distributeNodes(nodes: FlowNode[], axis: "h" | "v"): FlowNode[];
+
 /**
  * Everything the editor knows and can do, handed to every extension point.
  *
@@ -71,6 +98,10 @@ type FlowEditorApi = {
     selectedEdgeId: string | null;
     /** Currently selected edge, or null. */
     selectedEdge: Edge | null;
+    /** All multi-selected node ids (xyflow box / shift selection). */
+    selectedIds: string[];
+    /** All multi-selected nodes. */
+    selectedNodes: FlowNode[];
     /** True while a run is in flight. */
     running: boolean;
     /** Per-node run status, keyed by node id. */
@@ -99,6 +130,21 @@ type FlowEditorApi = {
     duplicateNode: (id: string) => string | null;
     /** Replace the whole graph. */
     setGraph: (graph: FlowGraph) => void;
+    /** Duplicate the current multi-selection, preserving edges between them. */
+    duplicateSelected: () => void;
+    /** Align the multi-selection to a shared edge/center of its bounding box. */
+    alignSelected: (edge: AlignEdge) => void;
+    /** Evenly distribute the multi-selection's gaps along an axis (needs 3+). */
+    distributeSelected: (axis: "h" | "v") => void;
+    /** Copy the current selection to the editor clipboard. */
+    copy: () => void;
+    /** Copy then delete the current selection. */
+    cut: () => void;
+    /** Paste the clipboard (optionally at a flow position) and select the result. */
+    paste: (at?: {
+        x: number;
+        y: number;
+    }) => void;
     run: () => void;
     cancel: () => void;
     reset: () => void;
@@ -109,6 +155,16 @@ type FlowEditorApi = {
     /** Open a file picker and load a workflow. */
     importWorkflow: () => void;
     fitView: () => void;
+    /** Undo the last committing edit (add / delete / connect / config / drag /
+     *  import). Transient interactions (a drag in progress, selection) are not
+     *  their own steps. */
+    undo: () => void;
+    /** Redo the last undone edit. */
+    redo: () => void;
+    /** True when there is an edit to undo. */
+    canUndo: boolean;
+    /** True when there is an undone edit to redo. */
+    canRedo: boolean;
 };
 /**
  * A declarative toolbar button. JSON-friendly on purpose — a host (or an
@@ -134,6 +190,8 @@ type FlowEditorAction = {
 type FlowEditorBuiltins = {
     run?: boolean;
     delete?: boolean;
+    /** Undo/redo toolbar buttons. Default true. */
+    history?: boolean;
     /** Right-click a node for Delete / Duplicate. Default true. */
     contextMenu?: boolean;
     /** Right-click a connection for Label / Delete. Default true. */
@@ -208,6 +266,17 @@ type FlowEditorProps = {
     onDelete?: (ids: string[]) => void;
     /** Called after connections are broken, with the deleted edge ids. */
     onEdgeDelete?: (ids: string[]) => void;
+    /**
+     * Stage destructive edits for human confirmation. When set, every delete path
+     * — keyboard, panel, context menu, and `api.deleteNodes`/`deleteEdges` —
+     * calls this first; return false to veto. Default: delete immediately. This
+     * realizes the component contract's "agents propose, humans confirm" on the
+     * canvas.
+     */
+    confirmDelete?: (targets: {
+        nodes: FlowNode[];
+        edges: Edge[];
+    }) => boolean | Promise<boolean>;
     className?: string;
     style?: CSSProperties;
 };
@@ -453,4 +522,4 @@ type FlowRunFeedProps = {
 /** FlowRunFeed — scrolling log panel. Auto-scrolls to bottom on new entries. */
 declare function FlowRunFeed({ entries, className, style }: FlowRunFeedProps): react.JSX.Element;
 
-export { ActionNode, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, defaultNodeTypes, defineNode, paletteDropHandlers, useFlowEditor, useFlowEditorOptional };
+export { ActionNode, type AlignEdge, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, alignNodes, cloneSubgraph, defaultNodeTypes, defineNode, distributeNodes, paletteDropHandlers, reconnectEdge, useFlowEditor, useFlowEditorOptional };

package/dist/index.js

@@ -1,8 +1,8 @@
-import { useFlowState, useFlowRun, applyStatusesToNodes } from './chunk-MFMRTRPO.js';
-export { applyStatusesToNodes, useFlowRun, useFlowState } from './chunk-MFMRTRPO.js';
-import { buildNodeTypes, registerBuiltinKinds, createConnectionValidator } from './chunk-FSC64BPD.js';
-export { ANY_PORT_TYPE, BUILTIN_KINDS, RegistryNode, buildNodeTypes, createConnectionValidator, defaultPortCompatibility, registerBuiltinKinds } from './chunk-FSC64BPD.js';
-import { ReactFlowProvider, useReactFlow, addEdge, applyEdgeChanges, applyNodeChanges, Position, Handle, index, BackgroundVariant, Background, Controls, MiniMap } from './chunk-NF6NPY5N.js';
+import { useFlowState, useFlowRun, useFlowHistory, applyStatusesToNodes } from './chunk-KI4RI2N3.js';
+export { applyStatusesToNodes, createHistory, useFlowHistory, useFlowRun, useFlowState } from './chunk-KI4RI2N3.js';
+import { buildNodeTypes, registerBuiltinKinds, createConnectionValidator } from './chunk-AW2QUEL2.js';
+export { ANY_PORT_TYPE, BUILTIN_KINDS, RegistryNode, buildNodeTypes, createConnectionValidator, defaultPortCompatibility, registerBuiltinKinds } from './chunk-AW2QUEL2.js';
+import { ReactFlowProvider, useReactFlow, addEdge, applyEdgeChanges, applyNodeChanges, Position, Handle, reconnectEdge, index, BackgroundVariant, Background, Controls, MiniMap } from './chunk-XETAGLH6.js';
 export { LEGACY_PAUSE_PREFIXES, PAUSE_PREFIX, decodePause, encodePause, isPause, pauseForHuman } from './chunk-UEOE6B52.js';
 export { runFlow } from './chunk-L4AX73Q6.js';
 import { workflowToBlob, importWorkflow, exportWorkflow } from './chunk-D6W5FMCT.js';
@@ -13,7 +13,7 @@ export { categoryAccent, defaultConfigFor, getNodeKind, listNodeKinds, onNodeKin
 import { getRichInputAdapter } from './chunk-F5RPRB7A.js';
 export { RichInputPreview, getRichInputAdapter, isRichInputEnabled, onRichInputAdapterChanged, registerRichInputAdapter } from './chunk-F5RPRB7A.js';
 import './chunk-USL4FMFU.js';
-import { memo, createContext, forwardRef, useState, useEffect, useMemo, useCallback, useImperativeHandle, useRef, useContext } from 'react';
+import { memo, createContext, forwardRef, useState, useEffect, useMemo, useCallback, useRef, useImperativeHandle, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 function NodeShellInner({
@@ -839,6 +839,65 @@ function duplicateNode(node, id, offset = 40) {
     data: JSON.parse(JSON.stringify(node.data ?? {}))
   };
 }
+function cloneSubgraph(nodes, edges, opts) {
+  const offset = opts.offset ?? 40;
+  const idMap = /* @__PURE__ */ new Map();
+  for (const n of nodes) idMap.set(n.id, opts.makeId());
+  const clonedNodes = nodes.map((n) => {
+    const cloned = duplicateNode(n, idMap.get(n.id), offset);
+    const parentId = n.parentId;
+    if (parentId && idMap.has(parentId)) cloned.parentId = idMap.get(parentId);
+    else if (parentId) delete cloned.parentId;
+    return cloned;
+  });
+  const clonedEdges = edges.filter((e) => idMap.has(e.source) && idMap.has(e.target)).map((e) => ({ ...e, id: opts.makeId(), source: idMap.get(e.source), target: idMap.get(e.target) }));
+  return { nodes: clonedNodes, edges: clonedEdges, idMap };
+}
+function reconnectEdge2(edges, oldEdge, newConnection) {
+  return reconnectEdge(oldEdge, newConnection, edges, { shouldReplaceId: false });
+}
+var nodeW = (n) => n.width ?? n.measured?.width ?? 0;
+var nodeH = (n) => n.height ?? n.measured?.height ?? 0;
+function alignNodes(nodes, edge) {
+  if (nodes.length < 2) return nodes;
+  const minL = Math.min(...nodes.map((n) => n.position.x));
+  const maxR = Math.max(...nodes.map((n) => n.position.x + nodeW(n)));
+  const minT = Math.min(...nodes.map((n) => n.position.y));
+  const maxB = Math.max(...nodes.map((n) => n.position.y + nodeH(n)));
+  const cx = (minL + maxR) / 2;
+  const cy = (minT + maxB) / 2;
+  return nodes.map((n) => {
+    let { x, y } = n.position;
+    if (edge === "left") x = minL;
+    else if (edge === "right") x = maxR - nodeW(n);
+    else if (edge === "hcenter") x = cx - nodeW(n) / 2;
+    else if (edge === "top") y = minT;
+    else if (edge === "bottom") y = maxB - nodeH(n);
+    else if (edge === "vcenter") y = cy - nodeH(n) / 2;
+    return { ...n, position: { x, y } };
+  });
+}
+function distributeNodes(nodes, axis) {
+  if (nodes.length < 3) return nodes;
+  const size = (n) => axis === "h" ? nodeW(n) : nodeH(n);
+  const coord = (n) => axis === "h" ? n.position.x : n.position.y;
+  const sorted = [...nodes].sort((a, b) => coord(a) - coord(b));
+  const start = coord(sorted[0]);
+  const last = sorted[sorted.length - 1];
+  const end = coord(last) + size(last);
+  const totalSize = sorted.reduce((s, n) => s + size(n), 0);
+  const gap = (end - start - totalSize) / (sorted.length - 1);
+  const posById = /* @__PURE__ */ new Map();
+  let cursor = start;
+  for (const n of sorted) {
+    posById.set(n.id, cursor);
+    cursor += size(n) + gap;
+  }
+  return nodes.map((n) => {
+    const p = posById.get(n.id);
+    return { ...n, position: axis === "h" ? { ...n.position, x: p } : { ...n.position, y: p } };
+  });
+}
 var FlowEditorContext = createContext(null);
 var FlowEditorProvider = FlowEditorContext.Provider;
 function useFlowEditor() {
@@ -878,13 +937,16 @@ function FlowEditorInner({
   onSelectionChange,
   onDelete,
   onEdgeDelete,
+  confirmDelete,
   apiRef
 }) {
   const internal = useFlowState(initial);
   const runner = useFlowRun();
   const rf = useReactFlow();
   const controlled = value !== void 0;
-  const flow = controlled ? makeControlledFlowAdapter(value, onChange) : internal;
+  const baseFlow = controlled ? makeControlledFlowAdapter(value, onChange) : internal;
+  const hist = useFlowHistory(baseFlow);
+  const flow = hist.flow;
   const [, force] = useState(0);
   useEffect(() => onNodeKindsChanged(() => force((n) => n + 1)), []);
   const nodeTypes = useMemo(() => buildNodeTypes(), [listNodeKinds().length]);
@@ -937,6 +999,23 @@ function FlowEditorInner({
       window.removeEventListener("keydown", onKey);
     };
   }, [menu, labelEdit]);
+  useEffect(() => {
+    const onKey = (e) => {
+      const t = e.target;
+      if (t && (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.isContentEditable)) return;
+      if (!(e.ctrlKey || e.metaKey)) return;
+      const key = e.key.toLowerCase();
+      if (key === "z" && !e.shiftKey) {
+        e.preventDefault();
+        hist.undo();
+      } else if (key === "z" && e.shiftKey || key === "y") {
+        e.preventDefault();
+        hist.redo();
+      }
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [hist]);
   useEffect(() => {
     if (!controlled) onChange?.({ nodes: flow.nodes, edges: flow.edges });
   }, [flow.nodes, flow.edges, onChange, controlled]);
@@ -961,16 +1040,116 @@ function FlowEditorInner({
     [flow]
   );
   const deleteNodes = useCallback(
-    (ids) => {
+    async (ids) => {
       if (ids.length === 0) return;
+      const targets = flow.nodes.filter((n) => ids.includes(n.id));
+      if (targets.length === 0) return;
+      if (confirmDelete) {
+        const attached = flow.edges.filter((e) => ids.includes(e.source) || ids.includes(e.target));
+        if (!await confirmDelete({ nodes: targets, edges: attached })) return;
+      }
       const doomed = new Set(ids);
-      flow.setNodes((all) => removeNodes({ nodes: all, edges: [] }, ids).nodes);
-      flow.setEdges((all) => removeNodes({ nodes: [], edges: all }, ids).edges);
+      flow.setGraph(removeNodes({ nodes: flow.nodes, edges: flow.edges }, ids));
       setSelectedId((cur) => cur !== null && doomed.has(cur) ? null : cur);
       onDelete?.(ids);
     },
-    [flow, onDelete]
+    [flow, onDelete, confirmDelete]
+  );
+  const deleteEdges = useCallback(
+    async (ids) => {
+      if (ids.length === 0) return;
+      const targets = flow.edges.filter((e) => ids.includes(e.id));
+      if (targets.length === 0) return;
+      if (confirmDelete && !await confirmDelete({ nodes: [], edges: targets })) return;
+      flow.setEdges((all) => removeEdges(all, ids));
+      setSelectedEdgeId((cur) => cur !== null && ids.includes(cur) ? null : cur);
+      onEdgeDelete?.(ids);
+    },
+    [flow, onEdgeDelete, confirmDelete]
+  );
+  const selectedNodes = useMemo(() => flow.nodes.filter((n) => n.selected), [flow.nodes]);
+  const selectedIds = useMemo(() => selectedNodes.map((n) => n.id), [selectedNodes]);
+  const clipboard = useRef(null);
+  const copySelection = useCallback(() => {
+    const sel = flow.nodes.filter((n) => n.selected);
+    if (sel.length === 0) return;
+    const ids = new Set(sel.map((n) => n.id));
+    const edges = flow.edges.filter((e) => ids.has(e.source) && ids.has(e.target));
+    clipboard.current = { nodes: sel.map((n) => ({ ...n })), edges: edges.map((e) => ({ ...e })) };
+  }, [flow]);
+  const pasteClipboard = useCallback(
+    (at) => {
+      const clip = clipboard.current;
+      if (!clip || clip.nodes.length === 0) return;
+      const { nodes: clones, edges: cloneEdges } = cloneSubgraph(clip.nodes, clip.edges, { makeId: newNodeId, offset: 40 });
+      let placed = clones;
+      if (at) {
+        const minX = Math.min(...clones.map((n) => n.position.x));
+        const minY = Math.min(...clones.map((n) => n.position.y));
+        placed = clones.map((n) => ({ ...n, position: { x: n.position.x - minX + at.x, y: n.position.y - minY + at.y } }));
+      }
+      flow.setGraph({
+        nodes: [...flow.nodes.map((n) => ({ ...n, selected: false })), ...placed.map((n) => ({ ...n, selected: true }))],
+        edges: [...flow.edges, ...cloneEdges]
+      });
+    },
+    [flow]
+  );
+  const duplicateSelected = useCallback(() => {
+    const sel = flow.nodes.filter((n) => n.selected);
+    if (sel.length === 0) return;
+    const ids = new Set(sel.map((n) => n.id));
+    const internal2 = flow.edges.filter((e) => ids.has(e.source) && ids.has(e.target));
+    const { nodes: clones, edges: cloneEdges } = cloneSubgraph(sel, internal2, { makeId: newNodeId, offset: 40 });
+    flow.setGraph({
+      nodes: [...flow.nodes.map((n) => ({ ...n, selected: false })), ...clones.map((n) => ({ ...n, selected: true }))],
+      edges: [...flow.edges, ...cloneEdges]
+    });
+  }, [flow]);
+  const alignSelected = useCallback(
+    (edge) => {
+      const sel = flow.nodes.filter((n) => n.selected);
+      if (sel.length < 2) return;
+      const byId = new Map(alignNodes(sel, edge).map((n) => [n.id, n]));
+      flow.setNodes((all) => all.map((n) => byId.get(n.id) ?? n));
+    },
+    [flow]
   );
+  const distributeSelected = useCallback(
+    (axis) => {
+      const sel = flow.nodes.filter((n) => n.selected);
+      if (sel.length < 3) return;
+      const byId = new Map(distributeNodes(sel, axis).map((n) => [n.id, n]));
+      flow.setNodes((all) => all.map((n) => byId.get(n.id) ?? n));
+    },
+    [flow]
+  );
+  const onReconnect = useCallback(
+    (oldEdge, conn) => flow.setEdges((eds) => reconnectEdge2(eds, oldEdge, conn)),
+    [flow]
+  );
+  useEffect(() => {
+    const onKey = (e) => {
+      const t = e.target;
+      if (t && (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.isContentEditable)) return;
+      if (!(e.ctrlKey || e.metaKey)) return;
+      const key = e.key.toLowerCase();
+      if (key === "c") copySelection();
+      else if (key === "x") {
+        e.preventDefault();
+        copySelection();
+        deleteNodes(selectedIds);
+      } else if (key === "v") {
+        e.preventDefault();
+        pasteClipboard();
+      } else if (key === "d") {
+        e.preventDefault();
+        duplicateSelected();
+      }
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [copySelection, pasteClipboard, duplicateSelected, deleteNodes, selectedIds]);
   const api = useMemo(() => {
     const toWorkflow = () => exportWorkflow({ nodes: flow.nodes, edges: flow.edges }, metadata);
     return {
@@ -981,6 +1160,8 @@ function FlowEditorInner({
       selected,
       selectedEdgeId,
       selectedEdge,
+      selectedIds,
+      selectedNodes,
       running: runner.running,
       statuses: runner.statuses,
       select: setSelectedId,
@@ -989,18 +1170,8 @@ function FlowEditorInner({
       updateNode: (next) => flow.setNodes((all) => all.map((x) => x.id === next.id ? next : x)),
       deleteNodes,
       deleteSelected: () => deleteNodes(selectedId ? [selectedId] : []),
-      deleteEdges: (ids) => {
-        if (ids.length === 0) return;
-        flow.setEdges((all) => removeEdges(all, ids));
-        setSelectedEdgeId((cur) => cur !== null && ids.includes(cur) ? null : cur);
-        onEdgeDelete?.(ids);
-      },
-      deleteSelectedEdge: () => {
-        if (!selectedEdgeId) return;
-        flow.setEdges((all) => removeEdges(all, [selectedEdgeId]));
-        setSelectedEdgeId(null);
-        onEdgeDelete?.([selectedEdgeId]);
-      },
+      deleteEdges,
+      deleteSelectedEdge: () => deleteEdges(selectedEdgeId ? [selectedEdgeId] : []),
       setEdgeLabel: (id, label) => flow.setEdges((all) => setEdgeLabel(all, id, label)),
       duplicateNode: (id) => {
         const src = flow.nodes.find((n) => n.id === id);
@@ -1010,22 +1181,29 @@ function FlowEditorInner({
         setSelectedId(copy.id);
         return copy.id;
       },
-      setGraph: (graph) => {
-        flow.setNodes(graph.nodes);
-        flow.setEdges(graph.edges);
+      setGraph: (graph) => flow.setGraph(graph),
+      duplicateSelected,
+      alignSelected,
+      distributeSelected,
+      copy: copySelection,
+      cut: () => {
+        copySelection();
+        deleteNodes(selectedIds);
       },
+      paste: pasteClipboard,
       run: () => runner.run({ nodes: flow.nodes, edges: flow.edges }, executors),
       cancel: runner.cancel,
       reset: runner.reset,
       toWorkflow,
       exportWorkflow: () => downloadWorkflow(toWorkflow(), metadata),
-      importWorkflow: () => pickWorkflow((graph) => {
-        flow.setNodes(graph.nodes);
-        flow.setEdges(graph.edges);
-      }),
-      fitView: () => rf.fitView({ padding: 0.2 })
+      importWorkflow: () => pickWorkflow((graph) => flow.setGraph(graph)),
+      fitView: () => rf.fitView({ padding: 0.2 }),
+      undo: hist.undo,
+      redo: hist.redo,
+      canUndo: hist.canUndo,
+      canRedo: hist.canRedo
     };
-  }, [flow, selectedId, selected, runner, executors, metadata, addNode, deleteNodes, rf]);
+  }, [flow, selectedId, selected, selectedEdgeId, selectedEdge, selectedIds, selectedNodes, runner, executors, metadata, addNode, deleteNodes, deleteEdges, duplicateSelected, alignSelected, distributeSelected, copySelection, pasteClipboard, hist, rf]);
   useImperativeHandle(apiRef, () => api, [api]);
   const dropHandlers = paletteDropHandlers((kindName, evt) => {
     const point = rf.screenToFlowPosition({ x: evt.clientX, y: evt.clientY });
@@ -1036,6 +1214,31 @@ function FlowEditorInner({
   const toolbar = slots.toolbar ? slots.toolbar(api) : /* @__PURE__ */ jsxs(Fragment, { children: [
     startActions.map((a) => renderAction(a, api)),
     builtins.run !== false && /* @__PURE__ */ jsx(FlowRunControls, { running: api.running, onRun: api.run, onCancel: api.cancel, onReset: api.reset }),
+    builtins.history !== false && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { className: "ff-editor__sep" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "ff-editor__btn",
+          "data-action": "undo",
+          title: "Undo (Ctrl+Z)",
+          disabled: !api.canUndo,
+          onClick: api.undo,
+          children: "\u21B6 Undo"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "ff-editor__btn",
+          "data-action": "redo",
+          title: "Redo (Ctrl+Shift+Z)",
+          disabled: !api.canRedo,
+          onClick: api.redo,
+          children: "\u21B7 Redo"
+        }
+      )
+    ] }),
     (builtins.export !== false || builtins.import !== false) && /* @__PURE__ */ jsx("span", { className: "ff-editor__sep" }),
     builtins.export !== false && /* @__PURE__ */ jsx("button", { className: "ff-editor__btn", "data-action": "export", onClick: api.exportWorkflow, children: "\u2193 Export" }),
     builtins.import !== false && /* @__PURE__ */ jsx("button", { className: "ff-editor__btn", "data-action": "import", onClick: api.importWorkflow, children: "\u2191 Import" }),
@@ -1060,12 +1263,16 @@ function FlowEditorInner({
           onNodesChange: flow.onNodesChange,
           onEdgesChange: flow.onEdgesChange,
           onConnect: flow.onConnect,
+          onReconnect,
+          edgesReconnectable: true,
+          onNodeDragStart: hist.onNodeDragStart,
           onNodeClick: handleNodeClick,
           onNodeContextMenu: builtins.contextMenu === false ? void 0 : handleNodeContextMenu,
           onEdgeClick: handleEdgeClick,
           onEdgeContextMenu: builtins.edgeContextMenu === false ? void 0 : handleEdgeContextMenu,
           onEdgesDelete: (deleted) => onEdgeDelete?.(deleted.map((e) => e.id)),
           onNodesDelete: (deleted) => onDelete?.(deleted.map((n) => n.id)),
+          onBeforeDelete: confirmDelete ? async ({ nodes, edges }) => confirmDelete({ nodes, edges }) : void 0,
           deleteKeyCode: ["Delete", "Backspace"],
           height: "100%",
           toolbar,
@@ -1236,6 +1443,8 @@ function makeControlledFlowAdapter(value, onChange) {
       const nextEdges = typeof next === "function" ? next(value.edges) : next;
       apply({ nodes: value.nodes, edges: nextEdges });
     },
+    // Atomic both-at-once commit — the reason this exists (see UseFlowStateReturn).
+    setGraph: (graph) => apply(graph),
     onNodesChange: (changes) => {
       apply({ nodes: applyNodeChanges(changes, value.nodes), edges: value.edges });
     },
@@ -1322,6 +1531,6 @@ function NodePort({ side, type, id, style, title, className }) {
 // src/index.ts
 registerBuiltinKinds();
 
-export { ActionNode, ConfigFieldRenderer, DecisionNode, FlowCanvas, FlowEditor, FlowRunControls, FlowRunFeed, NodeConfigPanel, NodePalette, NodePort, NodeShell, NoteNode, OutputNode, SubgraphNode, TriggerNode, defaultNodeTypes, defineNode, paletteDropHandlers, useFlowEditor, useFlowEditorOptional };
+export { ActionNode, ConfigFieldRenderer, DecisionNode, FlowCanvas, FlowEditor, FlowRunControls, FlowRunFeed, NodeConfigPanel, NodePalette, NodePort, NodeShell, NoteNode, OutputNode, SubgraphNode, TriggerNode, alignNodes, cloneSubgraph, defaultNodeTypes, defineNode, distributeNodes, paletteDropHandlers, reconnectEdge2 as reconnectEdge, useFlowEditor, useFlowEditorOptional };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map