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

React adapter for TanStack Hotkeys

'use client';

import { useDefaultHotkeysOptions } from "./HotkeysProvider.js";
import { useSelector } from "./_useSelector.js";
import { HotkeyRecorder } from "@tanstack/hotkeys";
import { useEffect, useRef, useState } from "react";
import { withDefaults } from "@tanstack/hotkeys/adapter";

//#region src/useHotkeyRecorder.ts
function useHotkeyRecorder(options) {
	const mergedOptions = withDefaults(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();
		};
	}, []);
	const [actions] = useState(() => ({
		startRecording: () => recorderRef.current?.start(),
		stopRecording: () => recorderRef.current?.stop(),
		cancelRecording: () => recorderRef.current?.cancel(),
		commitRecording: () => recorderRef.current?.commit()
	}));
	return {
		isRecording,
		steps,
		recordedHotkey,
		...actions
	};
}

//#endregion
export { useHotkeyRecorder };