@airplane/views
Version:
A React library for building Airplane views. Views components are optimized in style and functionality to produce internal apps that are easy to build and maintain.
63 lines (62 loc) • 1.85 kB
JavaScript
import { isArray } from "lodash-es";
import { useMemo, useState, useCallback, useEffect } from "react";
function useKeyPress({
targetKeys,
listenToWindow
}) {
const targetKeysArray = useMemo(() => isArray(targetKeys) ? targetKeys : [targetKeys], [targetKeys]);
const [keyPressed, setKeyPressed] = useState(false);
const [allKeysPressed, setAllKeysPressed] = useState(/* @__PURE__ */ new Set());
const handle = useCallback((keysPressed) => {
const isPressed = targetKeysArray.some((targetKey) => {
if (typeof targetKey === "string") {
return keysPressed.has(targetKey);
}
return targetKey.every((k) => keysPressed.has(k));
});
setKeyPressed(isPressed);
return isPressed;
}, [targetKeysArray]);
const downHandler = useCallback(({
key
}) => {
const newAllKeysPressed = new Set(allKeysPressed);
newAllKeysPressed.add(key);
setAllKeysPressed(newAllKeysPressed);
return handle(newAllKeysPressed);
}, [allKeysPressed, handle]);
const upHandler = useCallback(({
key
}) => {
const newAllKeysPressed = new Set(allKeysPressed);
newAllKeysPressed.delete(key);
setAllKeysPressed(newAllKeysPressed);
return handle(newAllKeysPressed);
}, [allKeysPressed, handle]);
useEffect(() => {
if (!listenToWindow)
return;
window.addEventListener("keydown", downHandler);
window.addEventListener("keyup", upHandler);
return () => {
window.removeEventListener("keydown", downHandler);
window.removeEventListener("keyup", upHandler);
};
}, [downHandler, upHandler, listenToWindow]);
if (!targetKeys) {
return {
keyPressed: false,
upHandler,
downHandler
};
}
return {
keyPressed,
upHandler,
downHandler
};
}
export {
useKeyPress as default
};
//# sourceMappingURL=useKeyPress.js.map