mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-04-21 07:32:02 +00:00
handling dpad navigation in input dropped
This commit is contained in:
parent
a4c474a33b
commit
575b469735
2 changed files with 0 additions and 13 deletions
|
|
@ -5,7 +5,6 @@ const useTabIndex = require('../useTabIndex');
|
||||||
const styles = require('./styles');
|
const styles = require('./styles');
|
||||||
|
|
||||||
const ENTER_KEY_CODE = 13;
|
const ENTER_KEY_CODE = 13;
|
||||||
const ARROW_KEY_CODE = { 37: 'left', 38: 'up', 39: 'right', 40: 'down' };
|
|
||||||
|
|
||||||
const Input = React.forwardRef((props, ref) => {
|
const Input = React.forwardRef((props, ref) => {
|
||||||
const tabIndex = useTabIndex(props.tabIndex, props.disabled);
|
const tabIndex = useTabIndex(props.tabIndex, props.disabled);
|
||||||
|
|
@ -18,15 +17,6 @@ const Input = React.forwardRef((props, ref) => {
|
||||||
props.onSubmit(event);
|
props.onSubmit(event);
|
||||||
}
|
}
|
||||||
}, [props.onKeyUp, props.onSubmit]);
|
}, [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 (
|
return (
|
||||||
<input
|
<input
|
||||||
{...props}
|
{...props}
|
||||||
|
|
@ -34,7 +24,6 @@ const Input = React.forwardRef((props, ref) => {
|
||||||
className={classnames(props.className, styles['input-container'], { 'disabled': props.disabled })}
|
className={classnames(props.className, styles['input-container'], { 'disabled': props.disabled })}
|
||||||
tabIndex={tabIndex}
|
tabIndex={tabIndex}
|
||||||
onKeyUp={onKeyUp}
|
onKeyUp={onKeyUp}
|
||||||
onKeyDown={onKeyDown}
|
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
@ -46,7 +35,6 @@ Input.propTypes = {
|
||||||
tabIndex: PropTypes.number,
|
tabIndex: PropTypes.number,
|
||||||
disabled: PropTypes.bool,
|
disabled: PropTypes.bool,
|
||||||
onKeyUp: PropTypes.func,
|
onKeyUp: PropTypes.func,
|
||||||
onKeyDown: PropTypes.func,
|
|
||||||
onSubmit: PropTypes.func
|
onSubmit: PropTypes.func
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
.input-container {
|
.input-container {
|
||||||
--spatial-navigation-action: focus;
|
|
||||||
user-select: text;
|
user-select: text;
|
||||||
|
|
||||||
&::-moz-focus-inner {
|
&::-moz-focus-inner {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue