@tanstack/vue-hotkeys 0.5.1 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"HotkeysProviderContext.cjs","names":[],"sources":["../src/HotkeysProviderContext.ts"],"sourcesContent":["import { inject, provide } from 'vue'\nimport type { InjectionKey } from 'vue'\nimport type { HotkeyRecorderOptions } from '@tanstack/hotkeys'\nimport type { UseHotkeyOptions } from './useHotkey'\nimport type { UseHotkeySequenceOptions } from './useHotkeySequence'\n\nexport interface HotkeysProviderOptions {\n hotkey?: Partial<UseHotkeyOptions>\n hotkeyRecorder?: Partial<HotkeyRecorderOptions>\n hotkeySequence?: Partial<UseHotkeySequenceOptions>\n}\n\ninterface HotkeysContextValue {\n defaultOptions: HotkeysProviderOptions\n}\n\nconst HotkeysContext: InjectionKey<HotkeysContextValue> =\n Symbol('HotkeysContext')\n\nconst DEFAULT_OPTIONS: HotkeysProviderOptions = {}\n\nexport function provideHotkeysContext(defaultOptions?: HotkeysProviderOptions) {\n const contextValue: HotkeysContextValue = {\n defaultOptions: defaultOptions ?? DEFAULT_OPTIONS,\n }\n\n provide(HotkeysContext, contextValue)\n}\n\nexport function useHotkeysContext() {\n return inject(HotkeysContext, null)\n}\n\nexport function useDefaultHotkeysOptions() {\n const context = inject(HotkeysContext, null)\n return context?.defaultOptions ?? {}\n}\n"],"mappings":";;;AAgBA,MAAM,iBACJ,OAAO,iBAAiB;AAE1B,MAAM,kBAA0C,EAAE;AAElD,SAAgB,sBAAsB,gBAAyC;AAK7E,kBAAQ,gBAJkC,EACxC,gBAAgB,kBAAkB,iBACnC,CAEoC;;AAGvC,SAAgB,oBAAoB;AAClC,wBAAc,gBAAgB,KAAK;;AAGrC,SAAgB,2BAA2B;AAEzC,wBADuB,gBAAgB,KAAK,EAC5B,kBAAkB,EAAE"}
1
+ {"version":3,"file":"HotkeysProviderContext.cjs","names":[],"sources":["../src/HotkeysProviderContext.ts"],"sourcesContent":["import { inject, provide } from 'vue'\nimport type { InjectionKey } from 'vue'\nimport type {\n HotkeyRecorderOptions,\n HotkeySequenceRecorderOptions,\n} from '@tanstack/hotkeys'\nimport type { UseHotkeyOptions } from './useHotkey'\nimport type { UseHotkeySequenceOptions } from './useHotkeySequence'\n\nexport interface HotkeysProviderOptions {\n hotkey?: Partial<UseHotkeyOptions>\n hotkeyRecorder?: Partial<HotkeyRecorderOptions>\n hotkeySequenceRecorder?: Partial<HotkeySequenceRecorderOptions>\n hotkeySequence?: Partial<UseHotkeySequenceOptions>\n}\n\ninterface HotkeysContextValue {\n defaultOptions: HotkeysProviderOptions\n}\n\nconst HotkeysContext: InjectionKey<HotkeysContextValue> =\n Symbol('HotkeysContext')\n\nconst DEFAULT_OPTIONS: HotkeysProviderOptions = {}\n\nexport function provideHotkeysContext(defaultOptions?: HotkeysProviderOptions) {\n const contextValue: HotkeysContextValue = {\n defaultOptions: defaultOptions ?? DEFAULT_OPTIONS,\n }\n\n provide(HotkeysContext, contextValue)\n}\n\nexport function useHotkeysContext() {\n return inject(HotkeysContext, null)\n}\n\nexport function useDefaultHotkeysOptions() {\n const context = inject(HotkeysContext, null)\n return context?.defaultOptions ?? {}\n}\n"],"mappings":";;;AAoBA,MAAM,iBACJ,OAAO,iBAAiB;AAE1B,MAAM,kBAA0C,EAAE;AAElD,SAAgB,sBAAsB,gBAAyC;AAK7E,kBAAQ,gBAJkC,EACxC,gBAAgB,kBAAkB,iBACnC,CAEoC;;AAGvC,SAAgB,oBAAoB;AAClC,wBAAc,gBAAgB,KAAK;;AAGrC,SAAgB,2BAA2B;AAEzC,wBADuB,gBAAgB,KAAK,EAC5B,kBAAkB,EAAE"}
@@ -1,11 +1,12 @@
1
1
  import { UseHotkeyOptions } from "./useHotkey.cjs";
2
2
  import { UseHotkeySequenceOptions } from "./useHotkeySequence.cjs";
3
- import { HotkeyRecorderOptions } from "@tanstack/hotkeys";
3
+ import { HotkeyRecorderOptions, HotkeySequenceRecorderOptions } from "@tanstack/hotkeys";
4
4
 
5
5
  //#region src/HotkeysProviderContext.d.ts
6
6
  interface HotkeysProviderOptions {
7
7
  hotkey?: Partial<UseHotkeyOptions>;
8
8
  hotkeyRecorder?: Partial<HotkeyRecorderOptions>;
9
+ hotkeySequenceRecorder?: Partial<HotkeySequenceRecorderOptions>;
9
10
  hotkeySequence?: Partial<UseHotkeySequenceOptions>;
10
11
  }
