Merge pull request #3158 from kuhelbeher/feature/inputNumber_keyboard

Add keydown event to handle up and down arrows keypress events
GrapesJS · Nov 26, 2020 · d47c495 · d47c495
2 parents 089a50a + 9b25e7e
commit d47c495
Showing 1 changed file with 17 additions and 1 deletion.
diff --git a/src/domain_abstract/ui/InputNumber.js b/src/domain_abstract/ui/InputNumber.js
@@ -11,7 +11,8 @@ export default Input.extend({
     'change select': 'handleUnitChange',
     'click [data-arrow-up]': 'upArrowClick',
     'click [data-arrow-down]': 'downArrowClick',
-    'mousedown [data-arrows]': 'downIncrement'
+    'mousedown [data-arrows]': 'downIncrement',
+    keydown: 'handleKeyDown'
   },
 
   template() {
@@ -81,6 +82,21 @@ export default Input.extend({
     this.elementUpdated();
   },
 
+  /**
+   * Handled when user uses keyboard
+   */
+  handleKeyDown(e) {
+    if (e.key === 'ArrowUp') {
+      e.preventDefault();
+      this.upArrowClick();
+    }
+
+    if (e.key === 'ArrowDown') {
+      e.preventDefault();
+      this.downArrowClick();
+    }
+  },
+
   /**
    * Fired when the element of the property is updated
    */