handling dpad navigation in input dropped

src/common/Input/Input.js

@@ -5,7 +5,6 @@ const useTabIndex = require('../useTabIndex');
 const styles = require('./styles');
 
 const ENTER_KEY_CODE = 13;
-const ARROW_KEY_CODE = { 37: 'left', 38: 'up', 39: 'right', 40: 'down' };
 
 const Input = React.forwardRef((props, ref) => {
     const tabIndex = useTabIndex(props.tabIndex, props.disabled);
@@ -18,15 +17,6 @@ const Input = React.forwardRef((props, ref) => {
             props.onSubmit(event);
         }
     }, [props.onKeyUp, props.onSubmit]);
-    const onKeyDown = React.useCallback((event) => {
-        if (ARROW_KEY_CODE[event.keyCode]) {
-            event.stopPropagation();
-            if (event.shiftKey) {
-                event.preventDefault();
-                window.navigate(ARROW_KEY_CODE[event.keyCode]);
-            }
-        }
-    }, [props.onKeyDown]);
     return (
         <input
             {...props}
@@ -34,7 +24,6 @@ const Input = React.forwardRef((props, ref) => {
             className={classnames(props.className, styles['input-container'], { 'disabled': props.disabled })}
             tabIndex={tabIndex}
             onKeyUp={onKeyUp}
-            onKeyDown={onKeyDown}
         />
     );
 });
@@ -46,7 +35,6 @@ Input.propTypes = {
     tabIndex: PropTypes.number,
     disabled: PropTypes.bool,
     onKeyUp: PropTypes.func,
-    onKeyDown: PropTypes.func,
     onSubmit: PropTypes.func
 };
 

src/common/Input/styles.less

@@ -1,5 +1,4 @@
 .input-container {
-    --spatial-navigation-action: focus;
     user-select: text;
 
     &::-moz-focus-inner {