mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-25 04:46:40 +07:00
made simple tiny slider
This commit is contained in:
parent
5da9a0547d
commit
3808f2f516
7 changed files with 95 additions and 36 deletions
23
src/utils/hooks/keys.ts
Normal file
23
src/utils/hooks/keys.ts
Normal file
|
@ -0,0 +1,23 @@
|
|||
import { useCallback, useEffect } from 'react';
|
||||
|
||||
export const useArrows = (onNext: () => void, onPrev: () => void, locked) => {
|
||||
const onKeyDown = useCallback(
|
||||
event => {
|
||||
if ((event.target.tagName && ['TEXTAREA', 'INPUT'].includes(event.target.tagName)) || locked)
|
||||
return;
|
||||
|
||||
switch (event.key) {
|
||||
case 'ArrowLeft':
|
||||
return onPrev();
|
||||
case 'ArrowRight':
|
||||
return onNext();
|
||||
}
|
||||
},
|
||||
[onNext, onPrev, locked]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener('keydown', onKeyDown);
|
||||
return () => window.removeEventListener('keydown', onKeyDown);
|
||||
}, [onKeyDown]);
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue