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

React adapter for TanStack Hotkeys

import { useDefaultHotkeysOptions } from "./HotkeysProvider.js";
import { HotkeyRecorder } from "@tanstack/hotkeys";
import { useEffect, useRef } from "react";
import { useSelector } from "@tanstack/react-store";

//#region src/useHotkeyRecorder.ts
function useHotkeyRecorder(options) {
	const mergedOptions = {
		...useDefaultHotkeysOptions().hotkeyRecorder,
		...options
	};
	const recorderRef = useRef(null);
	if (!recorderRef.current) recorderRef.current = new HotkeyRecorder(mergedOptions);
	recorderRef.current.setOptions(mergedOptions);
	const recorder = recorderRef.current;
	const isRecording = useSelector(recorder.store, (state) => state.isRecording);
	const steps = useSelector(recorder.store, (state) => state.steps);
	const recordedHotkey = useSelector(recorder.store, (state) => state.recordedHotkey);
	useEffect(() => {
		return () => {
			recorderRef.current?.destroy();
		};
	}, []);
	return {
		isRecording,
		steps,
		recordedHotkey,
		startRecording: () => recorderRef.current?.start(),
		stopRecording: () => recorderRef.current?.stop(),
		cancelRecording: () => recorderRef.current?.cancel(),
		commitRecording: () => recorderRef.current?.commit()
	};
}

//#endregion
export { useHotkeyRecorder };