disable keycode back in text area
This commit is contained in:
parent
9a5f69f0eb
commit
629b928c80
2 changed files with 27 additions and 4 deletions
20
ui/effects/use-active-element.js
Normal file
20
ui/effects/use-active-element.js
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
|
||||||
|
export const useActiveElement = () => {
|
||||||
|
const [active, setActive] = useState(document.activeElement);
|
||||||
|
|
||||||
|
const handleFocus = (e) => {
|
||||||
|
setActive(document.activeElement);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
document.addEventListener('focusin', handleFocus);
|
||||||
|
document.addEventListener('focusout', handleFocus);
|
||||||
|
return () => {
|
||||||
|
document.removeEventListener('focusin', handleFocus);
|
||||||
|
document.removeEventListener('focusout', handleFocus);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return active;
|
||||||
|
};
|
|
@ -1,8 +1,9 @@
|
||||||
import { useEffect } from 'react';
|
import { useEffect } from 'react';
|
||||||
|
import { useActiveElement } from './use-active-element';
|
||||||
export default function useHistoryNav(history) {
|
export default function useHistoryNav(history) {
|
||||||
|
const el = useActiveElement(); // disable if we're in a textarea.
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleKeyPress = e => {
|
const handleKeyPress = (e) => {
|
||||||
if ((e.metaKey || e.altKey) && !e.ctrlKey && !e.shiftKey) {
|
if ((e.metaKey || e.altKey) && !e.ctrlKey && !e.shiftKey) {
|
||||||
switch (e.code) {
|
switch (e.code) {
|
||||||
case 'ArrowLeft':
|
case 'ArrowLeft':
|
||||||
|
@ -19,7 +20,9 @@ export default function useHistoryNav(history) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
if (!el.type || (el.type && !el.type.startsWith('text'))) {
|
||||||
window.addEventListener('keydown', handleKeyPress);
|
window.addEventListener('keydown', handleKeyPress);
|
||||||
|
}
|
||||||
return () => window.removeEventListener('keydown', handleKeyPress);
|
return () => window.removeEventListener('keydown', handleKeyPress);
|
||||||
}, []);
|
}, [el]);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue