@tanstack/react-hotkeys
Version:
React adapter for TanStack Hotkeys
36 lines (33 loc) • 1.29 kB
JavaScript
'use client';
import { useDefaultHotkeysOptions } from "./HotkeysProvider.js";
import { useSelector } from "./_useSelector.js";
import { HotkeyRecorder } from "@tanstack/hotkeys";
import { useEffect, useRef } 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();
};
}, []);
return {
isRecording,
steps,
recordedHotkey,
startRecording: () => recorderRef.current?.start(),
stopRecording: () => recorderRef.current?.stop(),
cancelRecording: () => recorderRef.current?.cancel(),
commitRecording: () => recorderRef.current?.commit()
};
}
//#endregion
export { useHotkeyRecorder };