@tanstack/react-hotkeys/dist/useHeldKeys.js

React adapter for TanStack Hotkeys

import { getKeyStateTracker } from "@tanstack/hotkeys";
import { useSelector } from "@tanstack/react-store";

//#region src/useHeldKeys.ts
/**
* React hook that returns an array of currently held keyboard keys.
*
* This hook uses `useSelector` from `@tanstack/react-store` to subscribe
* to the global KeyStateTracker and updates whenever keys are pressed
* or released.
*
* @returns Array of currently held key names
*
* @example
* ```tsx
* function KeyDisplay() {
*   const heldKeys = useHeldKeys()
*
*   return (
*     <div>
*       Currently pressed: {heldKeys.join(' + ') || 'None'}
*     </div>
*   )
* }
* ```
*/
function useHeldKeys() {
	const tracker = getKeyStateTracker();
	return useSelector(tracker.store, (state) => state.heldKeys);
}

//#endregion
export { useHeldKeys };