diff --git a/example/src/Overview/index.tsx b/example/src/Overview/index.tsx index 3723e075..795c75b0 100644 --- a/example/src/Overview/index.tsx +++ b/example/src/Overview/index.tsx @@ -200,7 +200,6 @@ const OverviewFlow = () => { maxZoom={Infinity} onNodesDelete={onNodesDelete} onEdgesDelete={onEdgesDelete} - deleteKeyCode={null} > diff --git a/src/hooks/useGlobalKeyHandler.ts b/src/hooks/useGlobalKeyHandler.ts index b24710f6..e6e88057 100644 --- a/src/hooks/useGlobalKeyHandler.ts +++ b/src/hooks/useGlobalKeyHandler.ts @@ -43,34 +43,43 @@ export default ({ deleteKeyCode, multiSelectionKeyCode }: HookParams): void => { const edgesToRemove = [...selectedEdges, ...connectedEdges]; const edgeIdsToRemove = edgesToRemove.map((e) => e.id); - if (hasDefaultNodes) { - nodesToRemove.forEach((node) => { - nodeInternals.delete(node.id); - }); + if (hasDefaultEdges || hasDefaultNodes) { + if (hasDefaultEdges) { + store.setState({ + edges: edges.filter((e) => !edgeIdsToRemove.includes(e.id)), + }); + } + + if (hasDefaultNodes) { + nodesToRemove.forEach((node) => { + nodeInternals.delete(node.id); + }); + + store.setState({ + nodeInternals: new Map(nodeInternals), + }); + } } - if (hasDefaultEdges) { - store.setState({ - nodeInternals: new Map(nodeInternals), - edges: edges.filter((e) => !edgeIdsToRemove.includes(e.id)), - }); + if (edgeIdsToRemove.length > 0) { + onEdgesDelete?.(edgesToRemove); + + if (onEdgesChange) { + const edgeChanges: EdgeChange[] = edgeIdsToRemove.map((id) => ({ + id, + type: 'remove', + })); + onEdgesChange(edgeChanges); + } } - onEdgesDelete?.(edgesToRemove); - onNodesDelete?.(nodesToRemove); + if (nodesToRemove.length > 0) { + onNodesDelete?.(nodesToRemove); - if (onEdgesChange) { - const edgeChanges: EdgeChange[] = edgeIdsToRemove.map((id) => ({ - id, - type: 'remove', - })); - - onEdgesChange(edgeChanges); - } - - if (onNodesChange) { - const nodeChanges: NodeChange[] = nodesToRemove.map((n) => ({ id: n.id, type: 'remove' })); - onNodesChange(nodeChanges); + if (onNodesChange) { + const nodeChanges: NodeChange[] = nodesToRemove.map((n) => ({ id: n.id, type: 'remove' })); + onNodesChange(nodeChanges); + } } store.setState({ nodesSelectionActive: false });