feat(nodes,edges): add deletable flag

examples/nextjs/pages/Overview/index.tsx

@@ -121,11 +121,12 @@ const initialNodes: Node[] = [
     data: {
       label: (
         <>
-          An <strong>output node</strong>
+          An <strong>output node (not deletable)</strong>
         </>
       ),
     },
     position: { x: 100, y: 480 },
+    deletable: false,
   },
   {
     id: '7',
@@ -151,7 +152,8 @@ const initialEdges: Edge[] = [
     source: '5',
     target: '6',
     type: 'smoothstep',
-    label: 'smooth step edge',
+    deletable: false,
+    label: 'smooth step edge (not deletable)',
   },
   {
     id: 'e5-7',

packages/core/src/hooks/useGlobalKeyHandler.ts

@@ -34,16 +34,18 @@ export default ({ deleteKeyCode, multiSelectionKeyCode }: HookParams): void => {
     const nodes = Array.from(nodeInternals.values());
     const nodesToRemove = nodes.reduce<Node[]>((res, node) => {
       const parentSelected = !node.selected && node.parentNode && res.find((n) => n.id === node.parentNode);
-      if (node.selected || parentSelected) {
+      const deletable = typeof node.deletable === 'boolean' ? node.deletable : true;
+      if (deletable && (node.selected || parentSelected)) {
         res.push(node);
       }
 
       return res;
     }, []);
-    const selectedEdges = edges.filter((e) => e.selected);
+    const deletableEdges = edges.filter((e) => (typeof e.deletable === 'boolean' ? e.deletable : true));
+    const selectedEdges = deletableEdges.filter((e) => e.selected);
 
     if (nodesToRemove || selectedEdges) {
-      const connectedEdges = getConnectedEdges(nodesToRemove, edges);
+      const connectedEdges = getConnectedEdges(nodesToRemove, deletableEdges);
       const edgesToRemove = [...selectedEdges, ...connectedEdges];
       const edgeIdsToRemove = edgesToRemove.reduce<string[]>((res, edge) => {
         if (!res.includes(edge.id)) {

packages/core/src/types/edges.ts

@@ -22,6 +22,7 @@ export interface Edge<T = any> {
   style?: CSSProperties;
   animated?: boolean;
   hidden?: boolean;
+  deletable?: boolean;
   data?: T;
   className?: string;
   sourceNode?: Node;

packages/core/src/types/nodes.ts

@@ -21,6 +21,7 @@ export interface Node<T = any> {
   draggable?: boolean;
   selectable?: boolean;
   connectable?: boolean;
+  deletable?: boolean;
   dragHandle?: string;
   width?: number | null;
   height?: number | null;