From dedc627294f076803dbde73fd2f04db5a9f96593 Mon Sep 17 00:00:00 2001
From: Mathias <mathiasbaldissra@hotmail.com>
Date: Sat, 16 Nov 2019 21:58:12 -0300
Subject: [PATCH] Export DeleteItemsAction and event to deregister the default
 DeleteI...

DeleteItemsAction and ZoomCanvasAction are now exported;
Now there is 2 functions to deregister the default ZoomCanvas and DeleteItems actions;
A exemple with how to deregister and register another DeleteItemsAction
---
 .../demos/demo-custom_delete_keys/index.tsx   | 32 +++++++++++++++++++
 packages/diagrams-demo-gallery/index.tsx      |  4 ++-
 packages/react-canvas-core/index.ts           |  3 ++
 .../react-canvas-core/src/CanvasEngine.ts     |  7 ++--
 4 files changed, 43 insertions(+), 3 deletions(-)
 create mode 100644 packages/diagrams-demo-gallery/demos/demo-custom_delete_keys/index.tsx

diff --git a/packages/diagrams-demo-gallery/demos/demo-custom_delete_keys/index.tsx b/packages/diagrams-demo-gallery/demos/demo-custom_delete_keys/index.tsx
new file mode 100644
index 0000000..313c0f8
--- /dev/null
+++ b/packages/diagrams-demo-gallery/demos/demo-custom_delete_keys/index.tsx
@@ -0,0 +1,32 @@
+import * as React from 'react';
+import createEngine, { DiagramModel, DefaultNodeModel } from '@projectstorm/react-diagrams';
+import { CanvasWidget, DeleteItemsAction } from '@projectstorm/react-canvas-core';
+import { DemoCanvasWidget } from '../helpers/DemoCanvasWidget';
+
+export default () => {
+	const engine = createEngine();
+	const model = new DiagramModel();
+
+	const node1 = new DefaultNodeModel('Node 1', 'rgb(0,192,255)');
+	node1.addOutPort('Out');
+	node1.setPosition(100, 100);
+
+	const node2 = new DefaultNodeModel('Node 2', 'rgb(192,255,0)');
+	node2.addInPort('In');
+	node2.setPosition(400, 100);
+
+	model.addAll(node1, node2);
+
+	engine.setModel(model);
+
+	//deregister the default DeleteItemsAction
+	engine.deregisterDefaultDeleteItemsAction();
+	//add another DeleteItemsAction with custom keyCodes (in this case, only Delete key)
+	this.eventBus.registerAction(new DeleteItemsAction({ keyCodes: [46] }));
+
+	return (
+		<DemoCanvasWidget>
+			<CanvasWidget engine={engine} />
+		</DemoCanvasWidget>
+	);
+};
diff --git a/packages/diagrams-demo-gallery/index.tsx b/packages/diagrams-demo-gallery/index.tsx
index abfb2fc..088ac7a 100644
--- a/packages/diagrams-demo-gallery/index.tsx
+++ b/packages/diagrams-demo-gallery/index.tsx
@@ -34,6 +34,7 @@ import demo_zoom from './demos/demo-zoom-to-fit';
 import demo_labels from './demos/demo-labelled-links';
 import demo_dynamic_ports from './demos/demo-dynamic-ports';
 import demo_alternative_linking from './demos/demo-alternative-linking';
+import demo_custom_delete_keys from './demos/demo-custom_delete_keys';
 
 storiesOf('Simple Usage', module)
 	.add('Simple example', demo_simple)
@@ -60,7 +61,8 @@ storiesOf('Advanced Techniques', module)
 	.add('Drag and drop', demo_adv_dnd)
 	.add('Smart routing', demo_smart_routing)
 	.add('Right angles routing', demo_right_angles_routing)
-	.add('Linking by clicking instead of dragging', demo_alternative_linking);
+	.add('Linking by clicking instead of dragging', demo_alternative_linking)
+	.add('Setting custom delete keys', demo_custom_delete_keys);
 
 import demo_cust_nodes from './demos/demo-custom-node1';
 import demo_cust_links from './demos/demo-custom-link1';
diff --git a/packages/react-canvas-core/index.ts b/packages/react-canvas-core/index.ts
index 3a17aac..d4eb876 100644
--- a/packages/react-canvas-core/index.ts
+++ b/packages/react-canvas-core/index.ts
@@ -38,3 +38,6 @@ export * from './src/states/DragCanvasState';
 export * from './src/states/SelectingState';
 export * from './src/states/SelectionBoxState';
 export * from './src/states/MoveItemsState';
+
+export * from './src/actions/DeleteItemsAction';
+export * from './src/actions/ZoomCanvasAction';
diff --git a/packages/react-canvas-core/src/CanvasEngine.ts b/packages/react-canvas-core/src/CanvasEngine.ts
index 685490f..9272bc0 100644
--- a/packages/react-canvas-core/src/CanvasEngine.ts
+++ b/packages/react-canvas-core/src/CanvasEngine.ts
@@ -29,6 +29,9 @@ export class CanvasEngine<
 	protected eventBus: ActionEventBus;
 	protected stateMachine: StateMachine;
 
+	deregisterDefaultDeleteItemsAction: () => void;
+	deregisterDefaultZoomCanvasAction: () => void;
+
 	constructor() {
 		super();
 		this.model = null;
@@ -36,8 +39,8 @@ export class CanvasEngine<
 		this.stateMachine = new StateMachine(this);
 		this.layerFactories = new FactoryBank();
 		this.registerFactoryBank(this.layerFactories);
-		this.eventBus.registerAction(new ZoomCanvasAction());
-		this.eventBus.registerAction(new DeleteItemsAction());
+		this.deregisterDefaultZoomCanvasAction = this.eventBus.registerAction(new ZoomCanvasAction());
+		this.deregisterDefaultDeleteItemsAction = this.eventBus.registerAction(new DeleteItemsAction());
 	}
 
 	getStateMachine() {