diff --git a/examples/react/src/examples/Edges/index.tsx b/examples/react/src/examples/Edges/index.tsx
index b5b84fc6..d6870621 100644
--- a/examples/react/src/examples/Edges/index.tsx
+++ b/examples/react/src/examples/Edges/index.tsx
@@ -196,6 +196,7 @@ const EdgesFlow = () => {
onEdgeMouseEnter={onEdgeMouseEnter}
onEdgeMouseMove={onEdgeMouseMove}
onEdgeMouseLeave={onEdgeMouseLeave}
+ onDelete={console.log}
>
diff --git a/packages/react/src/components/StoreUpdater/index.tsx b/packages/react/src/components/StoreUpdater/index.tsx
index 05a8aa50..65f1bb3c 100644
--- a/packages/react/src/components/StoreUpdater/index.tsx
+++ b/packages/react/src/components/StoreUpdater/index.tsx
@@ -43,6 +43,7 @@ type StoreUpdaterProps = Pick<
| 'fitViewOptions'
| 'onNodesDelete'
| 'onEdgesDelete'
+ | 'onDelete'
| 'onNodeDragStart'
| 'onNodeDrag'
| 'onNodeDragStop'
@@ -128,6 +129,7 @@ const StoreUpdater = ({
fitViewOptions,
onNodesDelete,
onEdgesDelete,
+ onDelete,
onNodeDrag,
onNodeDragStart,
onNodeDragStop,
@@ -192,6 +194,7 @@ const StoreUpdater = ({
useDirectStoreUpdater('fitViewOnInitOptions', fitViewOptions, store.setState);
useDirectStoreUpdater('onNodesDelete', onNodesDelete, store.setState);
useDirectStoreUpdater('onEdgesDelete', onEdgesDelete, store.setState);
+ useDirectStoreUpdater('onDelete', onDelete, store.setState);
useDirectStoreUpdater('onNodeDrag', onNodeDrag, store.setState);
useDirectStoreUpdater('onNodeDragStart', onNodeDragStart, store.setState);
useDirectStoreUpdater('onNodeDragStop', onNodeDragStop, store.setState);
diff --git a/packages/react/src/container/ReactFlow/index.tsx b/packages/react/src/container/ReactFlow/index.tsx
index f39650a4..d7995a53 100644
--- a/packages/react/src/container/ReactFlow/index.tsx
+++ b/packages/react/src/container/ReactFlow/index.tsx
@@ -82,6 +82,7 @@ const ReactFlow = forwardRef(
onNodeDragStop,
onNodesDelete,
onEdgesDelete,
+ onDelete,
onSelectionChange,
onSelectionDragStart,
onSelectionDrag,
@@ -281,6 +282,7 @@ const ReactFlow = forwardRef(
fitViewOptions={fitViewOptions}
onNodesDelete={onNodesDelete}
onEdgesDelete={onEdgesDelete}
+ onDelete={onDelete}
onNodeDragStart={onNodeDragStart}
onNodeDrag={onNodeDrag}
onNodeDragStop={onNodeDragStop}
diff --git a/packages/react/src/hooks/useReactFlow.ts b/packages/react/src/hooks/useReactFlow.ts
index e72c3a4f..257dd0f2 100644
--- a/packages/react/src/hooks/useReactFlow.ts
+++ b/packages/react/src/hooks/useReactFlow.ts
@@ -127,6 +127,7 @@ export default function useReactFlow(): ReactFlo
onEdgesDelete,
onNodesChange,
onEdgesChange,
+ onDelete,
} = store.getState();
const { matchingNodes, matchingEdges } = getElementsToRemove({
nodesToRemove: nodesDeleted || [],
@@ -171,6 +172,8 @@ export default function useReactFlow(): ReactFlo
onNodesChange(nodeChanges);
}
}
+
+ onDelete?.({ nodes: matchingNodes, edges: matchingEdges });
}
return { deletedNodes: matchingNodes, deletedEdges: matchingEdges };
diff --git a/packages/react/src/types/component-props.ts b/packages/react/src/types/component-props.ts
index 2ce0fc70..583b3d86 100644
--- a/packages/react/src/types/component-props.ts
+++ b/packages/react/src/types/component-props.ts
@@ -34,6 +34,7 @@ import type {
FitViewOptions,
OnNodesDelete,
OnEdgesDelete,
+ OnDelete,
OnNodesChange,
OnEdgesChange,
NodeDragHandler,
@@ -70,6 +71,7 @@ export type ReactFlowProps = Omit, 'onError'> & {
onEdgesChange?: OnEdgesChange;
onNodesDelete?: OnNodesDelete;
onEdgesDelete?: OnEdgesDelete;
+ onDelete?: OnDelete;
onSelectionDragStart?: SelectionDragHandler;
onSelectionDrag?: SelectionDragHandler;
onSelectionDragStop?: SelectionDragHandler;
diff --git a/packages/react/src/types/general.ts b/packages/react/src/types/general.ts
index 225e159c..b2e7098a 100644
--- a/packages/react/src/types/general.ts
+++ b/packages/react/src/types/general.ts
@@ -21,6 +21,7 @@ export type OnEdgesChange = (changes: EdgeChange[]) => void;
export type OnNodesDelete = (nodes: Node[]) => void;
export type OnEdgesDelete = (edges: Edge[]) => void;
+export type OnDelete = (params: { nodes: Node[]; edges: Edge[] }) => void;
export type NodeTypes = { [key: string]: ComponentType };
export type NodeTypesWrapped = { [key: string]: MemoExoticComponent> };
diff --git a/packages/react/src/types/store.ts b/packages/react/src/types/store.ts
index 02a7d162..c473cbd5 100644
--- a/packages/react/src/types/store.ts
+++ b/packages/react/src/types/store.ts
@@ -38,6 +38,7 @@ import type {
OnEdgesDelete,
OnSelectionChangeFunc,
UnselectNodesAndEdgesParams,
+ OnDelete,
} from '.';
export type ReactFlowStore = {
@@ -118,6 +119,7 @@ export type ReactFlowStore = {
onNodesDelete?: OnNodesDelete;
onEdgesDelete?: OnEdgesDelete;
+ onDelete?: OnDelete;
onError?: OnError;
// event handlers