usekeyboard-react/dist/usekeyboard-react.es.js

UseKeyBoard is a React library that executes code depending on the key pressed.

import { useCallback as f, useEffect as c } from "react";
const d = ({ config: s }) => {
  const { keys: i, debug: n, dependencies: l } = s, t = f((o) => {
    i.forEach((e) => {
      if (e.key === "|" && o.key === e.key) {
        e.fn(o);
        return;
      }
      if (e.key.includes("|")) {
        const r = e.key.split("|").filter((y) => y);
        if (r.length < 2)
          return;
        r.includes(o.key) && e.fn(o);
        return;
      }
      if (o.key === e.key) {
        e.fn(o);
        return;
      }
    });
  }, l);
  return c(() => (window.addEventListener("keydown", t), () => {
    window.removeEventListener("keydown", t);
  }), [t]), c(() => {
    if (n && i.length > 0) {
      i.forEach((o) => {
        if (o.key === "|") {
          console.log(
            `Key %c${o.key}%c loaded ✅.`,
            "color: #09f",
            "color: initial"
          );
          return;
        }
        if (o.key.includes("|")) {
          const e = o.key.split("|").filter((r) => r);
          if (e.length < 2) {
            console.log(
              `If you use the key field with | it is to pass multiple keys with the same function. I regret to inform you that the key %c${o.key}%c was not loaded successfully ❌.`,
              "color: red",
              "color: initial"
            );
            return;
          }
          e.forEach(
            (r) => console.log(
              `Key %c${r}%c loaded ✅.`,
              "color: #09f",
              "color: initial"
            )
          );
          return;
        }
        console.log(
          `Key %c${o.key}%c loaded ✅.`,
          "color: #09f",
          "color: initial"
        );
      });
      return;
    }
    if (n && i.length === 0)
      return console.log("No keys have been added to the key Array ✅.");
  }, []), {};
};
export {
  d as useKeyBoard
};