suranadira-utils/src/keyboard.js

Suranadira utilities

import { useEffect, useState } from "react";
import { addUID } from "./string";

export const useKeyDown = () => {
  const [key, setKey] = useState("");

  useEffect(() => {
    const setFromEvent = e => {
      setKey(addUID(e.key));
    };
    window.addEventListener("keydown", setFromEvent);

    return () => {
      window.removeEventListener("keydown", setFromEvent);
    };
  }, []);

  return key;
};

export const useKeyUp = () => {
  const [key, setKey] = useState("");

  useEffect(() => {
    const setFromEvent = e => {
      setKey(addUID(e.key));
    };
    window.addEventListener("keyup", setFromEvent);

    return () => {
      window.removeEventListener("keyup", setFromEvent);
    };
  }, []);

  return key;
};