From 74f597295601e4fa59559a6b16dc7d4e8148ddad Mon Sep 17 00:00:00 2001 From: Somar Aani Date: Thu, 10 Feb 2022 20:47:44 -0500 Subject: [PATCH 1/2] fire keyup event on blur --- .../react-canvas-core/src/core-actions/ActionEventBus.ts | 6 ++++++ .../react-canvas-core/src/entities/canvas/CanvasWidget.tsx | 5 +++++ 2 files changed, 11 insertions(+) diff --git a/packages/react-canvas-core/src/core-actions/ActionEventBus.ts b/packages/react-canvas-core/src/core-actions/ActionEventBus.ts index 769ca397..c039010a 100644 --- a/packages/react-canvas-core/src/core-actions/ActionEventBus.ts +++ b/packages/react-canvas-core/src/core-actions/ActionEventBus.ts @@ -80,4 +80,10 @@ export class ActionEventBus { action.options.fire(actionEvent as any); } } + + clearKeys() { + _.forEach(Object.keys(this.keys), (key) => { + document.dispatchEvent(new KeyboardEvent('keyup', {'key': key})); + }); + } } diff --git a/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx b/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx index 77a06cf8..3a37cf4d 100644 --- a/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx +++ b/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx @@ -21,6 +21,7 @@ export class CanvasWidget extends React.Component { ref: React.RefObject; keyUp: any; keyDown: any; + blur: any; canvasListener: any; constructor(props: DiagramProps) { @@ -65,9 +66,13 @@ export class CanvasWidget extends React.Component { this.keyUp = (event) => { this.props.engine.getActionEventBus().fireAction({ event }); }; + this.blur = () => { + this.props.engine.getActionEventBus().clearKeys(); + } document.addEventListener('keyup', this.keyUp); document.addEventListener('keydown', this.keyDown); + document.addEventListener('blur', this.blur); this.registerCanvas(); } From 43be969805bd7ed19597daac951f0ce40940a95f Mon Sep 17 00:00:00 2001 From: Somar Aani Date: Thu, 10 Feb 2022 20:51:03 -0500 Subject: [PATCH 2/2] ran pretty --- packages/react-canvas-core/src/Toolkit.ts | 2 +- packages/react-canvas-core/src/core-actions/ActionEventBus.ts | 2 +- packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-canvas-core/src/Toolkit.ts b/packages/react-canvas-core/src/Toolkit.ts index 55a5b855..2fb7fbee 100644 --- a/packages/react-canvas-core/src/Toolkit.ts +++ b/packages/react-canvas-core/src/Toolkit.ts @@ -20,7 +20,7 @@ export class Toolkit { public static closest(element: Element, selector: string) { if (!Element.prototype.closest) { - Element.prototype.closest = function(s) { + Element.prototype.closest = function (s) { var el = this; do { diff --git a/packages/react-canvas-core/src/core-actions/ActionEventBus.ts b/packages/react-canvas-core/src/core-actions/ActionEventBus.ts index c039010a..031486d7 100644 --- a/packages/react-canvas-core/src/core-actions/ActionEventBus.ts +++ b/packages/react-canvas-core/src/core-actions/ActionEventBus.ts @@ -83,7 +83,7 @@ export class ActionEventBus { clearKeys() { _.forEach(Object.keys(this.keys), (key) => { - document.dispatchEvent(new KeyboardEvent('keyup', {'key': key})); + document.dispatchEvent(new KeyboardEvent('keyup', { key: key })); }); } } diff --git a/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx b/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx index 3a37cf4d..1c81a5f7 100644 --- a/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx +++ b/packages/react-canvas-core/src/entities/canvas/CanvasWidget.tsx @@ -68,7 +68,7 @@ export class CanvasWidget extends React.Component { }; this.blur = () => { this.props.engine.getActionEventBus().clearKeys(); - } + }; document.addEventListener('keyup', this.keyUp); document.addEventListener('keydown', this.keyDown);