react-use-record-hotkey
Version:
45 lines (44 loc) • 1.25 kB
TypeScript
import React from 'react';
export interface Options {
onClean?: () => void;
onConfirm?: (validHotkey: Set<string>) => void;
/**
* 是否键入回车键后开始录制
* @default true
*/
startOnEnter?: boolean;
}
/**
* Record hotkey from input element
* @see https://github.com/Wxh16144/react-record-hotkey.git
* @example
* ```tsx
* const [inputRef, keys, { start, stop, isRecording }] = useRecordHotkey({
* onClean: () => {
* console.log('Clean');
* },
* onConfirm: (hotkey) => {
* console.log(`Hotkey: ${Array.from(hotkey).join('+')}`);
* },
* });
*
* const hotkey = Array.from(keys).join('+');
*
* return (
* <div>
* <input ref={inputRef} autoFocus readOnly value={hotkey} />
* <button onClick={start}>Start</button>
* <button onClick={stop}>Stop</button>
* <p>Recording: {isRecording ? 'Yes' : 'No'}</p>
* <p>Hotkey: {hotkey}</p>
* </div>
* );
* ```
**/
declare const useRecordHotkey: <InputEL extends HTMLInputElement>(opt?: Options) => readonly [React.MutableRefObject<InputEL | null>, Set<string>, {
readonly start: () => void;
readonly stop: () => void;
readonly reset: () => void;
readonly isRecording: boolean;
}];
export default useRecordHotkey;