diff --git a/app/assets/javascripts/discourse/widgets/hooks.js.es6 b/app/assets/javascripts/discourse/widgets/hooks.js.es6 index 14b7cd0d962..d863d46e81a 100644 --- a/app/assets/javascripts/discourse/widgets/hooks.js.es6 +++ b/app/assets/javascripts/discourse/widgets/hooks.js.es6 @@ -3,6 +3,7 @@ const CLICK_ATTRIBUTE_NAME = '_discourse_click_widget'; const CLICK_OUTSIDE_ATTRIBUTE_NAME = '_discourse_click_outside_widget'; const KEY_UP_ATTRIBUTE_NAME = '_discourse_key_up_widget'; +const KEY_DOWN_ATTRIBUTE_NAME = '_discourse_key_down_widget'; const DRAG_ATTRIBUTE_NAME = '_discourse_drag_widget'; function buildHook(attributeName, setAttr) { @@ -30,6 +31,7 @@ function buildHook(attributeName, setAttr) { export const WidgetClickHook = buildHook(CLICK_ATTRIBUTE_NAME); export const WidgetClickOutsideHook = buildHook(CLICK_OUTSIDE_ATTRIBUTE_NAME, 'data-click-outside'); export const WidgetKeyUpHook = buildHook(KEY_UP_ATTRIBUTE_NAME); +export const WidgetKeyDownHook = buildHook(KEY_DOWN_ATTRIBUTE_NAME); export const WidgetDragHook = buildHook(DRAG_ATTRIBUTE_NAME); @@ -105,5 +107,9 @@ WidgetClickHook.setupDocumentCallback = function() { nodeCallback(e.target, KEY_UP_ATTRIBUTE_NAME, w => w.keyUp(e)); }); + $(document).on('keydown.discourse-widget', e => { + nodeCallback(e.target, KEY_DOWN_ATTRIBUTE_NAME, w => w.keyDown(e)); + }); + _watchingDocument = true; }; diff --git a/app/assets/javascripts/discourse/widgets/widget.js.es6 b/app/assets/javascripts/discourse/widgets/widget.js.es6 index 3dc30982ae2..bef20bf04e6 100644 --- a/app/assets/javascripts/discourse/widgets/widget.js.es6 +++ b/app/assets/javascripts/discourse/widgets/widget.js.es6 @@ -1,4 +1,4 @@ -import { WidgetClickHook, WidgetClickOutsideHook, WidgetKeyUpHook, WidgetDragHook } from 'discourse/widgets/hooks'; +import { WidgetClickHook, WidgetClickOutsideHook, WidgetKeyUpHook, WidgetKeyDownHook, WidgetDragHook } from 'discourse/widgets/hooks'; import { h } from 'virtual-dom'; import DecoratorHelper from 'discourse/widgets/decorator-helper'; @@ -71,6 +71,10 @@ function drawWidget(builder, attrs, state) { properties['widget-key-up'] = new WidgetKeyUpHook(this); } + if (this.keyDown) { + properties['widget-key-down'] = new WidgetKeyDownHook(this); + } + if (this.clickOutside) { properties['widget-click-outside'] = new WidgetClickOutsideHook(this); }