You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
import {Dispatch, SetStateAction, useEffect, useMemo, useState} from "react";
export function useKey(keys: string | string[], func: () => void, deps: any[] = []) { useEffect(() => { const f = (ev: KeyboardEvent) => { const fixedKey = Array.isArray(keys) ? keys : [keys];
if (fixedKey.includes(ev.key)) { func(); } };
window.addEventListener("keydown", f);
return () => { window.removeEventListener("keydown", f); }; }, [keys, func, ...deps]); }
export function usePlusMinus(length: number): [number, Dispatch<SetStateAction<number>>] { const [current, setCurrent] = useState(0);
useKey("-", () => setCurrent(prev => prev <= 0 ? length - 1 : prev - 1), [length]); useKey("+", () => setCurrent(prev => prev >= length - 1 ? 0 : prev + 1), [length]);
useEffect(() => { if (current < 0) { setCurrent(0); } else if (current > length - 1) { setCurrent(length - 1); } }, [length]);
return [current, setCurrent]; }
|