import { useState } from 'react' import { useShortcut } from './useShortcut' import './styles.css' export default function App() { const [count, setCount] = useState(0) const handleKonamiCode = () => { if (document.getElementById('ps1')) { document.getElementById('ps1').remove() } else { const link = document.createElement('link') link.id = 'ps1' link.rel = 'stylesheet' link.type = 'text/css' link.href = 'https://cdn.jsdelivr.net/gh/98mprice/PSone.css@master/PSone.min.css' document.head.append(link) } } const shortcuts = { w: () => setCount(count + count), a: () => setCount((prev) => prev + 1), s: () => setCount((prev) => (prev > 1 ? prev - 1 : 0)), d: () => setCount(0), 'Control+c': () => setCount((prev) => prev + 10), 'Command+z': () => setCount((prev) => prev + 20), 'Command+Shift+x': () => setCount((prev) => prev + 30), 'ArrowUp+ArrowUp+ArrowDown+ArrowDown+ArrowLeft+ArrowRight+ArrowLeft+ArrowRight+b+a': handleKonamiCode, } Object.entries(shortcuts).forEach(([shortcut, callback]) => { useShortcut(shortcut, callback) }) return (

useShortcut

Instructions

Press A to increase the count.

Press S to decrease the count.

Press D to clear the count.

Press W to add count + count.

Press Control + C increase the count by 10.

Press Command + Z increase the count by 20.

Press Command + Shift + X to increase the count by 30.

Input the Konami code...

Editable Components

Type any shortcut key without running the shortcut.

Input

Textarea