From 0d7cace3540af2aedc2a629966d34d767598aaee Mon Sep 17 00:00:00 2001
From: Sean Landsman <sean@thelandsmans.com>
Date: Thu, 10 Aug 2017 16:02:03 +0100
Subject: [PATCH] Add example for keypress in editors
 https://github.com/ag-grid/ag-grid-react/issues/60

---
 src/editorComponentExample/NumericEditor.jsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/editorComponentExample/NumericEditor.jsx b/src/editorComponentExample/NumericEditor.jsx
index 0899b75..389e2f5 100644
--- a/src/editorComponentExample/NumericEditor.jsx
+++ b/src/editorComponentExample/NumericEditor.jsx
@@ -16,6 +16,7 @@ export default class MoodEditor extends Component {
     }
 
     componentDidMount() {
+        this.refs.input.addEventListener('keydown', this.onKeyDown);
         this.focus();
     }
 
@@ -23,6 +24,10 @@ export default class MoodEditor extends Component {
         this.focus();
     }
 
+    componentWillUnmount() {
+        this.refs.input.removeEventListener('keydown', this.onKeyDown);
+    }
+
     focus() {
         setTimeout(() => {
             let container = ReactDOM.findDOMNode(this.refs.input);
@@ -47,11 +52,20 @@ export default class MoodEditor extends Component {
     };
 
     onKeyDown(event) {
+        if(this.isLeftOrRight(event)) {
+            event.stopPropagation();
+            return;
+        }
+
         if (!this.isKeyPressedNumeric(event)) {
             if (event.preventDefault) event.preventDefault();
         }
     }
 
+    isLeftOrRight(event) {
+        return [37, 39].indexOf(event.keyCode) > -1;
+    }
+
     handleChange(event) {
         this.setState({value: event.target.value});
     }
@@ -75,7 +89,6 @@ export default class MoodEditor extends Component {
         return (
             <input ref="input"
                    value={this.state.value}
-                   onKeyDown={this.onKeyDown}
                    onChange={this.handleChange}
             />
         );