11
12
  interface HotkeysContextValue {
@@ -1,11 +1,12 @@
1
1
  import { UseHotkeyOptions } from "./useHotkey.js";
2
2
  import { UseHotkeySequenceOptions } from "./useHotkeySequence.js";
3
- import { HotkeyRecorderOptions } from "@tanstack/hotkeys";
3
+ import { HotkeyRecorderOptions, HotkeySequenceRecorderOptions } from "@tanstack/hotkeys";
4
4
 
5
5
  //#region src/HotkeysProviderContext.d.ts
6
6
  interface HotkeysProviderOptions {
7
7
  hotkey?: Partial<UseHotkeyOptions>;
8
8
  hotkeyRecorder?: Partial<HotkeyRecorderOptions>;
9
+ hotkeySequenceRecorder?: Partial<HotkeySequenceRecorderOptions>;
9
10
  hotkeySequence?: Partial<UseHotkeySequenceOptions>;
10
11
  }
11
12
  interface HotkeysContextValue {
@@ -1 +1 @@
1
- {"version":3,"file":"HotkeysProviderContext.js","names":[],"sources":["../src/HotkeysProviderContext.ts"],"sourcesContent":["import { inject, provide } from 'vue'\nimport type { InjectionKey } from 'vue'\nimport type { HotkeyRecorderOptions } from '@tanstack/hotkeys'\nimport type { UseHotkeyOptions } from './useHotkey'\nimport type { UseHotkeySequenceOptions } from './useHotkeySequence'\n\nexport interface HotkeysProviderOptions {\n hotkey?: Partial<UseHotkeyOptions>\n hotkeyRecorder?: Partial<HotkeyRecorderOptions>\n hotkeySequence?: Partial<UseHotkeySequenceOptions>\n}\n\ninterface HotkeysContextValue {\n defaultOptions: HotkeysProviderOptions\n}\n\nconst HotkeysContext: InjectionKey<HotkeysContextValue> =\n Symbol('HotkeysContext')\n\nconst DEFAULT_OPTIONS: HotkeysProviderOptions = {}\n\nexport function provideHotkeysContext(defaultOptions?: HotkeysProviderOptions) {\n const contextValue: HotkeysContextValue = {\n defaultOptions: defaultOptions ?? DEFAULT_OPTIONS,\n }\n\n provide(HotkeysContext, contextValue)\n}\n\nexport function useHotkeysContext() {\n return inject(HotkeysContext, null)\n}\n\nexport function useDefaultHotkeysOptions() {\n const context = inject(HotkeysContext, null)\n return context?.defaultOptions ?? {}\n}\n"],"mappings":";;;AAgBA,MAAM,iBACJ,OAAO,iBAAiB;AAE1B,MAAM,kBAA0C,EAAE;AAElD,SAAgB,sBAAsB,gBAAyC;AAK7E,SAAQ,gBAJkC,EACxC,gBAAgB,kBAAkB,iBACnC,CAEoC;;AAGvC,SAAgB,oBAAoB;AAClC,QAAO,OAAO,gBAAgB,KAAK;;AAGrC,SAAgB,2BAA2B;AAEzC,QADgB,OAAO,gBAAgB,KAAK,EAC5B,kBAAkB,EAAE"}
1
+ {"version":3,"file":"HotkeysProviderContext.js","names":[],"sources":["../src/HotkeysProviderContext.ts"],"sourcesContent":["import { inject, provide } from 'vue'\nimport type { InjectionKey } from 'vue'\nimport type {\n HotkeyRecorderOptions,\n HotkeySequenceRecorderOptions,\n} from '@tanstack/hotkeys'\nimport type { UseHotkeyOptions } from './useHotkey'\nimport type { UseHotkeySequenceOptions } from './useHotkeySequence'\n\nexport interface HotkeysProviderOptions {\n hotkey?: Partial<UseHotkeyOptions>\n hotkeyRecorder?: Partial<HotkeyRecorderOptions>\n hotkeySequenceRecorder?: Partial<HotkeySequenceRecorderOptions>\n hotkeySequence?: Partial<UseHotkeySequenceOptions>\n}\n\ninterface HotkeysContextValue {\n defaultOptions: HotkeysProviderOptions\n}\n\nconst HotkeysContext: InjectionKey<HotkeysContextValue> =\n Symbol('HotkeysContext')\n\nconst DEFAULT_OPTIONS: HotkeysProviderOptions = {}\n\nexport function provideHotkeysContext(defaultOptions?: HotkeysProviderOptions) {\n const contextValue: HotkeysContextValue = {\n defaultOptions: defaultOptions ?? DEFAULT_OPTIONS,\n }\n\n provide(HotkeysContext, contextValue)\n}\n\nexport function useHotkeysContext() {\n return inject(HotkeysContext, null)\n}\n\nexport function useDefaultHotkeysOptions() {\n const context = inject(HotkeysContext, null)\n return context?.defaultOptions ?? {}\n}\n"],"mappings":";;;AAoBA,MAAM,iBACJ,OAAO,iBAAiB;AAE1B,MAAM,kBAA0C,EAAE;AAElD,SAAgB,sBAAsB,gBAAyC;AAK7E,SAAQ,gBAJkC,EACxC,gBAAgB,kBAAkB,iBACnC,CAEoC;;AAGvC,SAAgB,oBAAoB;AAClC,QAAO,OAAO,gBAAgB,KAAK;;AAGrC,SAAgB,2BAA2B;AAEzC,QADgB,OAAO,gBAAgB,KAAK,EAC5B,kBAAkB,EAAE"}
package/dist/index.cjs CHANGED
@@ -7,7 +7,9 @@ const require_useHeldKeys = require('./useHeldKeys.cjs');
7
7
  const require_useHeldKeyCodes = require('./useHeldKeyCodes.cjs');
8
8
  const require_useKeyHold = require('./useKeyHold.cjs');
9
9
  const require_useHotkeySequence = require('./useHotkeySequence.cjs');
10
+ const require_useHotkeySequences = require('./useHotkeySequences.cjs');
10
11
  const require_useHotkeyRecorder = require('./useHotkeyRecorder.cjs');
12
+ const require_useHotkeySequenceRecorder = require('./useHotkeySequenceRecorder.cjs');
11
13
 
12
14
  exports.HotkeysProvider = require_HotkeysProvider.HotkeysProvider;
13
15
  exports.provideHotkeysContext = require_HotkeysProviderContext.provideHotkeysContext;
@@ -17,6 +19,8 @@ exports.useHeldKeys = require_useHeldKeys.useHeldKeys;
17
19
  exports.useHotkey = require_useHotkey.useHotkey;
18
20
  exports.useHotkeyRecorder = require_useHotkeyRecorder.useHotkeyRecorder;
19
21
  exports.useHotkeySequence = require_useHotkeySequence.useHotkeySequence;
22
+ exports.useHotkeySequenceRecorder = require_useHotkeySequenceRecorder.useHotkeySequenceRecorder;
23
+ exports.useHotkeySequences = require_useHotkeySequences.useHotkeySequences;
20
24
  exports.useHotkeys = require_useHotkeys.useHotkeys;
21
25
  exports.useHotkeysContext = require_HotkeysProviderContext.useHotkeysContext;
22
26
  exports.useKeyHold = require_useKeyHold.useKeyHold;
package/dist/index.d.cts CHANGED
@@ -6,6 +6,8 @@ import { UseHotkeyDefinition, useHotkeys } from "./useHotkeys.cjs";
6
6
  import { useHeldKeys } from "./useHeldKeys.cjs";
7
7
  import { useHeldKeyCodes } from "./useHeldKeyCodes.cjs";
8
8
  import { useKeyHold } from "./useKeyHold.cjs";
9
+ import { UseHotkeySequenceDefinition, useHotkeySequences } from "./useHotkeySequences.cjs";
9
10
  import { VueHotkeyRecorder, useHotkeyRecorder } from "./useHotkeyRecorder.cjs";
11
+ import { VueHotkeySequenceRecorder, useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.cjs";
10
12
  export * from "@tanstack/hotkeys";
11
- export { HotkeysProvider, HotkeysProviderOptions, UseHotkeyDefinition, UseHotkeyOptions, UseHotkeySequenceOptions, VueHotkeyRecorder, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeys, useHotkeysContext, useKeyHold };
13
+ export { HotkeysProvider, HotkeysProviderOptions, UseHotkeyDefinition, UseHotkeyOptions, UseHotkeySequenceDefinition, UseHotkeySequenceOptions, VueHotkeyRecorder, VueHotkeySequenceRecorder, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeySequenceRecorder, useHotkeySequences, useHotkeys, useHotkeysContext, useKeyHold };
package/dist/index.d.ts CHANGED
@@ -6,6 +6,8 @@ import { UseHotkeyDefinition, useHotkeys } from "./useHotkeys.js";
6
6
  import { useHeldKeys } from "./useHeldKeys.js";
7
7
  import { useHeldKeyCodes } from "./useHeldKeyCodes.js";
8
8
  import { useKeyHold } from "./useKeyHold.js";
9
+ import { UseHotkeySequenceDefinition, useHotkeySequences } from "./useHotkeySequences.js";
9
10
  import { VueHotkeyRecorder, useHotkeyRecorder } from "./useHotkeyRecorder.js";
11
+ import { VueHotkeySequenceRecorder, useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
10
12
  export * from "@tanstack/hotkeys";
11
- export { HotkeysProvider, HotkeysProviderOptions, UseHotkeyDefinition, UseHotkeyOptions, UseHotkeySequenceOptions, VueHotkeyRecorder, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeys, useHotkeysContext, useKeyHold };
13
+ export { HotkeysProvider, HotkeysProviderOptions, UseHotkeyDefinition, UseHotkeyOptions, UseHotkeySequenceDefinition, UseHotkeySequenceOptions, VueHotkeyRecorder, VueHotkeySequenceRecorder, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeySequenceRecorder, useHotkeySequences, useHotkeys, useHotkeysContext, useKeyHold };
package/dist/index.js CHANGED
@@ -6,8 +6,10 @@ import { useHeldKeys } from "./useHeldKeys.js";
6
6
  import { useHeldKeyCodes } from "./useHeldKeyCodes.js";
7
7
  import { useKeyHold } from "./useKeyHold.js";
8
8
  import { useHotkeySequence } from "./useHotkeySequence.js";
9
+ import { useHotkeySequences } from "./useHotkeySequences.js";
9
10
  import { useHotkeyRecorder } from "./useHotkeyRecorder.js";
11
+ import { useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
10
12
 
11
13
  export * from "@tanstack/hotkeys"
12
14
 
13
- export { HotkeysProvider, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeys, useHotkeysContext, useKeyHold };
15
+ export { HotkeysProvider, provideHotkeysContext, useDefaultHotkeysOptions, useHeldKeyCodes, useHeldKeys, useHotkey, useHotkeyRecorder, useHotkeySequence, useHotkeySequenceRecorder, useHotkeySequences, useHotkeys, useHotkeysContext, useKeyHold };
@@ -71,6 +71,8 @@ function useHotkey(hotkey, callback, options = {}) {
71
71
  const defaultOptions = require_HotkeysProviderContext.useDefaultHotkeysOptions();
72
72
  const manager = (0, _tanstack_hotkeys.getHotkeyManager)();
73
73
  let registration = null;
74
+ let lastHotkeyString = null;
75
+ let lastTarget = null;
74
76
  const stopWatcher = (0, vue.watch)(() => {
75
77
  const resolvedHotkey = resolveMaybeRefOrGetter(hotkey);
76
78
  const resolvedOptions = resolveMaybeRefOrGetter(options);
@@ -87,17 +89,30 @@ function useHotkey(hotkey, callback, options = {}) {
87
89
  }, ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {
88
90
  const platform = mergedOptions.platform ?? (0, _tanstack_hotkeys.detectPlatform)();
89
91
  const hotkeyString = typeof resolvedHotkey === "string" ? resolvedHotkey : (0, _tanstack_hotkeys.formatHotkey)((0, _tanstack_hotkeys.rawHotkeyToParsedHotkey)(resolvedHotkey, platform));
90
- const finalTarget = resolvedTarget ?? (typeof document !== "undefined" ? document : null);
91
- if (!finalTarget) return;
92
- if (registration?.isActive) {
93
- registration.unregister();
94
- registration = null;
92
+ const finalTarget = resolvedTarget === void 0 ? typeof document !== "undefined" ? document : null : resolvedTarget;
93
+ if (!finalTarget) {
94
+ if (registration?.isActive) {
95
+ registration.unregister();
96
+ registration = null;
97
+ }
98
+ lastHotkeyString = null;
99
+ lastTarget = null;
100
+ return;
95
101
  }
96
102
  const { target: _target, enabled: _enabled, ...restOptions } = mergedOptions;
97
103
  const optionsWithoutTarget = {
98
104
  ...restOptions,
99
105
  ...resolvedEnabled === void 0 ? {} : { enabled: resolvedEnabled }
100
106
  };
107
+ if (registration?.isActive && lastHotkeyString === hotkeyString && lastTarget === finalTarget) {
108
+ registration.callback = callback;
109
+ registration.setOptions(optionsWithoutTarget);
110
+ return;
111
+ }
112
+ if (registration?.isActive) {
113
+ registration.unregister();
114
+ registration = null;
115
+ }
101
116
  registration = manager.register(hotkeyString, callback, {
102
117
  ...optionsWithoutTarget,
103
118
  target: finalTarget
@@ -106,6 +121,8 @@ function useHotkey(hotkey, callback, options = {}) {
106
121
  registration.callback = callback;
107
122
  registration.setOptions(optionsWithoutTarget);
108
123
  }
124
+ lastHotkeyString = hotkeyString;
125
+ lastTarget = finalTarget;
109
126
  }, { immediate: true });
110
127
  (0, vue.onUnmounted)(() => {
111
128
  stopWatcher();
@@ -1 +1 @@
1
- {"version":3,"file":"useHotkey.cjs","names":["useDefaultHotkeysOptions"],"sources":["../src/useHotkey.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport {\n detectPlatform,\n formatHotkey,\n getHotkeyManager,\n rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type {\n Hotkey,\n HotkeyCallback,\n HotkeyOptions,\n HotkeyRegistrationHandle,\n RegisterableHotkey,\n} from '@tanstack/hotkeys'\nimport type { MaybeRefOrGetter } from 'vue'\n\nexport interface UseHotkeyOptions extends Omit<\n HotkeyOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the hotkey is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This composable automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const count = ref(0)\n *\n * // Callback always has access to latest count value\n * useHotkey('Mod+S', (event, { hotkey }) => {\n * console.log(`Save triggered, count is ${count.value}`)\n * handleSave()\n * })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const isOpen = ref(false)\n *\n * // enabled option is reactive\n * useHotkey('Escape', () => {\n * isOpen.value = false\n * }, { enabled: isOpen })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const editorRef = ref<HTMLDivElement | null>(null)\n *\n * // Scoped to a specific element\n * useHotkey('Mod+S', () => {\n * save()\n * }, { target: editorRef })\n * </script>\n *\n * <template>\n * <div ref=\"editorRef\">...</div>\n * </template>\n * ```\n */\nexport function useHotkey(\n hotkey: MaybeRefOrGetter<RegisterableHotkey>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeyOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getHotkeyManager()\n\n let registration: HotkeyRegistrationHandle | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedHotkey = resolveMaybeRefOrGetter(hotkey)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkey,\n ...resolvedOptions,\n } as UseHotkeyOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedHotkey,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n // Normalize to hotkey string\n const platform = mergedOptions.platform ?? detectPlatform()\n const hotkeyString: Hotkey =\n typeof resolvedHotkey === 'string'\n ? resolvedHotkey\n : (formatHotkey(\n rawHotkeyToParsedHotkey(resolvedHotkey as any, platform),\n ) as Hotkey)\n\n // Resolve target\n const finalTarget =\n resolvedTarget ?? (typeof document !== 'undefined' ? document : null)\n\n if (!finalTarget) {\n return\n }\n\n // Unregister previous registration if it exists\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n // Register the hotkey\n registration = manager.register(hotkeyString, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n // Update callback and options\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGA,SAAgB,UACd,QACA,UACA,UAA8C,EAAE,EAC1C;CACN,MAAM,iBAAiBA,yDAA0B;CACjD,MAAM,mDAA4B;CAElC,IAAI,eAAgD;CAGpD,MAAM,mCACE;EACJ,MAAM,iBAAiB,wBAAwB,OAAO;EACtD,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,gBAAgB,eAAe,iBAAiB,qBAAqB;EAEtE,MAAM,WAAW,cAAc,mDAA4B;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,oGAE0B,gBAAuB,SAAS,CACzD;EAGP,MAAM,cACJ,mBAAmB,OAAO,aAAa,cAAc,WAAW;AAElE,MAAI,CAAC,YACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAGD,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;IAGjD,EAAE,WAAW,MAAM,CACpB;AAGD,4BAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,kBAAS,MAAM"}
1
+ {"version":3,"file":"useHotkey.cjs","names":["useDefaultHotkeysOptions"],"sources":["../src/useHotkey.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport {\n detectPlatform,\n formatHotkey,\n getHotkeyManager,\n rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type {\n Hotkey,\n HotkeyCallback,\n HotkeyOptions,\n HotkeyRegistrationHandle,\n RegisterableHotkey,\n} from '@tanstack/hotkeys'\nimport type { MaybeRefOrGetter } from 'vue'\n\nexport interface UseHotkeyOptions extends Omit<\n HotkeyOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the hotkey is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This composable automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const count = ref(0)\n *\n * // Callback always has access to latest count value\n * useHotkey('Mod+S', (event, { hotkey }) => {\n * console.log(`Save triggered, count is ${count.value}`)\n * handleSave()\n * })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const isOpen = ref(false)\n *\n * // enabled option is reactive\n * useHotkey('Escape', () => {\n * isOpen.value = false\n * }, { enabled: isOpen })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const editorRef = ref<HTMLDivElement | null>(null)\n *\n * // Scoped to a specific element\n * useHotkey('Mod+S', () => {\n * save()\n * }, { target: editorRef })\n * </script>\n *\n * <template>\n * <div ref=\"editorRef\">...</div>\n * </template>\n * ```\n */\nexport function useHotkey(\n hotkey: MaybeRefOrGetter<RegisterableHotkey>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeyOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getHotkeyManager()\n\n let registration: HotkeyRegistrationHandle | null = null\n let lastHotkeyString: Hotkey | null = null\n let lastTarget: HTMLElement | Document | Window | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedHotkey = resolveMaybeRefOrGetter(hotkey)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkey,\n ...resolvedOptions,\n } as UseHotkeyOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedHotkey,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n // Normalize to hotkey string\n const platform = mergedOptions.platform ?? detectPlatform()\n const hotkeyString: Hotkey =\n typeof resolvedHotkey === 'string'\n ? resolvedHotkey\n : (formatHotkey(\n rawHotkeyToParsedHotkey(resolvedHotkey as any, platform),\n ) as Hotkey)\n\n // Resolve target\n const finalTarget =\n resolvedTarget === undefined\n ? typeof document !== 'undefined'\n ? document\n : null\n : resolvedTarget\n\n if (!finalTarget) {\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n lastHotkeyString = null\n lastTarget = null\n return\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n if (\n registration?.isActive &&\n lastHotkeyString === hotkeyString &&\n lastTarget === finalTarget\n ) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n return\n }\n\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n registration = manager.register(hotkeyString, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n\n lastHotkeyString = hotkeyString\n lastTarget = finalTarget\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGA,SAAgB,UACd,QACA,UACA,UAA8C,EAAE,EAC1C;CACN,MAAM,iBAAiBA,yDAA0B;CACjD,MAAM,mDAA4B;CAElC,IAAI,eAAgD;CACpD,IAAI,mBAAkC;CACtC,IAAI,aAAqD;CAGzD,MAAM,mCACE;EACJ,MAAM,iBAAiB,wBAAwB,OAAO;EACtD,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,gBAAgB,eAAe,iBAAiB,qBAAqB;EAEtE,MAAM,WAAW,cAAc,mDAA4B;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,oGAE0B,gBAAuB,SAAS,CACzD;EAGP,MAAM,cACJ,mBAAmB,SACf,OAAO,aAAa,cAClB,WACA,OACF;AAEN,MAAI,CAAC,aAAa;AAChB,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;AAEjB,sBAAmB;AACnB,gBAAa;AACb;;EAIF,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAED,MACE,cAAc,YACd,qBAAqB,gBACrB,eAAe,aACf;AACA,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;AAC7C;;AAGF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;AAGjB,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAEF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAG/C,qBAAmB;AACnB,eAAa;IAEf,EAAE,WAAW,MAAM,CACpB;AAGD,4BAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,kBAAS,MAAM"}
package/dist/useHotkey.js CHANGED
@@ -71,6 +71,8 @@ function useHotkey(hotkey, callback, options = {}) {
71
71
  const defaultOptions = useDefaultHotkeysOptions();
72
72
  const manager = getHotkeyManager();
73
73
  let registration = null;
74
+ let lastHotkeyString = null;
75
+ let lastTarget = null;
74
76
  const stopWatcher = watch(() => {
75
77
  const resolvedHotkey = resolveMaybeRefOrGetter(hotkey);
76
78
  const resolvedOptions = resolveMaybeRefOrGetter(options);
@@ -87,17 +89,30 @@ function useHotkey(hotkey, callback, options = {}) {
87
89
  }, ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {
88
90
  const platform = mergedOptions.platform ?? detectPlatform();
89
91
  const hotkeyString = typeof resolvedHotkey === "string" ? resolvedHotkey : formatHotkey(rawHotkeyToParsedHotkey(resolvedHotkey, platform));
90
- const finalTarget = resolvedTarget ?? (typeof document !== "undefined" ? document : null);
91
- if (!finalTarget) return;
92
- if (registration?.isActive) {
93
- registration.unregister();
94
- registration = null;
92
+ const finalTarget = resolvedTarget === void 0 ? typeof document !== "undefined" ? document : null : resolvedTarget;
93
+ if (!finalTarget) {
94
+ if (registration?.isActive) {
95
+ registration.unregister();
96
+ registration = null;
97
+ }
98
+ lastHotkeyString = null;
99
+ lastTarget = null;
100
+ return;
95
101
  }
96
102
  const { target: _target, enabled: _enabled, ...restOptions } = mergedOptions;
97
103
  const optionsWithoutTarget = {
98
104
  ...restOptions,
99
105
  ...resolvedEnabled === void 0 ? {} : { enabled: resolvedEnabled }
100
106
  };
107
+ if (registration?.isActive && lastHotkeyString === hotkeyString && lastTarget === finalTarget) {
108
+ registration.callback = callback;
109
+ registration.setOptions(optionsWithoutTarget);
110
+ return;
111
+ }
112
+ if (registration?.isActive) {
113
+ registration.unregister();
114
+ registration = null;
115
+ }
101
116
  registration = manager.register(hotkeyString, callback, {
102
117
  ...optionsWithoutTarget,
103
118
  target: finalTarget
@@ -106,6 +121,8 @@ function useHotkey(hotkey, callback, options = {}) {
106
121
  registration.callback = callback;
107
122
  registration.setOptions(optionsWithoutTarget);
108
123
  }
124
+ lastHotkeyString = hotkeyString;
125
+ lastTarget = finalTarget;
109
126
  }, { immediate: true });
110
127
  onUnmounted(() => {
111
128
  stopWatcher();
@@ -1 +1 @@
1
- {"version":3,"file":"useHotkey.js","names":[],"sources":["../src/useHotkey.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport {\n detectPlatform,\n formatHotkey,\n getHotkeyManager,\n rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type {\n Hotkey,\n HotkeyCallback,\n HotkeyOptions,\n HotkeyRegistrationHandle,\n RegisterableHotkey,\n} from '@tanstack/hotkeys'\nimport type { MaybeRefOrGetter } from 'vue'\n\nexport interface UseHotkeyOptions extends Omit<\n HotkeyOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the hotkey is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This composable automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const count = ref(0)\n *\n * // Callback always has access to latest count value\n * useHotkey('Mod+S', (event, { hotkey }) => {\n * console.log(`Save triggered, count is ${count.value}`)\n * handleSave()\n * })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const isOpen = ref(false)\n *\n * // enabled option is reactive\n * useHotkey('Escape', () => {\n * isOpen.value = false\n * }, { enabled: isOpen })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const editorRef = ref<HTMLDivElement | null>(null)\n *\n * // Scoped to a specific element\n * useHotkey('Mod+S', () => {\n * save()\n * }, { target: editorRef })\n * </script>\n *\n * <template>\n * <div ref=\"editorRef\">...</div>\n * </template>\n * ```\n */\nexport function useHotkey(\n hotkey: MaybeRefOrGetter<RegisterableHotkey>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeyOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getHotkeyManager()\n\n let registration: HotkeyRegistrationHandle | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedHotkey = resolveMaybeRefOrGetter(hotkey)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkey,\n ...resolvedOptions,\n } as UseHotkeyOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedHotkey,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n // Normalize to hotkey string\n const platform = mergedOptions.platform ?? detectPlatform()\n const hotkeyString: Hotkey =\n typeof resolvedHotkey === 'string'\n ? resolvedHotkey\n : (formatHotkey(\n rawHotkeyToParsedHotkey(resolvedHotkey as any, platform),\n ) as Hotkey)\n\n // Resolve target\n const finalTarget =\n resolvedTarget ?? (typeof document !== 'undefined' ? document : null)\n\n if (!finalTarget) {\n return\n }\n\n // Unregister previous registration if it exists\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n // Register the hotkey\n registration = manager.register(hotkeyString, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n // Update callback and options\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGA,SAAgB,UACd,QACA,UACA,UAA8C,EAAE,EAC1C;CACN,MAAM,iBAAiB,0BAA0B;CACjD,MAAM,UAAU,kBAAkB;CAElC,IAAI,eAAgD;CAGpD,MAAM,cAAc,YACZ;EACJ,MAAM,iBAAiB,wBAAwB,OAAO;EACtD,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,gBAAgB,eAAe,iBAAiB,qBAAqB;EAEtE,MAAM,WAAW,cAAc,YAAY,gBAAgB;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,iBACC,aACC,wBAAwB,gBAAuB,SAAS,CACzD;EAGP,MAAM,cACJ,mBAAmB,OAAO,aAAa,cAAc,WAAW;AAElE,MAAI,CAAC,YACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAGD,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;IAGjD,EAAE,WAAW,MAAM,CACpB;AAGD,mBAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,GAAG,MAAM,MAAM"}
1
+ {"version":3,"file":"useHotkey.js","names":[],"sources":["../src/useHotkey.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport {\n detectPlatform,\n formatHotkey,\n getHotkeyManager,\n rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type {\n Hotkey,\n HotkeyCallback,\n HotkeyOptions,\n HotkeyRegistrationHandle,\n RegisterableHotkey,\n} from '@tanstack/hotkeys'\nimport type { MaybeRefOrGetter } from 'vue'\n\nexport interface UseHotkeyOptions extends Omit<\n HotkeyOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the hotkey is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This composable automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const count = ref(0)\n *\n * // Callback always has access to latest count value\n * useHotkey('Mod+S', (event, { hotkey }) => {\n * console.log(`Save triggered, count is ${count.value}`)\n * handleSave()\n * })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const isOpen = ref(false)\n *\n * // enabled option is reactive\n * useHotkey('Escape', () => {\n * isOpen.value = false\n * }, { enabled: isOpen })\n * </script>\n * ```\n *\n * @example\n * ```vue\n * <script setup>\n * import { ref } from 'vue'\n * import { useHotkey } from '@tanstack/vue-hotkeys'\n *\n * const editorRef = ref<HTMLDivElement | null>(null)\n *\n * // Scoped to a specific element\n * useHotkey('Mod+S', () => {\n * save()\n * }, { target: editorRef })\n * </script>\n *\n * <template>\n * <div ref=\"editorRef\">...</div>\n * </template>\n * ```\n */\nexport function useHotkey(\n hotkey: MaybeRefOrGetter<RegisterableHotkey>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeyOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getHotkeyManager()\n\n let registration: HotkeyRegistrationHandle | null = null\n let lastHotkeyString: Hotkey | null = null\n let lastTarget: HTMLElement | Document | Window | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedHotkey = resolveMaybeRefOrGetter(hotkey)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkey,\n ...resolvedOptions,\n } as UseHotkeyOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedHotkey,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedHotkey, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n // Normalize to hotkey string\n const platform = mergedOptions.platform ?? detectPlatform()\n const hotkeyString: Hotkey =\n typeof resolvedHotkey === 'string'\n ? resolvedHotkey\n : (formatHotkey(\n rawHotkeyToParsedHotkey(resolvedHotkey as any, platform),\n ) as Hotkey)\n\n // Resolve target\n const finalTarget =\n resolvedTarget === undefined\n ? typeof document !== 'undefined'\n ? document\n : null\n : resolvedTarget\n\n if (!finalTarget) {\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n lastHotkeyString = null\n lastTarget = null\n return\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n if (\n registration?.isActive &&\n lastHotkeyString === hotkeyString &&\n lastTarget === finalTarget\n ) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n return\n }\n\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n registration = manager.register(hotkeyString, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n\n lastHotkeyString = hotkeyString\n lastTarget = finalTarget\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGA,SAAgB,UACd,QACA,UACA,UAA8C,EAAE,EAC1C;CACN,MAAM,iBAAiB,0BAA0B;CACjD,MAAM,UAAU,kBAAkB;CAElC,IAAI,eAAgD;CACpD,IAAI,mBAAkC;CACtC,IAAI,aAAqD;CAGzD,MAAM,cAAc,YACZ;EACJ,MAAM,iBAAiB,wBAAwB,OAAO;EACtD,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,gBAAgB,eAAe,iBAAiB,qBAAqB;EAEtE,MAAM,WAAW,cAAc,YAAY,gBAAgB;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,iBACC,aACC,wBAAwB,gBAAuB,SAAS,CACzD;EAGP,MAAM,cACJ,mBAAmB,SACf,OAAO,aAAa,cAClB,WACA,OACF;AAEN,MAAI,CAAC,aAAa;AAChB,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;AAEjB,sBAAmB;AACnB,gBAAa;AACb;;EAIF,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAED,MACE,cAAc,YACd,qBAAqB,gBACrB,eAAe,aACf;AACA,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;AAC7C;;AAGF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;AAGjB,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAEF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAG/C,qBAAmB;AACnB,eAAa;IAEf,EAAE,WAAW,MAAM,CACpB;AAGD,mBAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,GAAG,MAAM,MAAM"}
@@ -53,6 +53,8 @@ function useHotkeySequence(sequence, callback, options = {}) {
53
53
  const defaultOptions = require_HotkeysProviderContext.useDefaultHotkeysOptions();
54
54
  const manager = (0, _tanstack_hotkeys.getSequenceManager)();
55
55
  let registration = null;
56
+ let lastSequenceKey = null;
57
+ let lastTarget = null;
56
58
  const stopWatcher = (0, vue.watch)(() => {
57
59
  const resolvedSequence = resolveMaybeRefOrGetter(sequence);
58
60
  const resolvedOptions = resolveMaybeRefOrGetter(options);
@@ -67,18 +69,31 @@ function useHotkeySequence(sequence, callback, options = {}) {
67
69
  resolvedTarget: mergedOptions.target === void 0 ? void 0 : resolveMaybeRefOrGetter(mergedOptions.target)
68
70
  };
69
71
  }, ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {
70
- if (resolvedEnabled === false || resolvedSequence.length === 0) return;
71
- const finalTarget = resolvedTarget ?? (typeof document !== "undefined" ? document : null);
72
- if (!finalTarget) return;
73
- if (registration?.isActive) {
74
- registration.unregister();
75
- registration = null;
72
+ const finalTarget = resolvedTarget === void 0 ? typeof document !== "undefined" ? document : null : resolvedTarget;
73
+ if (resolvedSequence.length === 0 || !finalTarget) {
74
+ if (registration?.isActive) {
75
+ registration.unregister();
76
+ registration = null;
77
+ }
78
+ lastSequenceKey = null;
79
+ lastTarget = null;
80
+ return;
76
81
  }
82
+ const sequenceKey = (0, _tanstack_hotkeys.formatHotkeySequence)(resolvedSequence);
77
83
  const { target: _target, enabled: _enabled, ...restOptions } = mergedOptions;
78
84
  const optionsWithoutTarget = {
79
85
  ...restOptions,
80
86
  ...resolvedEnabled === void 0 ? {} : { enabled: resolvedEnabled }
81
87
  };
88
+ if (registration?.isActive && lastSequenceKey === sequenceKey && lastTarget === finalTarget) {
89
+ registration.callback = callback;
90
+ registration.setOptions(optionsWithoutTarget);
91
+ return;
92
+ }
93
+ if (registration?.isActive) {
94
+ registration.unregister();
95
+ registration = null;
96
+ }
82
97
  registration = manager.register(resolvedSequence, callback, {
83
98
  ...optionsWithoutTarget,
84
99
  target: finalTarget
@@ -87,6 +102,8 @@ function useHotkeySequence(sequence, callback, options = {}) {
87
102
  registration.callback = callback;
88
103
  registration.setOptions(optionsWithoutTarget);
89
104
  }
105
+ lastSequenceKey = sequenceKey;
106
+ lastTarget = finalTarget;
90
107
  }, { immediate: true });
91
108
  (0, vue.onUnmounted)(() => {
92
109
  stopWatcher();
@@ -1 +1 @@
1
- {"version":3,"file":"useHotkeySequence.cjs","names":["useDefaultHotkeysOptions"],"sources":["../src/useHotkeySequence.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport { getSequenceManager } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type { MaybeRefOrGetter } from 'vue'\nimport type {\n HotkeyCallback,\n HotkeySequence,\n SequenceOptions,\n SequenceRegistrationHandle,\n} from '@tanstack/hotkeys'\n\nexport interface UseHotkeySequenceOptions extends Omit<\n SequenceOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the sequence is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard shortcut sequence (Vim-style).\n *\n * This composable allows you to register multi-key sequences like 'g g' or 'd d'\n * that trigger when the full sequence is pressed within a timeout.\n *\n * Each step may include modifiers. You can chain the same modifier across\n * steps (e.g. `Shift+R` then `Shift+T`). Modifier-only keydown events (Shift,\n * Control, Alt, or Meta pressed alone) are ignored while matching—they do not\n * advance the sequence or reset progress.\n *\n * @param sequence - Array of hotkey strings that form the sequence\n * @param callback - Function to call when the sequence is completed\n * @param options - Options for the sequence behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { useHotkeySequence } from '@tanstack/vue-hotkeys'\n *\n * // 'g g' to go to top\n * useHotkeySequence(['G', 'G'], () => {\n * scrollToTop()\n * })\n *\n * // 'd d' to delete line\n * useHotkeySequence(['D', 'D'], () => {\n * deleteLine()\n * })\n *\n * // 'd i w' to delete inner word\n * useHotkeySequence(['D', 'I', 'W'], () => {\n * deleteInnerWord()\n * }, { timeout: 500 })\n *\n * // Same modifier on consecutive steps (bare Shift between chords is ignored)\n * useHotkeySequence(['Shift+R', 'Shift+T'], () => {\n * nextAction()\n * })\n * </script>\n *\n * <template>\n * <div>...</div>\n * </template>\n * ```\n */\nexport function useHotkeySequence(\n sequence: MaybeRefOrGetter<HotkeySequence>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeySequenceOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getSequenceManager()\n\n let registration: SequenceRegistrationHandle | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedSequence = resolveMaybeRefOrGetter(sequence)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkeySequence,\n ...resolvedOptions,\n } as UseHotkeySequenceOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedSequence,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n if (resolvedEnabled === false || resolvedSequence.length === 0) {\n return\n }\n\n // Resolve target\n const finalTarget =\n resolvedTarget ?? (typeof document !== 'undefined' ? document : null)\n\n if (!finalTarget) {\n return\n }\n\n // Unregister previous registration if it exists\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n // Register the sequence\n registration = manager.register(resolvedSequence, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n // Update callback and options\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,SAAgB,kBACd,UACA,UACA,UAAsD,EAAE,EAClD;CACN,MAAM,iBAAiBA,yDAA0B;CACjD,MAAM,qDAA8B;CAEpC,IAAI,eAAkD;CAGtD,MAAM,mCACE;EACJ,MAAM,mBAAmB,wBAAwB,SAAS;EAC1D,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,kBAAkB,eAAe,iBAAiB,qBAAqB;AACxE,MAAI,oBAAoB,SAAS,iBAAiB,WAAW,EAC3D;EAIF,MAAM,cACJ,mBAAmB,OAAO,aAAa,cAAc,WAAW;AAElE,MAAI,CAAC,YACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAGD,iBAAe,QAAQ,SAAS,kBAAkB,UAAU;GAC1D,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;IAGjD,EAAE,WAAW,MAAM,CACpB;AAGD,4BAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,kBAAS,MAAM"}
1
+ {"version":3,"file":"useHotkeySequence.cjs","names":["useDefaultHotkeysOptions"],"sources":["../src/useHotkeySequence.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport { formatHotkeySequence, getSequenceManager } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type { MaybeRefOrGetter } from 'vue'\nimport type {\n HotkeyCallback,\n HotkeySequence,\n SequenceOptions,\n SequenceRegistrationHandle,\n} from '@tanstack/hotkeys'\n\nexport interface UseHotkeySequenceOptions extends Omit<\n SequenceOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the sequence is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard shortcut sequence (Vim-style).\n *\n * This composable allows you to register multi-key sequences like 'g g' or 'd d'\n * that trigger when the full sequence is pressed within a timeout.\n *\n * Each step may include modifiers. You can chain the same modifier across\n * steps (e.g. `Shift+R` then `Shift+T`). Modifier-only keydown events (Shift,\n * Control, Alt, or Meta pressed alone) are ignored while matching—they do not\n * advance the sequence or reset progress.\n *\n * @param sequence - Array of hotkey strings that form the sequence\n * @param callback - Function to call when the sequence is completed\n * @param options - Options for the sequence behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { useHotkeySequence } from '@tanstack/vue-hotkeys'\n *\n * // 'g g' to go to top\n * useHotkeySequence(['G', 'G'], () => {\n * scrollToTop()\n * })\n *\n * // 'd d' to delete line\n * useHotkeySequence(['D', 'D'], () => {\n * deleteLine()\n * })\n *\n * // 'd i w' to delete inner word\n * useHotkeySequence(['D', 'I', 'W'], () => {\n * deleteInnerWord()\n * }, { timeout: 500 })\n *\n * // Same modifier on consecutive steps (bare Shift between chords is ignored)\n * useHotkeySequence(['Shift+R', 'Shift+T'], () => {\n * nextAction()\n * })\n * </script>\n *\n * <template>\n * <div>...</div>\n * </template>\n * ```\n */\nexport function useHotkeySequence(\n sequence: MaybeRefOrGetter<HotkeySequence>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeySequenceOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getSequenceManager()\n\n let registration: SequenceRegistrationHandle | null = null\n let lastSequenceKey: string | null = null\n let lastTarget: HTMLElement | Document | Window | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedSequence = resolveMaybeRefOrGetter(sequence)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkeySequence,\n ...resolvedOptions,\n } as UseHotkeySequenceOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedSequence,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n const finalTarget =\n resolvedTarget === undefined\n ? typeof document !== 'undefined'\n ? document\n : null\n : resolvedTarget\n\n if (resolvedSequence.length === 0 || !finalTarget) {\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n lastSequenceKey = null\n lastTarget = null\n return\n }\n\n const sequenceKey = formatHotkeySequence(resolvedSequence)\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n if (\n registration?.isActive &&\n lastSequenceKey === sequenceKey &&\n lastTarget === finalTarget\n ) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n return\n }\n\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n registration = manager.register(resolvedSequence, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n\n lastSequenceKey = sequenceKey\n lastTarget = finalTarget\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,SAAgB,kBACd,UACA,UACA,UAAsD,EAAE,EAClD;CACN,MAAM,iBAAiBA,yDAA0B;CACjD,MAAM,qDAA8B;CAEpC,IAAI,eAAkD;CACtD,IAAI,kBAAiC;CACrC,IAAI,aAAqD;CAGzD,MAAM,mCACE;EACJ,MAAM,mBAAmB,wBAAwB,SAAS;EAC1D,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,kBAAkB,eAAe,iBAAiB,qBAAqB;EACxE,MAAM,cACJ,mBAAmB,SACf,OAAO,aAAa,cAClB,WACA,OACF;AAEN,MAAI,iBAAiB,WAAW,KAAK,CAAC,aAAa;AACjD,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;AAEjB,qBAAkB;AAClB,gBAAa;AACb;;EAGF,MAAM,0DAAmC,iBAAiB;EAG1D,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAED,MACE,cAAc,YACd,oBAAoB,eACpB,eAAe,aACf;AACA,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;AAC7C;;AAGF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;AAGjB,iBAAe,QAAQ,SAAS,kBAAkB,UAAU;GAC1D,GAAG;GACH,QAAQ;GACT,CAAC;AAEF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAG/C,oBAAkB;AAClB,eAAa;IAEf,EAAE,WAAW,MAAM,CACpB;AAGD,4BAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,kBAAS,MAAM"}
@@ -1,5 +1,5 @@
1
1
  import { useDefaultHotkeysOptions } from "./HotkeysProviderContext.js";
2
- import { getSequenceManager } from "@tanstack/hotkeys";
2
+ import { formatHotkeySequence, getSequenceManager } from "@tanstack/hotkeys";
3
3
  import { onUnmounted, unref, watch } from "vue";
4
4
 
5
5
  //#region src/useHotkeySequence.ts
@@ -53,6 +53,8 @@ function useHotkeySequence(sequence, callback, options = {}) {
53
53
  const defaultOptions = useDefaultHotkeysOptions();
54
54
  const manager = getSequenceManager();
55
55
  let registration = null;
56
+ let lastSequenceKey = null;
57
+ let lastTarget = null;
56
58
  const stopWatcher = watch(() => {
57
59
  const resolvedSequence = resolveMaybeRefOrGetter(sequence);
58
60
  const resolvedOptions = resolveMaybeRefOrGetter(options);
@@ -67,18 +69,31 @@ function useHotkeySequence(sequence, callback, options = {}) {
67
69
  resolvedTarget: mergedOptions.target === void 0 ? void 0 : resolveMaybeRefOrGetter(mergedOptions.target)
68
70
  };
69
71
  }, ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {
70
- if (resolvedEnabled === false || resolvedSequence.length === 0) return;
71
- const finalTarget = resolvedTarget ?? (typeof document !== "undefined" ? document : null);
72
- if (!finalTarget) return;
73
- if (registration?.isActive) {
74
- registration.unregister();
75
- registration = null;
72
+ const finalTarget = resolvedTarget === void 0 ? typeof document !== "undefined" ? document : null : resolvedTarget;
73
+ if (resolvedSequence.length === 0 || !finalTarget) {
74
+ if (registration?.isActive) {
75
+ registration.unregister();
76
+ registration = null;
77
+ }
78
+ lastSequenceKey = null;
79
+ lastTarget = null;
80
+ return;
76
81
  }
82
+ const sequenceKey = formatHotkeySequence(resolvedSequence);
77
83
  const { target: _target, enabled: _enabled, ...restOptions } = mergedOptions;
78
84
  const optionsWithoutTarget = {
79
85
  ...restOptions,
80
86
  ...resolvedEnabled === void 0 ? {} : { enabled: resolvedEnabled }
81
87
  };
88
+ if (registration?.isActive && lastSequenceKey === sequenceKey && lastTarget === finalTarget) {
89
+ registration.callback = callback;
90
+ registration.setOptions(optionsWithoutTarget);
91
+ return;
92
+ }
93
+ if (registration?.isActive) {
94
+ registration.unregister();
95
+ registration = null;
96
+ }
82
97
  registration = manager.register(resolvedSequence, callback, {
83
98
  ...optionsWithoutTarget,
84
99
  target: finalTarget
@@ -87,6 +102,8 @@ function useHotkeySequence(sequence, callback, options = {}) {
87
102
  registration.callback = callback;
88
103
  registration.setOptions(optionsWithoutTarget);
89
104
  }
105
+ lastSequenceKey = sequenceKey;
106
+ lastTarget = finalTarget;
90
107
  }, { immediate: true });
91
108
  onUnmounted(() => {
92
109
  stopWatcher();
@@ -1 +1 @@
1
- {"version":3,"file":"useHotkeySequence.js","names":[],"sources":["../src/useHotkeySequence.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport { getSequenceManager } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type { MaybeRefOrGetter } from 'vue'\nimport type {\n HotkeyCallback,\n HotkeySequence,\n SequenceOptions,\n SequenceRegistrationHandle,\n} from '@tanstack/hotkeys'\n\nexport interface UseHotkeySequenceOptions extends Omit<\n SequenceOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the sequence is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard shortcut sequence (Vim-style).\n *\n * This composable allows you to register multi-key sequences like 'g g' or 'd d'\n * that trigger when the full sequence is pressed within a timeout.\n *\n * Each step may include modifiers. You can chain the same modifier across\n * steps (e.g. `Shift+R` then `Shift+T`). Modifier-only keydown events (Shift,\n * Control, Alt, or Meta pressed alone) are ignored while matching—they do not\n * advance the sequence or reset progress.\n *\n * @param sequence - Array of hotkey strings that form the sequence\n * @param callback - Function to call when the sequence is completed\n * @param options - Options for the sequence behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { useHotkeySequence } from '@tanstack/vue-hotkeys'\n *\n * // 'g g' to go to top\n * useHotkeySequence(['G', 'G'], () => {\n * scrollToTop()\n * })\n *\n * // 'd d' to delete line\n * useHotkeySequence(['D', 'D'], () => {\n * deleteLine()\n * })\n *\n * // 'd i w' to delete inner word\n * useHotkeySequence(['D', 'I', 'W'], () => {\n * deleteInnerWord()\n * }, { timeout: 500 })\n *\n * // Same modifier on consecutive steps (bare Shift between chords is ignored)\n * useHotkeySequence(['Shift+R', 'Shift+T'], () => {\n * nextAction()\n * })\n * </script>\n *\n * <template>\n * <div>...</div>\n * </template>\n * ```\n */\nexport function useHotkeySequence(\n sequence: MaybeRefOrGetter<HotkeySequence>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeySequenceOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getSequenceManager()\n\n let registration: SequenceRegistrationHandle | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedSequence = resolveMaybeRefOrGetter(sequence)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkeySequence,\n ...resolvedOptions,\n } as UseHotkeySequenceOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedSequence,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n if (resolvedEnabled === false || resolvedSequence.length === 0) {\n return\n }\n\n // Resolve target\n const finalTarget =\n resolvedTarget ?? (typeof document !== 'undefined' ? document : null)\n\n if (!finalTarget) {\n return\n }\n\n // Unregister previous registration if it exists\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n // Register the sequence\n registration = manager.register(resolvedSequence, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n // Update callback and options\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,SAAgB,kBACd,UACA,UACA,UAAsD,EAAE,EAClD;CACN,MAAM,iBAAiB,0BAA0B;CACjD,MAAM,UAAU,oBAAoB;CAEpC,IAAI,eAAkD;CAGtD,MAAM,cAAc,YACZ;EACJ,MAAM,mBAAmB,wBAAwB,SAAS;EAC1D,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,kBAAkB,eAAe,iBAAiB,qBAAqB;AACxE,MAAI,oBAAoB,SAAS,iBAAiB,WAAW,EAC3D;EAIF,MAAM,cACJ,mBAAmB,OAAO,aAAa,cAAc,WAAW;AAElE,MAAI,CAAC,YACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAGD,iBAAe,QAAQ,SAAS,kBAAkB,UAAU;GAC1D,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;IAGjD,EAAE,WAAW,MAAM,CACpB;AAGD,mBAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,GAAG,MAAM,MAAM"}
1
+ {"version":3,"file":"useHotkeySequence.js","names":[],"sources":["../src/useHotkeySequence.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport { formatHotkeySequence, getSequenceManager } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type { MaybeRefOrGetter } from 'vue'\nimport type {\n HotkeyCallback,\n HotkeySequence,\n SequenceOptions,\n SequenceRegistrationHandle,\n} from '@tanstack/hotkeys'\n\nexport interface UseHotkeySequenceOptions extends Omit<\n SequenceOptions,\n 'enabled' | 'target'\n> {\n /**\n * Whether the sequence is active.\n * Can be a Ref, a getter function, or a boolean value.\n * Defaults to true.\n */\n enabled?: MaybeRefOrGetter<boolean>\n /**\n * The DOM element to attach the event listener to.\n * Can be a Ref, a getter function, direct DOM element, or null.\n * Defaults to document.\n */\n target?: MaybeRefOrGetter<HTMLElement | Document | Window | null>\n}\n\n/**\n * Vue composable for registering a keyboard shortcut sequence (Vim-style).\n *\n * This composable allows you to register multi-key sequences like 'g g' or 'd d'\n * that trigger when the full sequence is pressed within a timeout.\n *\n * Each step may include modifiers. You can chain the same modifier across\n * steps (e.g. `Shift+R` then `Shift+T`). Modifier-only keydown events (Shift,\n * Control, Alt, or Meta pressed alone) are ignored while matching—they do not\n * advance the sequence or reset progress.\n *\n * @param sequence - Array of hotkey strings that form the sequence\n * @param callback - Function to call when the sequence is completed\n * @param options - Options for the sequence behavior\n *\n * @example\n * ```vue\n * <script setup>\n * import { useHotkeySequence } from '@tanstack/vue-hotkeys'\n *\n * // 'g g' to go to top\n * useHotkeySequence(['G', 'G'], () => {\n * scrollToTop()\n * })\n *\n * // 'd d' to delete line\n * useHotkeySequence(['D', 'D'], () => {\n * deleteLine()\n * })\n *\n * // 'd i w' to delete inner word\n * useHotkeySequence(['D', 'I', 'W'], () => {\n * deleteInnerWord()\n * }, { timeout: 500 })\n *\n * // Same modifier on consecutive steps (bare Shift between chords is ignored)\n * useHotkeySequence(['Shift+R', 'Shift+T'], () => {\n * nextAction()\n * })\n * </script>\n *\n * <template>\n * <div>...</div>\n * </template>\n * ```\n */\nexport function useHotkeySequence(\n sequence: MaybeRefOrGetter<HotkeySequence>,\n callback: HotkeyCallback,\n options: MaybeRefOrGetter<UseHotkeySequenceOptions> = {},\n): void {\n const defaultOptions = useDefaultHotkeysOptions()\n const manager = getSequenceManager()\n\n let registration: SequenceRegistrationHandle | null = null\n let lastSequenceKey: string | null = null\n let lastTarget: HTMLElement | Document | Window | null = null\n\n // Watch for changes to reactive dependencies\n const stopWatcher = watch(\n () => {\n const resolvedSequence = resolveMaybeRefOrGetter(sequence)\n const resolvedOptions = resolveMaybeRefOrGetter(options)\n const mergedOptions = {\n ...defaultOptions.hotkeySequence,\n ...resolvedOptions,\n } as UseHotkeySequenceOptions\n const resolvedEnabled =\n mergedOptions.enabled === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.enabled)\n const resolvedTarget =\n mergedOptions.target === undefined\n ? undefined\n : resolveMaybeRefOrGetter(mergedOptions.target)\n\n return {\n resolvedSequence,\n mergedOptions,\n resolvedEnabled,\n resolvedTarget,\n }\n },\n ({ resolvedSequence, mergedOptions, resolvedEnabled, resolvedTarget }) => {\n const finalTarget =\n resolvedTarget === undefined\n ? typeof document !== 'undefined'\n ? document\n : null\n : resolvedTarget\n\n if (resolvedSequence.length === 0 || !finalTarget) {\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n lastSequenceKey = null\n lastTarget = null\n return\n }\n\n const sequenceKey = formatHotkeySequence(resolvedSequence)\n\n // Extract options without target (target is handled separately)\n const {\n target: _target,\n enabled: _enabled,\n ...restOptions\n } = mergedOptions\n const optionsWithoutTarget = {\n ...restOptions,\n ...(resolvedEnabled === undefined ? {} : { enabled: resolvedEnabled }),\n }\n\n if (\n registration?.isActive &&\n lastSequenceKey === sequenceKey &&\n lastTarget === finalTarget\n ) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n return\n }\n\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n\n registration = manager.register(resolvedSequence, callback, {\n ...optionsWithoutTarget,\n target: finalTarget,\n })\n\n if (registration.isActive) {\n registration.callback = callback\n registration.setOptions(optionsWithoutTarget)\n }\n\n lastSequenceKey = sequenceKey\n lastTarget = finalTarget\n },\n { immediate: true },\n )\n\n // Cleanup on unmount\n onUnmounted(() => {\n stopWatcher()\n if (registration?.isActive) {\n registration.unregister()\n registration = null\n }\n })\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,SAAgB,kBACd,UACA,UACA,UAAsD,EAAE,EAClD;CACN,MAAM,iBAAiB,0BAA0B;CACjD,MAAM,UAAU,oBAAoB;CAEpC,IAAI,eAAkD;CACtD,IAAI,kBAAiC;CACrC,IAAI,aAAqD;CAGzD,MAAM,cAAc,YACZ;EACJ,MAAM,mBAAmB,wBAAwB,SAAS;EAC1D,MAAM,kBAAkB,wBAAwB,QAAQ;EACxD,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;AAUD,SAAO;GACL;GACA;GACA,iBAXA,cAAc,YAAY,SACtB,SACA,wBAAwB,cAAc,QAAQ;GAUlD,gBARA,cAAc,WAAW,SACrB,SACA,wBAAwB,cAAc,OAAO;GAOlD;KAEF,EAAE,kBAAkB,eAAe,iBAAiB,qBAAqB;EACxE,MAAM,cACJ,mBAAmB,SACf,OAAO,aAAa,cAClB,WACA,OACF;AAEN,MAAI,iBAAiB,WAAW,KAAK,CAAC,aAAa;AACjD,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;AAEjB,qBAAkB;AAClB,gBAAa;AACb;;EAGF,MAAM,cAAc,qBAAqB,iBAAiB;EAG1D,MAAM,EACJ,QAAQ,SACR,SAAS,UACT,GAAG,gBACD;EACJ,MAAM,uBAAuB;GAC3B,GAAG;GACH,GAAI,oBAAoB,SAAY,EAAE,GAAG,EAAE,SAAS,iBAAiB;GACtE;AAED,MACE,cAAc,YACd,oBAAoB,eACpB,eAAe,aACf;AACA,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;AAC7C;;AAGF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;AAGjB,iBAAe,QAAQ,SAAS,kBAAkB,UAAU;GAC1D,GAAG;GACH,QAAQ;GACT,CAAC;AAEF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAG/C,oBAAkB;AAClB,eAAa;IAEf,EAAE,WAAW,MAAM,CACpB;AAGD,mBAAkB;AAChB,eAAa;AACb,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;GAEjB;;AAGJ,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,GAAG,MAAM,MAAM"}
@@ -0,0 +1,45 @@
1
+ const require_HotkeysProviderContext = require('./HotkeysProviderContext.cjs');
2
+ let _tanstack_hotkeys = require("@tanstack/hotkeys");
3
+ let vue = require("vue");
4
+ let _tanstack_vue_store = require("@tanstack/vue-store");
5
+
6
+ //#region src/useHotkeySequenceRecorder.ts
7
+ /**
8
+ * Vue composable for recording multi-chord sequences (Vim-style shortcuts).
9
+ */
10
+ function useHotkeySequenceRecorder(options) {
11
+ const defaultOptions = require_HotkeysProviderContext.useDefaultHotkeysOptions();
12
+ const recorder = new _tanstack_hotkeys.HotkeySequenceRecorder(resolveHotkeySequenceRecorderOptions(options, defaultOptions));
13
+ const isRecording = (0, _tanstack_vue_store.useStore)(recorder.store, (state) => state.isRecording);
14
+ const steps = (0, _tanstack_vue_store.useStore)(recorder.store, (state) => state.steps);
15
+ const recordedSequence = (0, _tanstack_vue_store.useStore)(recorder.store, (state) => state.recordedSequence);
16
+ const stopWatcher = (0, vue.watch)(() => resolveHotkeySequenceRecorderOptions(options, defaultOptions), (resolvedOptions) => {
17
+ recorder.setOptions(resolvedOptions);
18
+ }, { immediate: true });
19
+ (0, vue.onUnmounted)(() => {
20
+ stopWatcher();
21
+ recorder.destroy();
22
+ });
23
+ return {
24
+ isRecording,
25
+ steps,
26
+ recordedSequence,
27
+ startRecording: () => recorder.start(),
28
+ stopRecording: () => recorder.stop(),
29
+ cancelRecording: () => recorder.cancel(),
30
+ commitRecording: () => recorder.commit()
31
+ };
32
+ }
33
+ function resolveHotkeySequenceRecorderOptions(options, defaultOptions) {
34
+ return {
35
+ ...defaultOptions.hotkeySequenceRecorder,
36
+ ...resolveMaybeRefOrGetter(options)
37
+ };
38
+ }
39
+ function resolveMaybeRefOrGetter(value) {
40
+ return typeof value === "function" ? value() : (0, vue.unref)(value);
41
+ }
42
+
43
+ //#endregion
44
+ exports.useHotkeySequenceRecorder = useHotkeySequenceRecorder;
45
+ //# sourceMappingURL=useHotkeySequenceRecorder.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useHotkeySequenceRecorder.cjs","names":["useDefaultHotkeysOptions","HotkeySequenceRecorder"],"sources":["../src/useHotkeySequenceRecorder.ts"],"sourcesContent":["import { onUnmounted, unref, watch } from 'vue'\nimport { useStore } from '@tanstack/vue-store'\nimport { HotkeySequenceRecorder } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProviderContext'\nimport type { MaybeRefOrGetter, Ref } from 'vue'\nimport type {\n HotkeySequence,\n HotkeySequenceRecorderOptions,\n} from '@tanstack/hotkeys'\n\nexport interface VueHotkeySequenceRecorder {\n isRecording: Ref<boolean>\n steps: Ref<HotkeySequence>\n recordedSequence: Ref<HotkeySequence | null>\n startRecording: () => void\n stopRecording: () => void\n cancelRecording: () => void\n commitRecording: () => void\n}\n\n/**\n * Vue composable for recording multi-chord sequences (Vim-style shortcuts).\n */\nexport function useHotkeySequenceRecorder(\n options: MaybeRefOrGetter<HotkeySequenceRecorderOptions>,\n): VueHotkeySequenceRecorder {\n const defaultOptions = useDefaultHotkeysOptions()\n const recorder = new HotkeySequenceRecorder(\n resolveHotkeySequenceRecorderOptions(options, defaultOptions),\n )\n\n const isRecording = useStore(recorder.store, (state) => state.isRecording)\n const steps = useStore(recorder.store, (state) => state.steps)\n const recordedSequence = useStore(\n recorder.store,\n (state) => state.recordedSequence,\n )\n\n const stopWatcher = watch(\n () => resolveHotkeySequenceRecorderOptions(options, defaultOptions),\n (resolvedOptions) => {\n recorder.setOptions(resolvedOptions)\n },\n { immediate: true },\n )\n\n onUnmounted(() => {\n stopWatcher()\n recorder.destroy()\n })\n\n return {\n isRecording: isRecording as Ref<boolean>,\n steps: steps as Ref<HotkeySequence>,\n recordedSequence: recordedSequence as Ref<HotkeySequence | null>,\n startRecording: () => recorder.start(),\n stopRecording: () => recorder.stop(),\n cancelRecording: () => recorder.cancel(),\n commitRecording: () => recorder.commit(),\n }\n}\n\nfunction resolveHotkeySequenceRecorderOptions(\n options: MaybeRefOrGetter<HotkeySequenceRecorderOptions>,\n defaultOptions: ReturnType<typeof useDefaultHotkeysOptions>,\n): HotkeySequenceRecorderOptions {\n return {\n ...defaultOptions.hotkeySequenceRecorder,\n ...resolveMaybeRefOrGetter(options),\n } as HotkeySequenceRecorderOptions\n}\n\nfunction resolveMaybeRefOrGetter<T>(value: MaybeRefOrGetter<T>): T {\n return typeof value === 'function' ? (value as () => T)() : unref(value)\n}\n"],"mappings":";;;;;;;;;AAuBA,SAAgB,0BACd,SAC2B;CAC3B,MAAM,iBAAiBA,yDAA0B;CACjD,MAAM,WAAW,IAAIC,yCACnB,qCAAqC,SAAS,eAAe,CAC9D;CAED,MAAM,gDAAuB,SAAS,QAAQ,UAAU,MAAM,YAAY;CAC1E,MAAM,0CAAiB,SAAS,QAAQ,UAAU,MAAM,MAAM;CAC9D,MAAM,qDACJ,SAAS,QACR,UAAU,MAAM,iBAClB;CAED,MAAM,mCACE,qCAAqC,SAAS,eAAe,GAClE,oBAAoB;AACnB,WAAS,WAAW,gBAAgB;IAEtC,EAAE,WAAW,MAAM,CACpB;AAED,4BAAkB;AAChB,eAAa;AACb,WAAS,SAAS;GAClB;AAEF,QAAO;EACQ;EACN;EACW;EAClB,sBAAsB,SAAS,OAAO;EACtC,qBAAqB,SAAS,MAAM;EACpC,uBAAuB,SAAS,QAAQ;EACxC,uBAAuB,SAAS,QAAQ;EACzC;;AAGH,SAAS,qCACP,SACA,gBAC+B;AAC/B,QAAO;EACL,GAAG,eAAe;EAClB,GAAG,wBAAwB,QAAQ;EACpC;;AAGH,SAAS,wBAA2B,OAA+B;AACjE,QAAO,OAAO,UAAU,aAAc,OAAmB,kBAAS,MAAM"}
@@ -0,0 +1,20 @@
1
+ import { HotkeySequence, HotkeySequenceRecorderOptions } from "@tanstack/hotkeys";
2
+ import { MaybeRefOrGetter, Ref } from "vue";
3
+
4
+ //#region src/useHotkeySequenceRecorder.d.ts
5
+ interface VueHotkeySequenceRecorder {
6
+ isRecording: Ref<boolean>;
7
+ steps: Ref<HotkeySequence>;
8
+ recordedSequence: Ref<HotkeySequence | null>;
9
+ startRecording: () => void;
10
+ stopRecording: () => void;
11
+ cancelRecording: () => void;
12
+ commitRecording: () => void;
13
+ }
14
+ /**
15
+ * Vue composable for recording multi-chord sequences (Vim-style shortcuts).
16
+ */
17
+ declare function useHotkeySequenceRecorder(options: MaybeRefOrGetter<HotkeySequenceRecorderOptions>): VueHotkeySequenceRecorder;
18
+ //#endregion
19
+ export { VueHotkeySequenceRecorder, useHotkeySequenceRecorder };
20
+ //# sourceMappingURL=useHotkeySequenceRecorder.d.cts.map
@@ -0,0 +1,20 @@
1
+ import { HotkeySequence, HotkeySequenceRecorderOptions } from "@tanstack/hotkeys";
2
+ import { MaybeRefOrGetter, Ref } from "vue";
3
+
4
+ //#region src/useHotkeySequenceRecorder.d.ts
5
+ interface VueHotkeySequenceRecorder {
6
+ isRecording: Ref<boolean>;
7
+ steps: Ref<HotkeySequence>;
8
+ recordedSequence: Ref<HotkeySequence | null>;
9
+ startRecording: () => void;
10
+ stopRecording: () => void;
11
+ cancelRecording: () => void;
12
+ commitRecording: () => void;
13
+ }
14
+ /**
15
+ * Vue composable for recording multi-chord sequences (Vim-style shortcuts).
16
+ */
17
+ declare function useHotkeySequenceRecorder(options: MaybeRefOrGetter<HotkeySequenceRecorderOptions>): VueHotkeySequenceRecorder;
18
+ //#endregion
19
+ export { VueHotkeySequenceRecorder, useHotkeySequenceRecorder };
20
+ //# sourceMappingURL=useHotkeySequenceRecorder.d.ts.map