usekeyboard-react
Version:
UseKeyBoard is a React library that executes code depending on the key pressed.
2 lines (1 loc) • 1.48 kB
JavaScript
(function(i,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],t):(i=typeof globalThis<"u"?globalThis:i||self,t(i["usekeyboard-react"]={},i.React))})(this,function(i,t){"use strict";const f=({config:u})=>{const{keys:n,debug:c,dependencies:d}=u,s=t.useCallback(e=>{n.forEach(o=>{if(o.key==="|"&&e.key===o.key){o.fn(e);return}if(o.key.includes("|")){const r=o.key.split("|").filter(l=>l);if(r.length<2)return;r.includes(e.key)&&o.fn(e);return}if(e.key===o.key){o.fn(e);return}})},d);return t.useEffect(()=>(window.addEventListener("keydown",s),()=>{window.removeEventListener("keydown",s)}),[s]),t.useEffect(()=>{if(c&&n.length>0){n.forEach(e=>{if(e.key==="|"){console.log(`Key %c${e.key}%c loaded ✅.`,"color: #09f","color: initial");return}if(e.key.includes("|")){const o=e.key.split("|").filter(r=>r);if(o.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${e.key}%c was not loaded successfully ❌.`,"color: red","color: initial");return}o.forEach(r=>console.log(`Key %c${r}%c loaded ✅.`,"color: #09f","color: initial"));return}console.log(`Key %c${e.key}%c loaded ✅.`,"color: #09f","color: initial")});return}if(c&&n.length===0)return console.log("No keys have been added to the key Array ✅.")},[]),{}};i.useKeyBoard=f,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});