diff --git a/CHANGELOG.md b/CHANGELOG.md index 13e293c..00ea6e8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,8 @@ All notable changes to [@bpmn-io/element-template-chooser](https://github.com/ca ___Note:__ Yet to be released changes appear here._ +* `FEAT`: restore focus on the canvas when pop up is closed + ## 1.0.0 * `FEAT`: use modern popup menu foundations diff --git a/src/ElementTemplateChooser.js b/src/ElementTemplateChooser.js index 714e405..467d1d1 100644 --- a/src/ElementTemplateChooser.js +++ b/src/ElementTemplateChooser.js @@ -10,18 +10,21 @@ import './ElementTemplateChooser.css'; * @param {ElementTemplates} elementTemplates * @param {Translate} translate * @param {PopupMenu} popupMenu + * @param {Canvas} canvas */ export default function ElementTemplateChooser( config, eventBus, elementTemplates, translate, - popupMenu) { + popupMenu, + canvas) { this._eventBus = eventBus; this._elementTemplates = elementTemplates; this._translate = translate; this._popupMenu = popupMenu; + this._canvas = canvas; const enableChooser = !config || config.elementTemplateChooser !== false; @@ -44,7 +47,8 @@ ElementTemplateChooser.$inject = [ 'eventBus', 'elementTemplates', 'translate', - 'popupMenu' + 'popupMenu', + 'canvas' ]; ElementTemplateChooser.prototype.open = function(element) { @@ -52,10 +56,22 @@ ElementTemplateChooser.prototype.open = function(element) { const popupMenu = this._popupMenu; const translate = this._translate; const eventBus = this._eventBus; + const canvas = this._canvas; + + const restoreCanvasFocus = () => { + + // Only available with diagram-js >= 15.0.0 + if (canvas.restoreFocus) { + canvas.restoreFocus(); + } + }; return new Promise((resolve, reject) => { - const handleClosed = () => reject('user-canceled'); + const handleClosed = () => { + reject('user-canceled'); + restoreCanvasFocus(); + }; eventBus.once('popupMenu.close', handleClosed); @@ -66,6 +82,7 @@ ElementTemplateChooser.prototype.open = function(element) { eventBus.off('popupMenu.close', handleClosed); resolve(template); + restoreCanvasFocus(); }); popupMenu.open(element, 'element-template-chooser', { x: 0, y: 0 }, { @@ -75,4 +92,4 @@ ElementTemplateChooser.prototype.open = function(element) { }); }); -}; \ No newline at end of file +};